Components

Horizontal card carousel where the focused card expands into a spring-animated full-screen view

Animated SVG beams connecting elements with smooth gradients

Testimonial carousel with smooth slide animations and optional autoplay

Canvas-based 3D starfield with perspective projection, motion trails, and glow

Avatar row with animated tooltips that follow mouse movement

Scroll-triggered reveal that unblurs and slides each direct child into place as the container enters the viewport, staggering up to 10 children via CSS nth-child delays and respecting reduced motion

Gradient beam that races around a container's border using a CSS offset-path animation, masked so only the border ring is painted, with configurable size, speed, anchor position, and gradient colors

Before/after image comparison slider split by a blade of light: a white-hot seam with a chromatic fringe, pulses running along it and a trail that stretches with the speed of the gesture

Trail of images that spawn and animate along the cursor's path, powered by GSAP timelines, with 9 selectable variants spanning simple fades, momentum drift, rotation flings, 3D perspective tilt, and a hard-edge pixelated snap

SVG grid of squares that highlight on hover with smooth fade transitions

Link component with 12 animated underline hover effects — pure CSS, no JS on hover

Staggered line-by-line text reveal with lines computed by pretext instead of DOM splitting

Live magazine layout: multi-column text flowing around draggable orbs with zero DOM reads, powered by pretext

Logo display with animated marquee, static grid, and icon variants

Image card with overlay that slides in from the mouse entry direction

Animated button with a rainbow gradient border; on hover or focus a rainbow beam rides around the border with a soft halo

Button that answers each click with a ripple of light from the click point, a soft glow and two fine rings spreading out like a wave; on hover a glow follows the pointer with a faint ring pulsing from it

Pill button with a satin sheen: a soft band of light sweeps across the face and lifts the label, then rests; on hover the highlight follows the pointer

Vertical timeline with scroll-driven progress line and sticky labels

Three-layer starfield background that scrolls continuously while parallax-shifting in response to cursor movement via spring physics, with stars rendered as box-shadow dots across near, mid, and far depth layers

Icon dock where each item magnifies smoothly as the cursor approaches, sharing pointer position via Svelte context so every DockIcon scales by proximity within a configurable magnification and distance range

GPU fireworks background with a deterministic, DOM-free physics core (rockets, peony/willow/ring/glyph shells, sparks, embers, smoke) rendered by a WebGPU engine into a wide-gamut, extended-tone-mapping canvas so bursts and comet trails burn brighter than SDR white on HDR displays, degrading silently through a WebGL2 fallback and a soft-knee SDR path everywhere else

Full Navier-Stokes fluid simulation that swirls color in response to cursor and touch movement, running on WebGL2 with a WebGL1 fallback and an optional WebGPU HDR path for wide-gamut, brighter-than-white glow

Liquid-metal ring for a container's edge: two metallic conic fields turning against each other make iridescent reflections flow along a dark chrome border, while a glint rides around it and spills a soft glow; chromatic, silver and gold presets or custom tints

Dark button with a beam of light that travels around its border and casts a soft coloured glow inside the face; the glow brightens on hover

Button whose dot opens into a circle that fills it on hover, while the label rolls up and out and returns with an arrow

Infinite scrolling component for text, images, or cards

Meteor shower in depth: seeded meteors with glowing heads and tapering tails fall diagonally in parallax (near ones larger, brighter and faster), fading in and burning out, a few flaring before they go

Canvas grid of squares that flicker in and out of opacity at random each frame, pausing automatically via IntersectionObserver when scrolled off-screen and resizing to fit its container via ResizeObserver

Page-transition overlay that looks like a corrupted video decode: a fixed grid of columns, narrow on the left and wide on the right, fills with flat blocks of saturated colour that fall, snap open through the middle of the frame and squeeze shut again; cover() drops the columns over the page right to left and reveal() lets them fall away, both as promises for any router's navigation hook

Canvas mosaic of small tiles on a dark surface where a soft halo follows the cursor with a lag, lighting tiles to random gold intensities that decay into a comet trail, with an additive bloom over the gaps, a glassy per-tile highlight, ambient flicker and an autonomous drift when idle

Two-colour neon tube around its content: two beams with white-hot cores chase each other along a faint tube, their glow spilling inside and outside the edge, humming slowly after a flicker on ignition

