gradient-text
Give one short headline quiet premium emphasis: a slow on-brand gradient drifts through the type. One phrase per view; never body copy (readability). Pure CSS; falls back to a solid brand color under prefers-reduced-motion.
Browse reusable Agent Skills, each with a clear purpose and practical guidance.
Give one short headline quiet premium emphasis: a slow on-brand gradient drifts through the type. One phrase per view; never body copy (readability). Pure CSS; falls back to a solid brand color under prefers-reduced-motion.
A soft progressive blur fades content out toward an edge — a premium "more below" affordance for a scrolling list/section. Keep the readable content above the blur. Degrades gracefully where backdrop-filter is unsupported.
Thumbnails trail behind the cursor and fade — a gallery/portfolio hero flourish. One trail area per page; heavy on content pages. Off on touch and under prefers-reduced-motion.
A living GPU shader background rendered in dependency-free WebGL — a distinctive, marketing-grade hero backdrop. One per view; put a scrim behind text. Renders a static frame under prefers-reduced-motion.
Stagger a headline's words (or letters) in on load, one after another. Use for a single hero headline or a title card in a launch video. Honors prefers-reduced-motion. One per screen; never use on body copy or must-read content.
A distinctive GPU shader background rendered in dependency-free WebGL — a marketing-grade hero backdrop. One per view; scrim behind text. Renders a static frame under prefers-reduced-motion.
Add a celebratory particle burst to a like / favorite / reaction button. A delight micro-interaction that fires on user tap only (never on load), bursts on the "like" transition (not un-like), and ships a prefers-reduced-motion fallback. Use when a small, earned moment of positive feedback will feel good — and only one such moment per screen.