Ava Bennett
Product Designer
@avabennettOnline
Analytics
Realtime insight
Components
Interactive building blocks — cards, buttons, disclosure, tabs, toasts and more. Keyboard and reduced-motion aware.
Cards & surfaces
7Tilt me around
Move your cursor across the card.
Spotlight
Hover to sweep the highlight.
Revenue
$48.2k
+12.4%vs last week
Customizable
Upgrade to Pro
Unlock advanced analytics and priority support.
Everything in Free, plus unlimited projects and team seats.
Customizable
Glare Hover
Hover to sweep
Customizable
Interactive showcase
19Holo pass
Aurora Nine
Tilt me — the sheen shifts hue with the pointer.
#0042Rare
Customizable
Customizable
Drag with the pointer or pan with the arrow keys.
Customizable
A drag-and-throw tile wall that wraps forever and drifts while idle.
motiondragcanvas-free
Move around, then hover a target.
Customizable
Page content
Revealed when loading completes.
Loading…
Customizable
Customizable
Drag a card sideways, or use the Left and Right arrow keys to pass or keep it.
Aurora
Northern drift
CalmGradient
Customizable
Drag sideways or use the left and right arrow keys to browse.
Customizable
Drag sideways or use the left and right arrow keys to spin the gallery.
Customizable
Live
Analytics
Realtime insight
New
Automation
Flows that run themselves
Team
Collaboration
Ship together
SOC 2
Security
Locked down by default
Customizable
Lyra
Design systems
Orion
Motion
Vega
Frontend
Rigel
Platform
Mira
Research
Atlas
Infra
Customizable
Interactive
Pixel Pass
Hover to dissolve in.
Customizable
- Space
Nebula
- Fire
Ember
- Ocean
Tide
- Star
Nova
- Sky
Dusk
- Forest
Moss
- Sun
Flare
- Ice
Frost
- Earth
Clay
- Bloom
Iris
Customizable
Hover or focus to spread the cards apart.
Calm
Aurora
Warm
Ember
Cool
Tide
Vivid
Nova
Soft
Dusk
Customizable
Customizable
Analytics
Realtime insight
Automation
Flows that run themselves
Security
SOC 2 by default
Edge Speed
Global CDN
Insights
AI summaries
Customizable
Scroll
Analytics
Realtime insight across every surface
Automation
Flows that run themselves
Collaboration
Ship together, in one place
Security
Locked down by default
Customizable
Press Enter or Space to send the top card to the back.
Customizable
Customizable
Inputs & forms
18Notifications
Customizable
Customizable
Customizable
- React
- Next.js
- Tailwind
Customizable
July 2026
SuMoTuWeThFrSa
ReactTypeScript
Customizable
Overlays
5Right-click here
Data display
10Next.jsReactTypeScriptTailwindMotionCanvas
Slide 1
Before
After
↔
MVDPICLM+2
BrandLiveBetaDeprecatedv2.0
Customizable
- src
- components
- button.tsx
- card.tsx
- lib
- index.ts
- README.md
| Mara Vance | Engineer | 482 | |
| Devon Park | Designer | 197 | |
| Iris Cho | PM | 88 | |
| Leo Mendez | Engineer | 341 |
⌘KCtrlShiftPEsc
Customizable
Mara VanceDevon ParkIris Cho
Customizable
Account settings
Billing
or
EmailSMS
Customizable
Feedback & progress
80%
Customizable
Scroll me ↓
Paragraph 1. The bar at the top fills as this panel scrolls.
Paragraph 2. The bar at the top fills as this panel scrolls.
Paragraph 3. The bar at the top fills as this panel scrolls.
Paragraph 4. The bar at the top fills as this panel scrolls.
Paragraph 5. The bar at the top fills as this panel scrolls.
Paragraph 6. The bar at the top fills as this panel scrolls.
Paragraph 7. The bar at the top fills as this panel scrolls.
Paragraph 8. The bar at the top fills as this panel scrolls.
Paragraph 9. The bar at the top fills as this panel scrolls.
Paragraph 10. The bar at the top fills as this panel scrolls.
Storage68%
Customizable
Payment received
Your invoice has been paid in full.
Storage almost full
You have used 92% of your quota.
Customizable
Loading…Loading…Loading…Loading…
Customizable
No messages yet
When you receive messages, they'll show up here.
Layout & disclosure
4An original animated component kit.
Yes — ARIA wiring and keyboard support throughout.
Everything reads from CSS variables.
Sidebar
Content
Unlimited projects, advanced analytics, and priority support — all in one plan.