Per-character text animation where each glyph transitions to a new color from a shuffled palette, staggered across characters and reshuffling automatically every 5 seconds using pure CSS transitions

Cycling word animation with per-letter fade-in and blur effects

Text that scrambles into random uppercase letters and resolves character-by-character back to the original on hover, with a staggered per-letter reveal and an optional animate-on-load mode

Staggered letter pull-up animation with wave entrance effect

Animated number counter with easing, triggered on viewport entry

Text overlaid with small SVG star sparkles that scale, rotate, and fade in a continuous loop, each one regenerating at a random position once its lifespan expires, cycling between two configurable colors

Reveal animation where a solid color box slides left to right across content on viewport entry, unveiling it as it fades up into place underneath, triggered once via IntersectionObserver

Interactive 3D perspective card with depth effects on child elements

Card whose radial-gradient spotlight tracks the cursor as it moves inside, fading in on hover and parking itself off-canvas when the pointer leaves, with configurable gradient size, color, and opacity

Bento-style grid layout with slot-based and props-based card variants

Card that flips in 3D to reveal its back, on hover (plus focus and tap) or as a click toggle; it lifts and lands with a slight overshoot, keeps turning the way the pointer travels, and its faces catch a sweeping sheen and shade edge-on

3D book component with cover, spine, and back face that opens on hover

Holographic trading card effect with mouse-tracking glare and rainbow foil

Card that reveals text on horizontal mouse drag with animated star particles

Scroll-driven animation that rotates and scales a card from tilted to flat

Text container that cycles through words with per-character blur animation

Text component that cycles focus through words with blur and corner frame

Frosted glass surface with organic turbulence-noise refraction, an alternative to LiquidGlass

Glass-like visual effect using SVG filters for chromatic displacement

Physics-based smooth cursor with spring animations and rotation effects

Mouse-proximity based glowing border effect with animated conic gradient

Breathing border glow that wraps any card: colour blobs drift along the edges as a crisp 1px ring, a feathered inner glow and a blurred bloom, with slow hue rotation, fade in/out on an active flag, four palettes and an outside halo variant

Canvas-based floating particle sparkle effect with configurable density and colors

Confetti celebration effect powered by canvas-confetti with button trigger support

Set of concentric circles that pulse in a staggered wave, each ring larger, more transparent, and more delayed than the last, with the outermost ring rendered dashed to suggest a fading signal

Typewriter-style text reveal that fades in words one by one with optional blur

Text with animated diagonal line shadow pattern that scrolls continuously

Vertical SVG beam that highlights scroll progress alongside content

3D text with WebGL displacement that follows the cursor using Three.js shaders

Canvas-based falling glyph rain with configurable color, speed, and density

Terminal-style text streamer with per-character animation, blinking cursor, and glitch effect

WebGL image reveal with a Perlin-noise dissolve mask, contracting radial gradient, and wave displacement

Big text that liquefies along the cursor's path via a raw-WebGL fluid solver, with chromatic-aberration fringing that relaxes back over time

Grid of pixels pulsing in a diagonal wave as a pre-token loading indicator for AI responses

Animated three-dot presence indicator with a staggered CSS wave, tuned to signal activity without pulling focus

Live agent status line with a shimmering activity label and an elapsed timer, as a bare inline row or a bordered status pill

Renders a growing string as a live token stream: the appended delta lands tinted and settles, with an optional block cursor while the response is in flight

Collapsible reasoning trace that streams while the model thinks, then folds itself into a one-line summary

One conversation turn, aligned and dressed by its role, streaming its body while the answer arrives, with an action rail that fades in on hover and a version navigator underneath

Row of prompt pills that cascade in after a reply lands, offering the user a next turn without composing one

Quiet inline failure banner for a chat turn: the error, an optional detail line, and a retry button that disables itself while the retry is in flight

One tool invocation in a disclosure card: status dot, tool name, duration, and the request and result payloads pretty-printed on expand

Compact session summary of an agent's tool calls: one row per action on a vertical rail, with the target it touched, its diff stats, and when it ran

Live command transcript: the prompt line, output as it streams in with its ANSI colours read, a block cursor while it runs, and an exit-status footer when it stops

Unified diff tuned for chat width: one foldable card per file, tinted add/delete rows, and a copy-safe gutter

The citations under an answer: a pill carrying a stack of domain monograms and a count, expanding into scannable source cards with title, host, and the line worth reading

