Explore the UI Kit

Original SVG icon set on a 24px grid — searchable gallery with a registry component (<sv-icon name="…">) and tree-shakable per-icon components. currentColor + dark-mode ready.

Pro motion engine for every glyph — curated per-icon animations plus a preset catalogue (draw, spin, ring, pop, bounce…). Driven by the Web Animations API (no CSS file, no library) with hover/click/in-view triggers and prefers-reduced-motion support.

4 variants: Timeline feed, Gantt/parallel view, Metrics dashboard, and Step-detail inspector. Tracks agent runs, tool calls, LLM steps, and retrieval operations.

4 premium AI chat variants: Fullscreen assistant, Floating widget, Embedded panel, and Compact sidebar. Streaming indicators, tool call chips, code blocks with copy, markdown-ready messages, and dark mode.

4 premium variants: Summary grid, Detail single, Comparison, and Digest feed. Confidence scores, trend arrows, sparklines, and action buttons.

4 variants: Dropdown picker, Card grid, Side-by-side comparison, and Settings panel. Provider badges, capability tags, latency/cost/context indicators, and recommended flag.

4 variants: Overview KPI grid, Usage breakdown donut + bars, Cost trend area chart, and Model comparison table. Token usage tracking and cost analysis for LLM applications.

4 variants: Canvas node graph, List step editor, Template gallery, and Run history. Visual column-layout DAG, enable/disable toggles, category filter, execution logs, and token/cost tracking.

4 variants: Toolbar (8 action buttons, category filter, readability stats, live editor), Tone (8-tone picker with hover preview + before/after comparison), Suggestions (accept/reject rewrite cards with confidence score + before/after diff), and History (revision timeline with side-by-side diff, word delta, and restore).

4 variants: Grid card gallery, List view, Template editor, and Picker modal. Variable injection, token counter, usage stats, category filter, and version history.

Inbox for work an agent is doing on its own — machine-owned state, not a board a human drags cards across. The plan is the progress bar: give a task a plan and progress is derived from the steps that check themselves off, with an active step counting as half. ETA is extrapolated from the pace actually observed, and withheld when there is nothing to extrapolate from. Cancel while it can still run, retry once it failed. Four variants: inbox, compact, grouped and detail.

Registry for the tools and MCP servers an agent is connected to — many stateful connections, not one model choice. Connection lifecycle and health, credential expiry warnings, per-tool parameter schemas, usage and error rates, and a recent call log. The permissions variant is an ordered scope matrix (none → read → write → admin) so a policy is a threshold rather than a set, and every change reports the scope it replaced. Four variants: grid, table, permissions and detail.

Human-in-the-loop gate between what an agent proposes and what it is allowed to do. Not a confirm dialog: arguments are editable so a wrong value is corrected rather than denied, and the decision carries the corrected values. Risk levels arm destructive actions behind a second press and withhold always-allow above medium. Includes a before/after diff, a cost estimate in money and tokens, and an expiry countdown that blocks stale approvals. Four variants: inline, modal, inbox queue and policy record.

Reasoning-summary display for a reasoning model. Streams token by token, stays open while the model thinks, then collapses itself to a summary chip the moment it finishes — the lifecycle that separates it from a timeline. Four variants: inline chip, numbered steps, streaming and nested. Per-step kind, status, latency, tokens and confidence; sub-thoughts render recursively; content goes through sv-streaming-markdown so nothing reaches the DOM as markup.

Inspector for the tool / function calls an agent makes. Four variants — compact pill, expanded, streaming and error — with arguments and results rendered through sv-code-block, per-call latency and token attribution, recursive sub-calls, and a retry action on failures.

4 variants: Overview dashboard, Source management, Ingestion pipeline, and Health monitoring. Index stats, sync progress, pipeline stages, sparkline metrics, and alert list.

4 variants: Summary (semicircle gauge + breakdown bars + KPI cards), Topics (stacked sentiment bars), Timeline (SVG area chart + volume bars), and Feed (filter pills + source badges + score bars).

