Browse every component, CSS utility, and hook available in Litefy UI.
An avatar component with image loading states, skeleton and fallback support
An auto-scrolling marquee banner with seamless looping, hover pause and direction control
A square surface slot with a corner marker — drop an icon inside and attach a label to the top-right corner.
A navigation trail of composable parts — nav, list, item, link, page and separator — with a data-driven composite for simple trails
A button component with multiple variants and loading states
Block-level static feedback for long-form notes, descriptions and result feedback — one place for all block-level status colors.
Inline status label for short text marks, state flags and filter tags — carries all system status color semantics in one place.
A pill-shaped overflow-hidden container that joins arbitrary children — tags, toggles, segments, links — into one capsule.
A glassmorphic static surface with a fixed soft shadow.
A card-shaped interactive button — rests at shadow-base, lifts to shadow-elevated on hover.
A calendar panel component built on the native Temporal API, supporting controlled selection, disabled dates and parts-based assembly
A multi-level cascading selector driven by a tree, built from a breadcrumb-style trigger and popover panels positioned via CSS anchor positioning
A self-built canvas time-series chart engine sharing the chart-kit math layer — automatic canvas theming, responsive width, interactive legend and hover tooltip
Toggleable legend shared by Chart, Donut and Radar — clickable entries hide or restore series, with line and square swatches
A chat composer with pasted-screenshot thumbnails, a capability-toggle slot and an icon-only send button — mobile-ready out of the box.
A collapsible component that supports single panel, accordion, and multiple modes
A checkbox component supporting controlled, uncontrolled, group and custom indicator
A primitive component that automatically collapses overflowing chips, exposing the hidden set via renderMore / onOverflowChange for consumer-side composition
An input with a filterable dropdown list — local options with client-side filtering, or async remote search with debounced fetching and scroll-to-load-more
A dialog-based command palette — a trigger (or application hotkey) opens a dialog with a search input on top and a filtered, keyboard-navigable list below.
A date picker built on the native Temporal API — an editable input, a month panel and pointer-anchored popover in one shipped component
A modal dialog component built on the native HTML dialog element
Zero-dependency SVG pie and donut chart with theme-synced palette, hover focus with center readout, and a toggleable legend
A slide-in panel component with multiple placement options
A dropdown menu composed of Popover and Menu — group items, nest submenus, and navigate with the keyboard
An imperative right-click context menu with pointer anchoring, grouping and submenus — built on Menu and native popover, opened with a single call
An all-in-one search control pairing a leading field select with a value input — text fields filter on debounce, enum fields search on pick.
A complete form composition with fields, submit, validation, and imperative ref control
A self-managing form field that renders a finished control per variant — label, input and a description / error line in a fixed vertical layout with built-in validation
An image component with loading state, loading placeholder, and error handling
An input component with leading/trailing slot support and validation states
An input shell that owns focus and invalid styling for a wrapped control — leading/trailing slots plus the inner input, never a double focus ring.
A one-time-code input with auto-advance, paste support, keyboard navigation and mask mode.
A static keyboard key visual for displaying shortcuts.
A scrollable list container with keyboard navigation, highlight, selection and scroll-bottom callbacks
A masonry layout that balances items across equal-width columns by measured height, with responsive column counts
A menu component usable directly in the document flow, with grouping, two-level submenus and keyboard navigation
A multi-select dropdown composed of Popover and CheckboxGroup — flat or grouped options, keyboard navigation, controlled value
A compact numeric field with a leading Minus and trailing Plus stepper button — keyboard stepping, thousands separators and a border by default.
A bordered numeric input with a non-interactive up/down cue in the trailing area — stepping is keyboard-only. The form-friendly sibling of NumberField.
A controlled page navigator — first / prev / numbered pages with ellipsis / next / last. Pure view, pair it with usePagination for state.
A controlled single-DOM pager with touch gesture dragging, loop and View-Transition page switching, built for manga-style readers and paged content
A print-ready page surface with A4/A5 variants in portrait or landscape orientation.
A password input component with visibility toggle, supporting composable assembly
A generic input + popover container component for building pickers such as a date picker, powered by native popover and CSS anchor positioning
A button-triggered popover panel built on popover + CSS Anchor Positioning — the base for dropdown-menu compositions
A preview card composed of Card, Image, and Tooltip — an image card on its own, or as a rich hover preview on a link
A pure UI progress bar that only renders current and duration — no built-in scheduling, sampling, or estimation logic
A parts-based radio component with an options-driven group — arrow-key navigation comes native via the shared name
Zero-dependency SVG radar chart with concentric grid, category axes, theme-synced series colors and legend toggling
A themeable select built on the native popover API and a listbox panel — supports option groups, keyboard navigation and validation
A table with a built-in checkbox column and select-all with indeterminate state. Pagination is composed externally with Pagination and usePagination.
A scrollable container with gradient shadow indicators for better scroll awareness
A separator component supporting horizontal and vertical orientations, with text label and composable assembly
A segmented control component for single-select, supporting controlled, uncontrolled and options-driven modes
A collapsible sidebar with ref-based external control
A pulsing placeholder block for loading states.
Tiny axis-free trend line rendered in SVG — colored via currentColor so it themes like any text element
A simulated slider with horizontal and vertical orientations, pointer dragging and keyboard support
A controlled steps indicator with completed, current and upcoming states, and forward-jump locking for wizard flows
A generic data table with clickable sortable headers for local data, or remote mode that delegates sorting to your database.
A toggle switch component with controlled state and composable assembly
An options-driven tabs component with multiple variants and orientation support
A multi-line text input with built-in invalid state support and a form-friendly onChange signature
A vertical timeline — a display-only component of markers, connector lines, times, titles and descriptions
A global toast notification component with a store-based imperative API
A toggle button component supporting controlled, uncontrolled and group multi-select modes
A tooltip component built on the native Popover API and CSS anchor positioning
Heading, headline, description and inline code styles for a consistent typographic hierarchy.
A dual-panel transfer that moves items between source and target lists with checkbox selection
A two-panel picker for single or multiple selection — option rows and selected rows are render-prop driven, so any content format works.
A dropzone upload component with local validation, drag and drop, and a decoupled upload monitor hook
A canvas-based watermark component that tiles text over content, with a composable two-part API
A steps + pager wizard that manages index state internally — visited steps can be revisited, future steps are locked
A tailwind-merge based class merge helper that resolves conflicting Tailwind utilities in the last-wins order.
Pure-function math layer for SVG charts — polar paths, donut layout, linear scales and monotone-smoothed line/area paths, zero dependencies
Canvas painting helpers for the chart family — plot rect, grid, axis labels, line/area/bars, crosshair and drag selection, all theme-aware
Global theme state hook with localStorage persistence for brand, surface and color mode
Hook that generates 8 high-contrast chart colors from the current theme primary, with color-wheel and same-hue modes
Virtual-focus keyboard wiring for Picker panels — the input keeps focus while ArrowDown / ArrowUp move a highlight through the items
Scroll-driven paging for local data — grows the visible slice as a sentinel approaches the viewport
Real-focus keyboard wiring for Picker panels — ArrowDown / ArrowUp move focus into the panel's first or last focusable element
Native popover lifecycle for anchored panels — show/hide sync, outside-press close with anchor exclusion, and focus save/restore
Focus trap for modal containers — call it from onKeyDown and Tab cycles inside the container instead of escaping to the page
Pointer-based drag hook with pointer capture, drag info callbacks and an isDragging flag
Debounced keyword search plus append-based pagination for remote data sources
Sort-state manager for database-backed tables — cycles asc / desc / cleared, builds the query string and debounces the refetch callback.
Fixed-height list virtualization hook returning container props, the render window and scroll commands
Monitor file uploads with XMLHttpRequest progress tracking and abortable removal
Image loading state machine shared by Avatar and Image — preloads via `new Image()` and resolves to loading, success or failure with safe cleanup
A headless pagination state hook with looping, dynamic totals and change callbacks