Prompt & style library

286 hand-picked app briefs, design styles, themes, palettes, fonts and animation patterns — each a detailed prompt you can paste into any AI assistant. Free, no account needed to browse.

Try:

Curated · 286 Everything · 1009Showing the whole library (1009 entries), including short or duplicate prompts.

Full style references only 6

Scroll Based Velocity

Animation

Scrolling text whose speed changes based on scroll speed

Magic UI

Scroll Progress

Animation

Animated Scroll Progress for your pages

Magic UI

Scroll Progress

Animation

Animated scroll progress for your web pages.

Motion-Primitives

Typing Animation

Animation

Characters appearing in typed animation

Magic UI

Marquee

Animation

An infinite scrolling component that can be used to display text, images, or videos.

Magic UI

Progressive Blur

Animation

Add a progressive blur effect to scrollable content

Magic UI

Text Reveal

Animation

Fade in text as you scroll down the page.

Magic UI

Infinite Slider

Animation

Infinite scrolling slider component that smoothly loops through its children. It supports both horizontal and vertical directions, with customizable speed and speed on hover. Ideal for creating continuous carousels, mar…

Motion-Primitives

Android

Animation

A mockup of an Android device.

Magic UI

Animated Beam

Animation

An animated beam of light which travels along a path. Useful for showcasing the "integration" features of a website.

Magic UI

Animated Circular Progress Bar

Animation

Animated Circular Progress Bar is a component that displays a circular gauge with a percentage value.

Magic UI

Animated Gradient Text

Animation

An animated gradient background which transitions between colors for text.

Magic UI

Animated Grid Pattern

Animation

A animated background grid pattern made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Animated List

Animation

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

Magic UI

Animated Shiny Text

Animation

A light glare effect which pans across text making it appear as if it is shimmering.

Magic UI

Theme Toggler

Animation

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

Magic UI

Aurora Text

Animation

A beautiful aurora text effect

Magic UI

Avatar Circles

Animation

Overlapping circles of avatars.

Magic UI

Backlight

Animation

A backlight glow effect for videos, images, and SVGs.

Magic UI

Bento Grid

Animation

Bento grid is a layout used to showcase the features of a product in a simple and elegant way.

Magic UI

Blur Fade

Animation

Blur fade in and out animation. Used to smoothly fade in and out content.

Magic UI

Border Beam

Animation

An animated beam of light which travels along the border of its container.

Magic UI

Code Comparison

Animation

A component which compares two code snippets.

Magic UI

Comic Text

Animation

Comic text animation that looks like a comic book text

Magic UI

Confetti

Animation

Confetti animations are best used to delight your users when something special happens

Magic UI

Cool Mode

Animation

Cool mode effect for buttons, links, and other DOMs

Magic UI

Dia Text Reveal

Animation

A horizontal color band sweeps across text with a gradient shine, then settles on your theme foreground color.

Magic UI

Dock

Animation

An implementation of the MacOS dock using react + tailwindcss + framer motion

Magic UI

Dot Pattern

Animation

A background dot pattern made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Dotted Map

Animation

A component with a svg dotted map.

Magic UI

Flickering Grid

Animation

A flickering grid background made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Floating 3D Particles

Animation

A canvas-based pseudo-3D particle field with perspective projection, continuous rotation, buoyant drift and depth-aware rendering.

Magic UI

Glare Hover

Animation

A diagonal light glare on hover using a ::before gradient, CSS variables, and background-position animation—no extra global keyframes required.

Magic UI

Globe

Animation

An autorotating, interactive, and highly performant globe made using WebGL.

Magic UI

Glyph Matrix

Animation

An animated grid of subtly shifting glyphs on a canvas, with a theme-aware color driven by the consumer.

Magic UI

Grid Pattern

Animation

A background grid pattern made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Hero Video Dialog

Animation

A hero video dialog component.

Magic UI

Hexagon Pattern

Animation

A background hexagon pattern made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Text Highlighter

Animation

A text highlighter that mimics the effect of a human-drawn marker stroke.

Magic UI

Hyper Text

Animation

A text animation that scrambles letters before revealing the final text.

Magic UI

Icon Cloud

Animation

An interactive 3D tag cloud component

Magic UI

Interactive Grid Pattern

Animation

A interactive background grid pattern made with SVGs, fully customizable using Tailwind CSS.

Magic UI

Interactive Hover Button

Animation

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