Prompt & style library

Motion-Primitives

An animated gradient background which transitions between colors for text.

Magic UI

A list that animates each item in sequence with a delay. Used to showcase notifications or events on your landing page.

Magic UI

Animated theme toggle using the View Transitions API with configurable clip-path shapes and origin.

Magic UI

A visually engaging button component that responds to hover with dynamic transitions, adapting smoothly between light and dark modes for enhanced user interactivity.

Magic UI

Animated Scroll Progress for your pages

Magic UI

A dynamic text that generates continuous sparkles with smooth transitions, perfect for highlighting text with animated stars.

Magic UI

The Spinning Text component animates text in a circular motion with customizable speed, direction, color, and transitions for dynamic and engaging effects.

Magic UI

Fade in text as you scroll down the page.

Magic UI

A vertically stacked set of collapsible containers allowing users to toggle content visibility. Customize the animation effects with variants and transitions for expanding/collapsing the sections.

Motion-Primitives

Visually highlights selected items by sliding a background into view when hovered over or clicked. This smooth transition helps users focus on the active item, making it ideal for interactive lists, menus, or navigation…

Motion-Primitives

A custom cursor component with optional spring animations. It can be globally applied to the page or attached specifically to a parent element.

Motion-Primitives

A window overlaid on either the primary window or another dialog window, rendering the content underneath inert. Customize the dialog with variants and transition.

Motion-Primitives

A customizable glow effect with animation modes, colors, blur-sm, and transitions.

Motion-Primitives

A dialog that uses layout animations to transition content into a focused view. It supports click-outside and escape key functionalities for closing.

Motion-Primitives

Animated scroll progress for your web pages.

Motion-Primitives

Easily animate text circularly. Customize the animation with variants and transitions.

Motion-Primitives

Text animation that transitions between multiple items, creating an engaging looping effect.

Motion-Primitives

Animates text by morphing shared letters between words, creating fluid transitions.

Motion-Primitives