Numbered citations attached to a generated answer, and the coverage strip that names what nothing supports. One source gets one number however often it is cited, so five chunks of one document do not read as five sources agreeing; the answer is segmented on citation boundaries, so overlapping citations — which are ordinary, because chunks overlap — cannot render a clause twice. Three variants: inline chips, source cards and a docked panel.

A voice turn whose level meter is driven by measured amplitude and nothing else — the answer to "is it hearing me", which a timer-animated waveform cannot give. Interim transcript renders as provisional and is replaced by its final, never followed by it; barge-in is a transition on the state machine rather than a flag; a denied microphone is terminal until reset and says where the browser hid the permission. Three variants: button, transcript and call.

Two eval runs compared honestly. A pass-rate drop is not a regression until you know which cases flipped — three points could be three new failures or thirty cases netting out — so the comparison is a set operation over case ids, with added and removed cases reported apart from the delta. Rates carry a 95 % Wilson interval and the delta stays grey until the two intervals stop overlapping. Three variants: summary, compare and cases.

Safety policy as an operating surface. Every guardrail product ships the count and none ships the output — "3 violations blocked" is compatible with a policy working perfectly and with a policy that ate the answer, and the only way to tell is to read the text that came out. Blocks and redactions get separate counters because one of them is a user who got nothing; overlapping spans are merged before masking, so a redaction cannot corrupt the text it protects; and rules that have never fired are listed first rather than buried at the bottom of a chart sorted by volume. Three variants: rules, feed and redaction preview.

Conversation and generated document side by side, with the field every canvas leaves out: the instruction that caused each revision. Shows what CHANGED rather than re-rendering the document — because a user asks for one edit, the requested change looks right, and an unrequested one three sections down ships with it. The region count is the number that catches it: one instruction should produce one region. Diffs by longest common subsequence, so inserting a sentence at the top does not report the rest of the file as a rewrite. Three variants: split, focus and history.

A 2D projection with clusters and lasso selection, drawn without inviting the reading every t-SNE plot invites. Distance between clusters carries no meaning in these layouts and blob size is set by perplexity rather than by the data, so the chart says so in text and draws no axes. In their place it computes the one question a projection CAN answer — k-NN label agreement, which says whether the clusters are separated or merely coloured apart — plus which pairs are entangled and whether overplotting has made the density meaningless. Three variants: scatter, clusters and selection.

The AI pack's privacy contract, on screen. X-2 gave the pack one contract — mask patterns, reveal, copy, telemetry — and eight surfaces that honour it, and then nothing anywhere showed what it said: a policy with no patterns looks exactly like one whose patterns found nothing, and a rule with a typo in it masks nothing for the life of the app while reporting it as a single console line. This renders the contract, orders its findings so that everything which leaks content comes first, names the categories it deliberately does not look for, and runs the policy against your own prompts and tool arguments to show what went through — by shape, never by value. No score: you cannot know what share of the secrets in arbitrary text a pattern set catches, and one invented number spends the panel's credibility for good. Two variants: policy and scan.

Pure-SVG grouped bar chart with vertical/horizontal orientation and animated bars.

Distribution chart with Tukey 1.5×IQR whiskers, outlier dots, optional mean marker, raw-samples or server-computed summaries, and a non-zero-based value axis. Pure SVG.

Featured measure against a target and qualitative bands, horizontal or vertical, on a shared or per-row scale. Pure SVG.

2 variants: Animated SVG donut + Gradient Donut with per-slice radial gradients and staggered entrance animation.

Half-circle gauge with colored range bands, animated progress arc, needle, tick marks, and configurable min/max. Pure SVG.

Row×column heatmap with 4 variants (default, calendar, blocks, glow), 6 color schemes, no-jump tooltip, and colored ambient glow on hover. Pure CSS.

12 variants: Line, Spline, Step, Dashed, Custom Animation, Inversed, Line Zone, Multi Colored, Stacked, 100% Stacked, Trend Lines, Strip Lines. Pure SVG — no dependencies.

