Reorder gridExamples
Production-ready Motion snippets for React, JavaScript, and Vue. Copy them into your site or adapt them with AI.
Results
- Reorder grid
Multidimensional reorder
Create Button
Dots Morph Button
Now playing
Curtains: Blinds
Curtains: Clip wipe
Curtains: Doors
Curtains: Fade
Curtains: Iris
Curtains: Iris from click
Curtains: Blinds
Curtains: Clip wipe
Curtains: Doors
Curtains: Fade
Curtains: Iris
Curtains: Iris from click
Curtains: Mixed effects
Curtains: Pixels
Curtains: Scope
Curtains: Shutter
Curtains: Stagger wipe
Curtains: Wipe
Clerk: User Button
Layout Anchor
Create Button
Dots Morph Button
iOS App Folder
AnimateView: Clip path
AnimateView: Reorder items
AnimateView: Toggle
AnimateView: Transition types
Reorder items
Shared layout animation
iOS App Folder
To-do list
To-do list
Base UI: Switch
Base UI: Tabs
Base UI: Toggle group
Family-style dialog
Family-style dialog
Family-style dialog
Hold to confirm
Multi state badge
Scale correction
Hold to confirm
Multi state badge
Hold to confirm
Multi state badge
Radix: Accordion
Radix: Switch
Radix: Toggle Group
Radix: Toolbar
iOS App Store
Modal: Shared layout
Tab select
Accordion
Line graph
Reveal text effect
Reorder animation
Shared layout animation
iOS App Store
iOS App Store: Layout animation
Tab select
Line graph
Accordion
Aspect Ratio
Bounce Easing
Radix: Tabs
Modal: Shared layout
Aspect ratio
Bounce easing
Layout animation
Reveal text effect
Radix: Progress
Radix: Radio Group
Radix: Switch
Radix: Tabs
Radix: Toggle Group
Radix: Toolbar
Tab select
AnimateView: App Store
iOS App Store
Drag with spring follow
Reorder animation
Lightbox
Page wipe
Layout animation
Shared view animation
View animation
Layout animation
Motion along a path
Shared layout animation
Pull example source straight into Cursor, Claude Code, and any MCP-aware agent.
Premium examples are searchable for Motion+ members through the Motion AI Kit.
Learn more about Motion+