Motion parts
for Expo.
Animated components you copy into your app with one command.
- Action Sheet
- Activity Rings
- Agenda Card
- Aperture Card
- Aspect Picker
- Aurora Veil
- Avatar Stack
- Bar Chart
- Beam Button
- Bloom Menu
- Boarding Pass
- Book Pocket
- Brush Chart
- Chat Thread
- Choice Cards
- Code Field
- Compare Slider
- Confetti Burst
- Copy Chip
- Count Badge
- Countdown
- Credit Score
- Deckfall
- Dock Bar
- Donut Chart
- Dot Loader
- Drift Marquee
- Elastic Slider
- Empty State
- Expand Card
- Expand Toolbar
- Expense Card
- Fade Scroll
- Fan Stack
- Filter Chips
- Flight Track
- Flip Ledger
- Float Field
- Fold Panel
- Gauge Meter
- Glide Radio
- Glint Card
- Gradient Slider
- Grain Drift
- Grow Area
- Heat Grid
- Hold to Confirm
- Ink Check
- Inline Edit
- Intensity Slider
- Letter Morph
- Lift Menu
- Like Burst
- Line Chart
- Liquid Tabs
- Magnet Button
- Marker Highlight
- Money Field
- Month Calendar
- Morph Icon
- Morph Select
- Morph Sheet
- Notice Bar
- Now Playing
- Odometer
- Page Dots
- Pager
- Palette Strip
- Parallax Carousel
- Parallax Header
- Password Meter
- Peek Folder
- Plan Picker
- Plan Toggle
- Pop Dialog
- Pop Menu
- Press Jelly
- Progress Bar
- Pulse Toggle
- Question Deck
- Radar Chart
- Range Slider
- Read More
- Reveal Field
- Ridgeline
- Ring Spinner
- Ripple Field
- Roll Stepper
- Rotation Ruler
- Scan Progress
- Score Matrix
- Scramble Text
- Scroll Stack
- Scroll Tabs
- Search Morph
- Seat Picker
- Segment Bar
- Shine Text
- Side Drawer
- Signature Pad
- Skeleton Sweep
- Slide to Confirm
- Slope Chart
- Slot Text
- Sort Table
- Split Button
- Split Pane
- Star Rating
- Stat Card
- Status Button
- Step Slider
- Step Tracker
- Story Card
- Streak Card
- Stream Graph
- Swatch Picker
- Swipe Row
- Tag Field
- Theme Switch
- Tilt Deck
- Time Wheel
- Timeline
- Tip Bubble
- Toast Stack
- Topic Picker
- Tree View
- Treemap
- Two-Step Button
- Typewriter
- Usage Meter
- Vinyl Player
- Vital Arcs
- Waffle Chart
- Wallet Stack
- Word Cascade
- Word Rotator
- Auth
- Login
- Onboarding
- Paywall
- Profile
See it move.
Every tile below is the real component running in your browser. Touch it, drag it, tap it.
Built like the rest of your app.
On the UI thread
Gestures, springs and shaders stay smooth when JavaScript is busy.
Your source
Copied into your project. Change anything.
Accessible by default
Reduced motion, screen-reader labels, 44 pt targets.
One design language
Shared tokens and three springs. Rebrand everything in one place.
How it works
Read the guideTwo commands to motion.
- 01
Init
Tokens and motion presets$ npx kinetik-ui init - 02
Add
Source and SDK-matched deps$ npx kinetik-ui add glint-card - 03
Ship
Your code. Change anything.components/kinetik/*.tsx✓
Built for AI agents.
Your agent finds, reads and installs components the right way.
- Claude
- Codex
- Cursor
- Gemini
- OpenCode
- Windsurf
- Cline
kinetik-ui mcplist_componentsBrowsesearch_componentsFindget_componentRead sourceget_install_planPlan installget_tokensTheme
Terminal
claude mcp add kinetik-ui -- npx -y kinetik-ui mcp.cursor/mcp.json
{
"mcpServers": {
"kinetik-ui": { "command": "npx", "args": ["-y", "kinetik-ui", "mcp"] }
}
}Terminal (writes ~/.codex/config.toml)
codex mcp add kinetik-ui -- npx -y kinetik-ui mcpopencode.json in your project root
{
"$schema": "https://opencode.ai/config.json",
"mcp": {
"kinetik-ui": {
"type": "local",
"command": ["npx", "-y", "kinetik-ui", "mcp"],
"enabled": true
}
}
}~/.codeium/windsurf/mcp_config.json
{
"mcpServers": {
"kinetik-ui": { "command": "npx", "args": ["-y", "kinetik-ui", "mcp"] }
}
}Claude Desktop, Gemini CLI, Cline and any MCP client
{
"mcpServers": {
"kinetik-ui": { "command": "npx", "args": ["-y", "kinetik-ui", "mcp"] }
}
}/llms.txt.mdon every pagenpx kinetik-ui agents
Eleven kinds of motion.
136 components and 5 screen templates, each with a live demo, a props table and notes on when not to use it.
01BackgroundsAurora Veil · Grain Drift · Ripple Field302CardsAperture Card · Boarding Pass · Book Pocket …2003InteractionBeam Button · Bloom Menu · Copy Chip …1904InputsAspect Picker · Choice Cards · Code Field …3205DisclosureFade Scroll · Lift Menu · Pop Menu …706OverlaysAction Sheet · Pop Dialog · Side Drawer307TextLetter Morph · Marker Highlight · Odometer …908NavigationDock Bar · Morph Sheet · Page Dots …609FeedbackConfetti Burst · Count Badge · Countdown …1210DataActivity Rings · Agenda Card · Avatar Stack …2511Screen templatesAuth · Login · Onboarding …5
Make your app move.
Copy the first component in under a minute.
$ npx kinetik-ui add glint-card