Security Checkpoint

Security checkpoint illustration or component

Animated Search

Search input with animated gradient border, staggered placeholder, blur deletion on clear, loading line, and Warp shader avatar

Mac Screen

Classic Mac frame with an image or GIF composited into the CRT

Wizard Expandable

Expandable multi-step wizard with optional forward validation, scrollable step rail, and Motion height transitions

Apple iPhone 17 Pro Max

iPhone-style device frame with Dynamic Island, status bar, and configurable frame colors

Illustration Card Grid

Grid of cards with gateway illustrations

Animated Toast

Sonner-backed polished toasts with rim variants; mount PolishedToaster once in the root layout

Circuit Board

Animated SVG circuit illustration with glowing traces and a central chip, for hero or product sections

Animated Card

Composable card with animated gradient rim, frosted fill, layered shadow, and Base UI button actions

Border Beam Card

border-beam around compound Card API with balanced title and description

Kanban Board

Kanban board with drag-and-drop columns and cards

Apple Keyboard

Compact Apple-style keyboard with labeled keys and media row

Speech Bubble

Speech bubble component

Animated Select

Composable animated select with gradient rim, frosted fill, and staggered label

Animated Input

Single-line and multiline inputs with frosted fill and gradient rim for generic forms

Animated Dropzone

File dropzone with animated rim, frosted fill, moving border trail, and file-type glyphs

Animated Segmented

Segmented control with frosted track, gradient rim, and spring sliding thumb

Vercel Collab Toolbar

Demo for the Vercel collab toolbar component

Tabs Illustration Vercel

Tabs with Vercel-style illustrations

Organic Card Small

Compact card with SVG silhouette, category and date, motion morph on hover, and optional link

Organic Card

Composable marketing card with optional link root, image slot, eyebrow/title/body, accent band, and footer CTA

Organic Button

Anchor-based CTA with fixed SVG end caps, shared surface colors via CSS variables, and size and animation variants

Merging Bubbles

Merging bubbles visualization

Marketing Hero Analytics

Analytics hero section for marketing pages

Marketing Feature Code

Marketing section for code or network policy features

Illustration Graph

Graph illustration component

Illustration Globe Vercel

Globe deployment illustration

Illustration Fluid Rendering

Fluid rendering illustration

Illustration Cursor

Cursor illustration and demo for collaboration UI

Illustration Comment Bubble

Comment bubble illustration for code or chat UI

Icons

Icon set for file types and languages

Gateway SVG Illustration

SVG illustration for gateway overhead

Gateway Route Illustration

Illustration for gateway routing

Gateway Endpoint Illustration

Illustration for gateway endpoint concepts

Globe (COBE)

COBE-powered 3D globe with showcase presets, markers, arcs, DOM overlays, and theme-aware styling

Fluted Glass

Paper Design fluted-glass image shader with sensible defaults — ribbed, streaked distortions over a source image

Fluid AI Workloads

Fluid visualization for AI workload states

Feature Sticky Section

Sticky section with controllable panels and scroll behavior

Copy Button

Button that copies content to clipboard with feedback

Collab Toolbar

Toolbar component for collaborative editing UI

Collab Avatar

Collaboration avatar with initials and color

Agent Suggest Card Stack

Stack of suggestion cards for AI agent responses

Apple Watch Ultra

Watch Ultra–style case, complications, crown, and action button

Apple Pro Display XDR

Studio Display–style aluminum frame, screen modes, and interactive macOS dock

Border Beam Input

border-beam on Base UI input and input-group primitives with line or full border glow

Border Beam Button

border-beam glow around shadcn Button and icon button variants

Animated Switch

Toggle switch with spring thumb, frosted track, and extended touch hit area

Animated Progress

Progress bar with spring-driven determinate fill and indeterminate gradient strip

Animated Notification

Polished notification surface for local AnimatePresence use with rim variants and glyph stagger

Animated Field

Form field layout (label, description, error) for AnimatedInput and AnimatedTextarea

Animated Composer

Multiline prompt field with shader avatar, staggered placeholder, loading line, and send/attach chrome

Animated Badge

Badge with optional layout animation, live status dot, and gradient rim aligned with Animated Button / Card

Animated Toggle Group

Segmented single-select control with frosted track, gradient rim, and spring-driven sliding thumb (aligned with Animated Button)

Animated Tabs

Base UI tabs with gradient indicator: underline or pill variant aligned with animated card rim colors

Animated Button

Primary action button with animated gradient rim, frosted fill, staggered label, and loading spinner

Analytics Chart

Vercel-style gradient line chart with floating tooltip cards

AI Blob Warp

Circular avatar with Paper Design Warp shader; motion-safe pulse, pauses off-screen and when reduced motion is preferred

Shadow Card

Composable marketing card with L-shaped extrusion, optional pixel gradient mesh, and Radix Slot on the root

Folded Card

Folded card component with customizable reveal effects and timing