foundation · marketing · section
Animated Feature Grid
DRAFTA feature grid with optional CSS reveal. Not a bento collage.
TapKeyboardCSS motionNeutral Professional
Named tokens
Color, type, and space come from the token contract, not one-off hex values.
Live preview
Each asset is a real React surface. Viewport labels match actual widths.
Agent contract
Search, guidance, and implementation stay serializable JSON — no React in the registry.
390px · narrowlight themecomfortablefull motion
Two or three text features. Motion is a short translate/opacity reveal that disables under reduced motion. No Anime.js dependency.
- Use when
- Marketing feature rows that may animate on first view
- Avoid when
- Requiring motion to understand the content
- Pulling Anime.js for a simple reveal
- Visual style
- Neutral Professional
- States
- default, reduced-motion
- Maturity
- DRAFT · v0.1.0 · builtin. Nothing is promoted automatically.
- Themes
- default, dark