6 real-time chart variants: Live Spline, Live Stock (OHLC), Dynamic Data Source, Click-to-Add Point, Live Sorting, and Live Stream (continuous scrolling spline). Pure SVG, no dependencies.

Open/high/low/close sessions on an ordinal axis, with direction in the body fill as well as the colour, an optional volume pane and a logarithmic price scale.

Distribution of a sample: five bin-width rules, density and cumulative measures, an optional kernel density curve and a rug, with the bin rule always stated.

X/Y scatter with a third dimension in the bubble size, multi-series, animated scale-in entrance.

Area/line chart on a date-time category axis. Labels take the app locale; a bare YYYY-MM-DD is a calendar day in local time, not UTC midnight.

Stage funnel and hierarchy pyramid. Width is the value and every band is the same height, so the area of a band is not its value — the chart says so.

Independent left and right y-axes, bars and lines on either. Both scales and their ranges are stated under the plot, because each axis fills the full height and the crossing is an artefact.

Chart export to PNG/SVG/PDF, plus the high-performance renderer and the two axis-labelling treatments — features of the bar and line families rather than charts of their own.

4 variants: Default Pie, Variable Radius, Custom Legend Template, and Smart Labels. Pure-SVG, entrance animations, hover effects.

Nightingale rose / polar area chart with area-proportional (√) or linear radius scaling, padded wedges, labelled grid rings, and a configurable start angle. Pure SVG.

Multi-series radar/spider chart with configurable axes, fill/stroke mode, dot markers, level grid, and auto-positioned labels. Pure SVG.

Value-per-region map with an equal-area default projection, quantile / equal-interval / threshold class breaks, an explicit no-data fill, a roving-tabindex keyboard model and a legend. Bring your own GeoJSON. Pure SVG.

Points of interest on a projected map, with the overlaps admitted: markers closer than clusterRadius merge into one pin that states its count, in the accessible name as well as the picture. Optional inert base layer, tones for state, a separate highlight channel, and a palette hook because SVG fill cannot read a theme token. Pure SVG.

Concentric progress rings, one per track, with per-track scales, a configurable sweep and start angle, a centre readout, and a legend. Pure SVG.

Flow diagram with auto column layout, cubic bezier flow paths, width-proportional links, hover tooltip. Pure SVG.

Multi-series scatter plot with grid lines, axis labels, hover tooltip, and legend. Pure SVG — no dependencies.

Squarified treemap with 4 distinct visual variants: Corporate Solid, Mosaic Card Grid, Dark Blueprint, and Hierarchy Explorer. Supports nested data. Pure SVG.

2 orientation variants (vertical & horizontal) with floating bars, dashed connector lines, increase/decrease/total color-coding, data labels, hover tooltips, legend, and per-bar entrance animations. Pure SVG — no dependencies.

User avatar with initials fallback, status indicator, size, and shape variants.

Code 128, EAN-13 and EAN-8 drawn from a real encoder rather than striped from the digits. A barcode with the wrong check digit does not fail to scan — it scans as a DIFFERENT number, which is why the mod-103 and mod-10 characters are computed here and EAN-13's thirteenth digit is carried in the parity of the left half. Subset C packs two digits per symbol character so a long serial fits the label stock; the spec quiet zones are part of the symbol, not padding; and the module width snaps to whole device pixels, because a sub-pixel module antialiases into jitter a scanner reads as different run lengths. Refuses what cannot scan, and says why. Three variants: labelled, bare and inspect.

Compact status and category labels with 7 semantic variants and 3 visual styles.

Month, week, day, and agenda views with color-coded event chips, keyboard navigation, and today highlight.

Auto-playing image carousel with dots, lines, numbers, or no indicator variants, prev/next arrows, and slide counter.

Micro-chart small enough to live in a table cell, list row or stat card. Four encodings — line, area, bar and win/loss — with optional smoothing, last-point and extreme markers, a dashed reference baseline and a pinnable domain so rows stay comparable. Pure SVG with zero dependencies: nothing is measured and no layout is read, so hundreds render safely inside a virtualized table. Paints with currentColor, and generates its own accessible summary.

