ButtonbuttonA simple button that animates on hover and tap.
Clipped Circleclipped-circleA cursor-following spotlight effect that reveals a soft glowing circle wherever the user moves their mouse inside the container.
Command Menucommand-menuA composable ⌘K command palette with fuzzy search, custom groups, built-in theme switcher, and animated content reveal.
Copy ButtoncopyA copy button component with a variety of styles and animations.
Count Upcount-upAn animated number counter that springs to its target value when it enters the viewport, with support for decimals, separators, and direction.
CursorcursorAn animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations.
Cursorcursor-primitiveAn animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations.
Copy Button Demodemo-copyDemo showing a copy button.
Cursor Demodemo-cursorDemo showing a cursor.
Floating Tooltipfloating-tooltipA floating tooltip component.
Glow ButtonglowA button with an animated conic-gradient glow layer behind it. Supports rotate, pulse, breathe, colorShift, flowHorizontal and static modes.
Glowing Badgeglowing-badgeBadge with an animated pulsing glow dot. Supports status variants: default, success, warning, error, info.
HighlighthighlightAn animated highlight component that tracks elements with smooth spring animations.
KbdkbdKeyboard key and shortcut display component with a soft, minimal key style.
Magnetic Buttonmagnetic-buttonA button that magnetically follows cursor proximity with spring physics. Smoothly snaps back when the cursor leaves.
Math Graphmath-graphA real-time visual math function builder with animated SVG curves, a pan/zoom canvas, crosshair tooltip, and support for multiple expressions simultaneously.
Orbiting Skillsorbiting-skillsAnimated skill badges that orbit a center element. On desktop the ring follows the cursor on hover; on mobile the ring is always visible.
Progressive Blurprogressive-blurTop and bottom progressive blur overlays that stack multiple backdrop-filter layers to produce a smooth edge-to-transparent blur effect.
Refresh ButtonrefreshAn icon button that spins on click and supports async refresh callbacks — ideal for reloading component previews or live data.
Scramble Textscramble-textA text animation component that reveals characters with a scramble/glitch effect, with imperative controls for manual triggering.
Shimmer Skeletonshimmer-skeletonLightweight loading skeleton with a smooth shimmer sweep animation.
Shimmering Textshimmering-textAnimated gradient shimmer text with viewport-triggered and repeating animation support.
SlidersliderAnimated slider with spring-snapped thumb, step dots, range mode, and click-to-edit value display. Built on Radix UI Slider.
Animate SlotslotA slot component that allows you to use motion components with any element.
SwitchswitchAnimated toggle switch with a spring-driven thumb, smooth fill transition, and optional label.
TabstabsA set of layered sections of content—known as tab panels—that are displayed one at a time.
Text Revealtext-revealScroll-driven word-by-word or character-by-character text reveal using Motion's useScroll and useTransform.
Theme Switchtheme-switchAnimated dark / light mode toggle button with a spring-driven sun ↔ moon icon swap and optional View Transition reveal.
TilttiltA spring-animated 3D tilt wrapper that tracks the cursor inside the element.
Tilt Cardtilt-cardA card with 3D spring tilt, optional floating image, badge and radial shine on hover.
Tooltip Previewtooltip-previewLink tooltip that reveals a website preview card with title, description, image and favicon.
Velocity Highlightvelocity-highlightA highlight effect with smooth spring physics that tracks the active element across hover or click interactions.