A numbered reference that sits inside a sentence and reveals the document behind it — title, domain and snippet — in a floating card on hover or focus

A search the agent ran: the query in a search-bar header, an indeterminate scanning bar while it runs, and results that land one row at a time

Fixed frame that holds its place while a model draws: an empty outline, then a pixel grid working over a drifting dot field, then the finished image easing out of a blur

Glanceable checklist of an agent's plan: a done/total count and completion bar over one row per step, with a status glyph, an optional detail line, and substeps indented under a rail

Fan-out panel for parallel workers: one row per delegated agent with its status dot, model badge, task, and its own progress bar

A human-in-the-loop gate before a side effect: the agent states what it is about to do, and the footer swaps its approve and deny buttons for a one-line verdict once someone decides

An agent's proposal awaiting an answer: a kicker, the recommendation, a confidence figure counted up beside a ring that fills to match, and two buttons that collapse into one quiet resolved line

A generated document as a tangible object: title, kind, a version navigator, and the first six lines of the text itself streaming in behind a fade

Compact comparison table for a model's structured answer: real table semantics, tabular numeric columns, check-or-dash booleans, and one tintable column — rendered in the order it arrived, with no sorting

The input at the bottom of a chat, taken apart: a root that owns the draft and eight parts that read it — a growing textarea, a send button that becomes a stop button, a toolbar, a model picker, an attachment row with its chips, and a completion menu you can mount twice on the same draft for / commands and @ mentions

A mic button that opens into a recording panel: a live waveform painted from amplitude levels you supply, a stopwatch, the transcript as it arrives, and a cross and a check to throw it away or keep it

How much of the context window is gone, in the space of a favicon: a donut that fills as the conversation grows, the compact count beside it, and an optional popover breaking the total down by what is holding it

A scroll region that stays pinned to its last line while content streams in, lets go when the reader scrolls up, and floats a pill offering the way back down

Conversation history for a chat sidebar: one row per thread with an unread dot, its last message, and a relative timestamp, plus selection and per-row delete

The shell a conversation lives in: a sticky header, a transcript that pins itself to the bottom while an answer arrives and offers the way back once you scroll up, and a sticky composer row

The foundational push-button: six variants, three sizes, a loading state, and a polymorphic href/anchor mode

Square or circular icon-only button built on Button, with a required accessible label

Joins a row of adjacent actions into one seamless control — one border, one divider, no doubled edges

Inline text link with a muted variant, configurable underline, and a safe external-link mode with a new-tab arrow

Two-state button carrying aria-pressed, for a single on/off option like a formatting mark or a filter

A segmented row of toggle buttons with roving-tabindex keyboard navigation and single or multiple selection.

Button preset wired to the clipboard, morphing its icon and label to a success or failure state for a moment after each copy attempt

A form label with a decorative required asterisk, wired to a FormField's context when it has one

Wraps a control with a label, help/error text and id wiring, so a screen reader gets the full picture without manual aria plumbing

A single-line text field with resting, focus, error and disabled looks, built on a native input

A multi-line text field with an optional live character counter and auto-growing height, built on a native textarea

A tri-look checkbox — unchecked, checked, indeterminate and disabled — built on a native checkbox input

A set of mutually exclusive options, built on real input type=radio elements sharing one name so the browser gives the roving tab stop and keyboard navigation for free.

A sliding on/off control that takes effect immediately, built on a native checkbox input

Restyled native range input with a purple-to-cyan gradient fill that tracks the current value and a glowing thumb

Numeric field with decrement/increment buttons that clamp to min/max, disable themselves at the bounds, and step fractional values without float drift

A modal panel with a title, description, body and free-form footer — portals out, traps focus, and locks the page's scroll while open

A confirmation dialog for consequential, hard-to-undo actions — fixed confirm/cancel actions, never dismissed by an outside click

A modal panel that slides in from an edge of the viewport, for settings, filters, or any focused task that doesn't need a full page

A modal bottom sheet with a grab handle, draggable shut with a downward swipe — for filters, quick actions, or any touch-first task

An anchored panel that opens next to a trigger and holds interactive content — quick settings, a small form, more than a tooltip can carry

A small anchored label that explains a control on hover or focus — plain text only, never interactive content

An anchored panel that opens on hover or focus with a short delay, for richer previews than a tooltip — a profile card, a link preview

