When to use
- Reproducing system notifications in tech content
- A brand's "you've got a notification" feel CTA
- 톤: tech, brand
- Recommended duration: 3–4초
Installation
npx hyperframes add macos-notification
→ compositions/macos-notification.html.
Wiring (overlay on top of the card)
<div data-composition-src="compositions/macos-notification.html"
data-start="12" data-duration="3"
data-track-index="3"
data-width="1080" data-height="1350">
</div>
Parameters
- App icon, title, and body are configured inside the block
짝
- Good fit: tech-family shader transitions
- Avoid:
grain-overlay— interferes with a clean OS UI