Read-only source display with a zero-dependency highlighter for 9 languages. Four variants: block, multi-file tabs, diff (unified or split, with per-hunk accept/reject) and terminal. Streaming-safe, with line numbers, soft wrap, line highlighting, copy-to-clipboard and a render cap for very long files.

Threaded comment display with nested replies (depth-limited), inline reply box, emoji reactions, relative timestamps, and avatar/initials fallback.

Generic free-tier table with sorting, pagination, row selection, badge cells, and loading skeleton — plus 8 premium variants with toolbar, column filters, inline editing, expandable rows, bulk actions, and more.

Key–value list for a record detail panel — real <dl>/<dt>/<dd> semantics, 1–4 responsive columns with per-item span, horizontal and vertical layouts, and a value that is missing told apart from one that is blank.

Native HTML5 drag-and-drop reorderable list with priority badges, keyboard move-up/down alternatives, and item removal.

File attachment card with MIME-type icon, size formatting, upload progress bar, status indicators, and download/remove actions. Card, row, and compact variants.

14 premium demos: portfolio roadmap, smart prioritizer, progress predictor, resource optimizer, release train, sprint planner, executive milestone, task scheduling modes, column system, holidays & work week, loading skeleton, virtual scrolling (60 tasks), MS Project XML round-trip, and resource allocation view. Features include command bus, undo/redo, drag & drop, dependency engine, critical path, baselines, resource leveling, MS Project XML import/export, and row virtualization.

8 premium color palette variants — GitHub Contributions (green), GitLab Pipelines (blue), Sales Revenue (fire), Server Load (ocean), Product Analytics (purple), Support Tickets (monochrome), Deployment Types (multi-metric), and Quarterly View — with interactive tooltips, shape options, stats badges, and full dark-mode support.

A before/after wipe that admits when it is not one. Two images of different aspect ratios cannot be compared by wiping — one of them is cropped or stretched to fit, so part of what the reader is shown as “the change” is the reframing, and the widget looks exactly right while it happens. So it measures both intrinsic sizes and says so. It is also a real ARIA slider: arrows nudge, page keys jump, Home and End go to the extremes, and every other key is left alone so Tab still moves on. Three variants: slider, bare and inspect.

An image cropper fails by producing a PICTURE rather than an error, which is what makes it worth this much care: the wrong region of the photo, the photo on its side, a completely transparent file, or a 'compressed' PNG the size of the original — none of which throws, and all of which the user discovers later. So it handles EXIF orientation, reports the browser's canvas ceiling instead of silently returning a blank image past it, and says outright that PNG ignores the quality setting. The whole box is keyboard operable, because 'drag a rectangle' has no non-pointer equivalent unless one is built.

Grid, masonry, and strip layouts with lightbox viewer, keyboard navigation (← → Esc), selectable mode, and 2–5 column options.

Renders N items then collapses overflow into a "+N more" badge, chip, or text indicator — with optional dropdown listing overflow items.

Expandable tree over any value — the panel every webhook inspector and debug drawer needs. Tells NaN from null, a Map from an empty object, and a cycle from a shared reference; caps very large containers visibly; full tree keyboard model with copy-path and copy-value.

8 global-market variants: Project sprint board, CRM sales pipeline, Helpdesk/support tracking, Compact high-density, Swimlane by assignee, Toggle-columns (animated collapse to vertical strip), Swimlane-template (rich full-width headers), and Fixed-header (static column headers, each card body scrolls independently). Native HTML5 drag-and-drop, inline card creation, WIP limit indicators, SLA tracking, and deal value bars.

A native `<kbd>` wrapper for keyboard shortcuts and hint keys — 3 variants (solid, ghost, plain) and 2 sizes, so every shortcut hint in the kit shares one styled source.

