hirael

Infinite scrolling row or column for logos and testimonials, with pause-on-hover, reverse and vertical modes. Keyframes ship inline, zero config.

True masonry layout that balances children into the shortest column by measured height, order-preserving, responsive, dependency-free.

Local media file picker that previews via an object URL; empty-state prompt, replace and clear, size validation. Nothing leaves the browser.

@-mention textarea with caret-anchored autocomplete, highlighted mention chips, async search and multiple trigger characters.

Compact metric card with a value and unit, a tone-aware sparkline and an up / down trend line. Compound API.

Dark, monochrome newsletter landing page: a full-screen video hero with an inline subscribe form, an answer-engine section, scroll-revealed mission copy, a four-up feature grid and a streaming-video call to action. Framer Motion throughout, with a self-contained pure-black palette and liquid-glass accents.

4×3 month grid with year stepper, keyboard nav, min/max bounds, single or range mode.

A trigger card that morphs into a centered dialog via shared-layout animation, with focus trapping, scroll lock, Esc to close and reduced-motion support.

Chip-based multi-select with command-palette dropdown, search, select-all and async loader. Compound and single-prop APIs.

Coordinate-placed topology diagram: nodes with status and icons over an SVG edge layer, with animated active links. Ships composable parts.

Centered subscribe panel with an inline email form, inline validation and a success state that swaps in a confirmation once a valid address is entered.

Light enterprise-infrastructure landing page: a floating pill navbar that shrinks on scroll, a full-screen video hero, a dark service-card grid that unfolds on hover, a chaos-versus-control split around a circular streaming video, and a four-pillar delivery staircase. Self-contained navy-and-lavender palette with multi-stop brand gradients, driven by hls.js and lucide-react.

Centered 404 with mono eyebrow, display headline, paired CTAs and a 'try one of these' suggested-routes list.

Notification panel with header, list, per-item media, title, description, time and an accent-cool unread marker. Ships composable parts.

Two-thumb slider paired with synced number inputs. Min/max/step, currency or unit formatting, keyboard-first.

Centered verification card with a six-box code input built in the block: auto-advance, backspace, paste distribution and arrow-key focus, plus a 30s resend countdown and a pending → success verify flow.

Show/hide toggle with an optional pluggable strength meter. Compound and single-prop APIs.

Country dial-code dropdown with E.164 output. Compound and single-prop APIs.

Dark, single-page personal portfolio: a counter loading screen, an HLS video hero with a floating nav and a cycling role line, a bento work grid, a journal list, a scroll-pinned parallax gallery with lightbox, count-up stats and a video contact footer. Self-contained dark palette, driven by GSAP and Framer Motion.

Three-tier card row with a featured middle plan. Each card lists price, blurb, feature checklist and a primary or outline CTA.

Compare-by-feature pricing table with sticky tier header (tier name, price, CTA) and ~8 feature rows below.

Three-tier card row with a monthly/yearly billing toggle that tweens the price, a featured plan, per-plan icon, feature checklist and CTA.

How-it-works section with a three-step row: each step pairs an icon badge, a Step NN label, a title and a short body, joined by a hairline connector on desktop.

Dependency-free QR code generator rendering crisp SVG, with L/M/Q/H error correction, quiet-zone control and currentColor theming.

Grid of dashboard shortcut tiles with icon, label and description. Each tile is a button or, via asChild, a link. Ships composable parts.

Star rating with hover preview, half-star precision, read-only mode and sm / md / lg sizes.

Composable resizable panel groups with draggable, keyboard-accessible handles, per-panel minimums and nestable horizontal or vertical groups. RTL-aware.

Statuspage-style panel: an overall banner over a list of resources, each with an operational / degraded / outage / maintenance state and uptime.

Tiptap editor with a formatting toolbar (headings, lists, links, highlight, alignment) and a hover bubble to edit or unlink links inline. Outputs HTML, controlled or uncontrolled, with composable parts.

DeFi staking landing page for a fluid-asset protocol: a video hero on a rounded card with glass stat cards and a carved documentation corner, a metrics band, a bento feature grid, a video call to action and a light footer. Self-contained light palette, Helvetica system type, Framer Motion throughout.

Fixed reading progress bar. Tracks document scroll by default or a scoped container ref.

Fades and slides content in from any direction as it enters the viewport. Configurable distance, delay and replay; respects reduced-motion.

Fleet of host cards, each with a status pill, region, CPU / memory / disk specs and threshold-tinted usage meters. Ships composable parts.

Canvas signature capture with velocity-based ink, per-stroke undo, theme-aware re-inking and PNG/JPEG export via ref.

Centered signup card with monogram, name + email, strength-meter password-input, terms checkbox, divider and GitHub / Google providers. Validates inline on submit.

Drag-to-reorder list with pointer and keyboard sorting, handle or whole-item dragging, and live-region announcements. No dnd-kit.

Loading indicator with circle, dots and bars variants, sm / md / lg sizes. Inherits the current text color and ships an accessible status label.

Two-pane master/detail layout with a draggable divider, keyboard resize, min/max bounds and horizontal or vertical orientation. RTL-aware.

Card surface with a soft spotlight that tracks the cursor and fades in on hover. Built on design tokens, no hard-coded colors.

Compact metric card with label, value, and an up/down/flat trend chip. Compound and single-prop APIs.

Multi-step progress indicator with horizontal and vertical orientation, completed / active / inactive states, clickable steps and a compound API.

Object-storage file browser with a clickable path breadcrumb, folder and file rows, sizes and modified dates. Ships composable parts.

In-app plan selector with featured and current states, a badge, feature checklist and per-plan action. Ships composable parts.

On-this-page navigation that tracks the active heading as you scroll and highlights it with a moving border marker. Takes a flat or nested items list, or composes from parts. Smooth scroll respects reduced-motion.

Chip input with paste-to-split, dedupe, validation hook, max tags. Compound and single-prop APIs.

Workspace, organization or project switcher for multi-tenant apps. Logo or initials, plan or role caption, grouped and searchable list, and a create action. Ships composable parts.

Terminal surface with a title bar, output lines and an interactive prompt input with command-history recall. Ships composable parts.

Centered single quote with stylized open-mark, author block (avatar, name, role, company) and a muted wordmark row below.