A notification system: call toast() from anywhere to queue one, mount <Toaster /> once to render the stack — success, error, info and loading variants, an optional action, and accessible live-region announcements

A single-choice dropdown built on a real button and a portalled listbox panel, with full keyboard navigation, typeahead and focus that never leaves the trigger.

A single-choice text field over a closed set of options — typing filters a portalled listbox, and a value outside the list can never be selected.

A free-text field with a portalled panel of matching suggestions — any typed value is valid; the panel only ever helps finish it faster.

A pill-shaped search field with a leading icon, a clear button once there's something to clear, and optional debounced search

A password field with a show/hide reveal toggle and an optional strength meter that never relies on colour alone

A drop zone backed by a native file input, with per-file progress, JS-side validation and a removable file list

A field that opens a floating month grid, with full keyboard navigation (arrow keys across days, Page Up/Down across months, Shift for years), min/max and per-day disabling, and a fully localized accessible name on every day cell.

A field that opens a floating listbox of time slots generated at a configurable step, fully keyboard-navigable, with the highlighted slot always scrolled into view.

A horizontal top-of-page bar with a brand mark, navigation links, and actions on the right.

A collapsible, grouped navigation rail with labelled sections, a current-item accent, and badges folded into each item's accessible name.

A tablist compound with roving-tabindex keyboard navigation, automatic or manual activation, and an accent-underline or segmented visual style.

A data-driven trail of links with automatic truncation, a decorative separator, and the current page marked for assistive tech.

A page-number control with Previous/Next, ellipsis collapsing for long runs, and optional First/Last jump buttons; the current-page pill slides between numbers and the numbers glide when the visible run shifts.

A multi-step progress indicator where each step derives its own number and status — done, current, or upcoming — from its position in the sequence.

A menu of actions or options that opens from a trigger button, with full keyboard navigation, submenus and real DOM focus on every item.

A menu that opens at the pointer on right-click, sharing DropdownMenu's item, submenu and keyboard behaviour but anchored to a virtual point instead of a trigger element.

A modal search palette over a flat vocabulary of items — grouped results, diacritic-insensitive filtering, match highlighting, and full keyboard navigation with focus that never leaves the search field.

A horizontal row of triggers that each open a rich, multi-column panel below the row — disclosure-pattern site navigation, not an application menu.

Opt-in interface sound: a `sound` controller that synthesises eleven short cues (hover, press, toggle-on, toggle-off, open, close, select, success, error, tick, copy) with the Web Audio API, a SoundToggle switch that keeps the preference and volume, and a soundFeedback action that wires cues to any element — silent until the user switches it on, nothing on import, mount, navigation or scroll

Content-agnostic entrance animation triggered by scroll, mount, or a manual switch, with six directional/scale presets and an arbitrary-length JS-computed stagger for direct children

Mounts and unmounts content with a real entrance and exit through one direction-aware Svelte transition, tracking opening/open/closing state, marking the panel inert while it closes, and firing lifecycle callbacks

A generic wrapper that pulls its child toward the pointer once it enters an activation field larger than the child's own box, and springs back to rest the instant the pointer leaves — a fine-pointer affordance with no touch or keyboard equivalent

A wrapper that gives any interactive child a consistent, cross-browser press animation — scale down on pointerdown/keydown, back to rest on release, with a static opacity fallback under reduced motion

Wraps a group of cards, links, or list items so hovering or keyboard-focusing one dims (or blurs) every other one — a pure CSS :has() affordance with zero pointer-tracking JavaScript

Thin reading-progress bar that fills as the page — or a target element — scrolls, driven by a zero-JS CSS scroll-timeline where supported and a throttled scroll listener everywhere else, with an optional accessible progressbar label

Two-column scroll narrative with a scrolling item list and a sticky panel that swaps its content to the item centred in view, stacking to a single top-sticky panel over the items on narrow containers

Placeholder bones — a block, one or more text lines, or a circular avatar — with a phase-synced shimmer sweep or opacity pulse, that swaps to real content once loading finishes while keeping aria-busy semantics correct throughout

A 1em SVG status icon that morphs between idle, loading, success, and error, closing its spinning ring into a drawn check or cross with a portalled live region announcing each state

Single-line text that rolls to its new value per grapheme, odometer-style, whenever the value prop changes — while the real, unsplit text stays selectable and readable