Reaction button with 4 icon variants (heart, thumbs-up, star, clap), burst particle animation on toggle, optimistic count, and 3 sizes.

Text truncation with CSS -webkit-line-clamp, ResizeObserver overflow detection, gradient fade, and animated Show more / Show less toggle.

Market-ready list patterns: default, checklist, nested tree, virtualized, grouped, template cards, call history, and infinite scrolling.

Dependency-free password strength scorer and live meter addon — segmented bar, strength label, and up to 3 improvement suggestions, pairing alongside any text input.

Cross-tab summarization with a drag-to-configure field list — dimensions, six aggregators, expand/collapse subtotals, sort-by-measure, top-N filter, Excel/PDF export and server-side aggregation.

Self-contained canvas QR encoder — no external dependencies. Supports error correction levels L/M/Q/H, center logo, custom colors, and PNG download.

Nested AND/OR condition builder with typed operators per field (string / number / date / enum / boolean), a serializable JSON expression out and import back in, and a queryChange output that pairs with data-table's server-side filtering.

A table that becomes a list of records when there is no room to be a table. The usual responsive technique sets display:block on the table elements — which drops their table roles in every browser, so a screen reader gets a pile of anonymous blocks — and pipes the header text in through ::before, which nobody can select, search or copy. The other common answer hides the columns that do not fit, making it a different table with nobody told which one they are reading. This does neither: below the breakpoint the markup stops claiming to be a table and becomes a list of real <dl> label/value pairs, a secondary column moves behind a per-card disclosure that says how many are in it, and the sort control is rebuilt as a labelled select — because a card list has no headers to click and that is the half of "responsive" everyone forgets.

KPI metric cards with sparklines, trend chips, and four layout variants — plus the premium dark-first Spotlight treatment, with a gradient hairline border, ambient accent glow, gradient icon token, inline gradient sparkline and six accent themes.

Safe Markdown renderer built for token-by-token output. Renders a parsed token model through Angular bindings — no innerHTML, no bypassSecurityTrust. Headings, lists, task lists, tables with alignment, blockquotes and inline emphasis; fenced code delegates to sv-code-block. Streaming-safe: half-received syntax degrades gracefully.

Media card with image (top/left/right position), 4 aspect ratios, gradient overlay, badge, and content/action projection slots.

CSS Grid tile container with auto-fill, fixed column count, configurable gap and min-column-width, aspect ratio support, and masonry progressive enhancement.

Locale-aware money formatting with an optional compare-at price, auto discount badge, minor-unit (cents) support and a Free label. 4 sizes, display-only.

Commerce product card composing price + rating with a wishlist toggle, badge, colour swatches, add-to-cart and out-of-stock state. Grid and list layouts.

A real-estate listing card: locale-formatted price with an optional per-period suffix and compare-at strike, a status ribbon, bed / bath / parking / area facts, a feature list, a media carousel with a count and an optional tour badge, plus save and compare toggles. Grid, list and wide layouts.

Cart / checkout totals panel that renders a server quote verbatim and badges any locally-derived total as an estimate. Shipping / tax / discount rows, inclusive-tax mode, extra line items and coupon / checkout content slots.

A cart row: image, variant, quantity stepper and computed line total, with remove and save-for-later actions. Default and compact densities.

A saved address elegantly displayed — label, default / shipping-billing badges, edit / remove / set-default actions — plus a companion address form with inline validation. Selectable (radio) mode for checkout pickers.

A premium payment-card visual that updates live: auto-detects the brand from the number, formats the digits (incl. Amex 4-6-5), masks all but the last four, and flips to reveal the CVC. Five gradient themes.

A premium gift-card / e-gift visual: a locale-formatted denomination, a redeemable code with click-to-reveal masking, recipient / sender / greeting and a validity line. Five gradient themes with a ribbon and shimmer.

A premium faceted filter panel for product listings: collapsible checkbox, color, rating and price facets with per-option counts, an active-filter chip row and clear-all. Two-way selected / price models plus a change output.

8 premium variations: horizontal, alternate zigzag, numbered stepper, check stepper, activity feed, status tracker, rich card, and date-grouped.

Dual-list transfer widget for moving items between source and target panels — with per-panel search, check-all, and move-all controls.

8 premium variants: Default collapsible tree, File Explorer with type icons & metadata, Tri-state Checkbox, Org Chart with presence indicators, Tree Table with custom columns, Searchable with highlight, Drag & Drop reordering, and Lazy Load with skeleton spinner. Angular Signals, OnPush, dark mode.

8 premium dashboard grid layouts: SaaS KPI, Web Analytics, Ecommerce, CRM Pipeline, Fintech/Portfolio, DevOps/Platform, Glassmorphism Executive, and HR Analytics. Each variant ships with inline SVG sparklines, trend chips, progress bars, pipeline funnels, leaderboards, activity feeds, and full dark-mode support.

Searchable dropdown with grouping, sublabels, icons, disabled options, keyboard navigation, and query highlight bolding.

9 variants × 6 styles × 5 sizes × 3 shapes — solid, outline, soft, ghost, link, gradient with loading states and icon support.

Multi-level cascading select for hierarchical data (Country → State → City) with searchable mode, hover/click expand, and keyboard navigation.

Renders a form from a JSON schema: conditional visibility that hides a whole branch, a payload with hidden fields pruned out, validation that ignores what is not on screen, and a report of the schema’s own mistakes.

Hierarchical picker in a body-portalled tree panel: single or multi-select, ancestor-preserving filter, full keyboard control via aria-activedescendant, and the loading/error/empty states inside the panel.

Accessible checkboxes with 5 variants, 3 sizes, indeterminate state, and ControlValueAccessor support.

7 semantic variants × 3 visual styles. Supports avatar, icon, selectable, and removable modes.

A set of chips that belongs to something: one tab stop for the whole row, arrows between members, and a name for the thing they are members of. Movement never selects — arrowing past a filter that silently switched itself on is a data-loss bug wearing a keyboard shortcut.

HSV gradient canvas color picker with hue rail, alpha channel, hex input, preset swatches, 3 size variants, and two-way model binding.

Premium custom calendar date picker with month/year navigation, today indicator, min/max constraints, keyboard navigation, and dark mode. Three picker views: day grid, month grid, year grid.

Drag-and-drop and button-style file uploaders with type/size constraints.

Semantic fieldset wrapper for form sections with vertical/horizontal layout, bordered/filled variants, and optional collapsible toggle.

Edit one field where it is displayed: a value that reads as text until you click it. Text, textarea and select modes, Enter to commit and Escape to revert, a save lifecycle that keeps the draft when the write fails, and focus that goes back where it came from.

8 built-in mask presets (phone US/intl, credit card, date, time, SSN, ZIP, IP) plus custom pattern, with 3 visual variants.

Contenteditable input with @mention autocomplete — cursor-anchored dropdown, keyboard navigation, and styled mention chips.

Numeric input with increment/decrement controls, prefix/suffix, min/max clamping, and decimal precision.

The list of what is wrong at the top of a long form, with a way into each field — including the ones a collapsed group or a wizard step is currently hiding, which a plain #anchor cannot reach.

4, 5, and 6-digit OTP/PIN inputs with auto-advance, paste support, arrow-key navigation, mask mode, and error/success/loading status variants.

Phone number field with a local-asset country flag picker, driving sv-input-mask's phone-us/phone-intl presets.

Radio group with default, card, and button-group styles. ControlValueAccessor for reactive forms.

Star, heart, fire, and thumb rating variants with half-star support, hover preview, 4 sizes, and two-way model binding.

Full-featured contenteditable RTE with 9 toolbar groups — font/size/color pickers, alignment, lists, link/table/code insert, undo/redo, source view, fullscreen, and word count.

Command-palette style search with suggestions, filters, and loading states.

Sign with a finger, a pen or a mouse. The signature is stored as STROKES rather than pixels, so it survives a resize, undo removes a mark, and export refuses to hand back a blank PNG from a pad nobody signed. Pointer capture, device-pixel-ratio correct rendering, and an SVG export because a signature is a vector.

4 style variants (default, pills, underline, bordered), badge and icon support, full-width mode, and two-way model binding.

Single, multi-select, grouped, searchable dropdown with rich option rendering.

Range slider with single-value and dual-handle range mode, tick marks, and step control.

A primary action button fused to a chevron dropdown of secondary actions — composed from Button, the fused Input Group, and Dropdown Menu.

8 premium multi-select tag-input variants: Default, With Avatar, Grouped, Creatable, With Colors, Token Limit, Async Search, and Inline — with keyboard navigation, fixed-position dropdown, and dark-mode support.

Single-line & multi-line inputs with validation states, icons, and hints.

12h/24h scroll-column time picker with hour/minute/second wheels, AM/PM selector, Now button, and 3 sizes.

Accessible toggle for boolean settings in multiple sizes and color variants.

Pin an element while the page scrolls, with the placeholder that stops the jump. Going `position: fixed` removes the element from flow, everything below jumps up by its height, the page height changes, `scrollY` changes, and the element can unpin — which puts the height back and re-pins it. The fix is a placeholder of the MEASURED height, and the anchor is re-measured from that placeholder rather than from the element, because a pinned element's own rect reports the position it was moved to and yields a one-way latch. Optional container boundary so a pinned sidebar parks at the end of its section instead of floating over the footer.

Copy button in inline, block, and icon-only variants with success feedback, clipboard API, and execCommand fallback.

Horizontal and vertical dividers with solid/dashed/dotted/gradient/text/icon variants and start/center/end alignment.

Animated height expand/collapse container — pure JS measurement, no @angular/animations — with lazy render and accessible aria-hidden.

Animated count-up display with easing, IntersectionObserver, prefix/suffix, separators, auto-fit (never overflows), reduced-motion support, plus PRO+ odometer / scramble / currency (Intl) variants.

A styled scrollbar drawn over a genuinely scrolling element, never in place of one. Custom scrollbars built on a transform inside an `overflow: hidden` box lose Page Up/Down, Home/End, arrow keys, spacebar, trackpad momentum, `scrollIntoView`, find-in-page auto-scroll and every screen reader's virtual cursor — all free if the element really scrolls, none of it faithfully reimplementable. Minimum grabbable thumb with the track arithmetic corrected for it (the clamp is why hand-rolled thumbs drift away from the pointer), click-to-page on the track as every native scrollbar does, and edge fades that are the only affordance a hidden scrollbar leaves.

Fixed scroll-progress ring overlay with circle/rounded/pill shapes, 4 premium appearances (solid, glass, gradient, outline) and configurable show threshold.

Premium multi-column marketing / commerce footer: brand block with socials, link columns, optional newsletter signup, and a bottom bar with copyright, legal links and payment chips. Default, minimal and always-dark variants.

Floating action button with up/down/left/right expand directions, custom action list, pulse animation, and tooltip labels.

Horizontal and vertical resizable panels with drag handle, collapsible sides, and two-way splitAt model binding.

5 visual variants (default, glass, bordered, elevated, ghost) and 3 sizes, with grouped action buttons, separators, and actionClick output.

A repeating overlay tiled from the ROTATED bounding box. Every implementation computes the repeat from the text's own width and height and then rotates it, which at any angle but zero overlaps vertically and gaps horizontally — a moiré of clipped, colliding text that reads as a rendering bug. Rows stagger by half a tile, because a square grid reads as columns and columns leave clean vertical stripes a screenshot can be cropped to. The opacity band is narrow and undocumented everywhere: too faint and the mark dies in JPEG compression, too strong and somebody turns the feature off — so the component names which side you are on. `pointer-events: none` and `aria-hidden`, and it says in the product that it is not a security control.

10 varieties: Default, Flush, Separated, Filled, Multi-expand, Left icon, Custom icon, With badges & subtitles, With leading icons, and Disabled items. CSS-grid animation, keyboard navigation, and full dark-mode support.

An "on this page" navigation list that tracks scroll position with an IntersectionObserver and smooth-scrolls to a section on click. Vertical side-rail and horizontal pill-row layouts.

Two controls that look alike and promise different things: back is history and may leave the site, up is hierarchy and is always defined. A back control with nothing behind it goes up rather than dead-ending, and says which it did.

4 separator styles, collapsible middle crumbs, icon support, and accessible aria-label.

Compact navigation as a single native select: grouped destinations, the current one shown, and the OS picker on touch. The small form of a tab strip or an anchor rail.

Smart page-window with ellipsis, page-size selector, 3 variants and 3 sizes.

The reusable half of a dashboard sidebar: grouped items, sub-navigation, a collapsed rail and a mobile drawer — with no router dependency and no brand welded in. Bring your own header and footer.

12+ global variants: default, icon, dot, line, pill, minimal, horizontal/vertical, linear wizard, and validation states.

4 visual styles (underline, pills, boxed, lifted), vertical layout, keyboard navigation, and lazy panels.

Multi-column dropdown header navigation. Hover or click to open panels with columns of links (headings, descriptions, badges, icons) and an optional featured promo. Active-item highlighting, 3 sizes, keyboard + dark-mode support.

Dismissible alert banners in 5 semantic variants and multiple display styles.

Spotlight-style launcher with light/dark variants, 3 sizes, fuzzy search, ⌘K shortcut, grouped results, recent history, async/remote loading, disabled commands, and full keyboard navigation.

Focused confirmation modal with 6 variants, 3 sizes, type-to-confirm guard, single-button acknowledge mode, loading state, and async support.

Right-click context menu built on Dropdown Menu — opened at the cursor via triggerMode="contextmenu" or the public openAt(x, y) method.

Slide-over panel from any edge with 6 semantic variants, 6 sizes, loading & non-modal states, named content slots, and ESC/backdrop close.

Action menu with checkbox/radio items, 2 themes, 3 sizes, groups, descriptions, badges, header/footer slots, type-ahead, and auto-flipping placement.

Full-page or inline empty states with icons, titles, and action buttons.

The application menu bar — File · Edit · View. One tab stop with a roving tabindex, Left/Right between menus that carries the open menu along, hover that switches only once something is open, and type-ahead. Panels are Dropdown Menu, so portalling, flipping and the in-panel keyboard model are shared rather than copied.

6 semantic variants, 7 sizes, bottom-sheet & loading states, slot-based projection, focus trap, and ESC/backdrop close.

6 premium variants: Dropdown, Drawer, Inline, Activity Feed, Compact, and Grouped. Mark-as-read, dismiss, search, tab filtering, priority indicators, and inline action buttons.

Floating panel anchored to a trigger element in 4 positions and 3 alignments — for quick-view cards, mini forms, and rich detail panels.

7 variants, 8 auto-flipping placements, optional arrow, click/hover/manual trigger, header/subtitle/close, and click-outside/ESC close.

8 onboarding & product-tour variants: Modal (free) plus Slideshow, Tooltip, Spotlight, Beacon, Checklist, Progress Steps and Announcement (Pro). Portal-based overlay, keyboard navigation, and dark mode.

Linear progress with indeterminate, striped, animated, and glow modes across 5 variants and 4 sizes.

Circular SVG progress indicator in xs–xl sizes with default, gradient, dashed, and glow variants. Supports custom label and suffix.

Success/error/warning/info/empty result pages with semantic SVG icons, title, description, and content/action projection slots.

Loading placeholders with wave/pulse animations and preset layouts.

Loading indicators in 4 styles (border, dots, pulse, bars), 5 sizes, 8 color variants, and optional fullscreen overlay.

Imperative toast stack with 4 variants, 6 anchor positions, action callbacks, and auto-dismiss timer.

Hover/click/focus-triggered tooltip with 4 positions, 6 theme variants, and configurable show delay.