Components with a point of view.
Accessible primitives, complete product blocks, motion recipes, and atmospheric effects—installed as source and ready to become yours.
Theme Provider
A persistent dark-first DesignOS theme provider and theme hook.
Button
Four restrained action variants with loading, size, and disabled states.
Icon Button
A compact accessible icon action with a required name.
Badge
Compact metadata badges across neutral and semantic tones.
Status Badge
Semantic status with a quiet signal dot and readable label.
Input
Labeled text input with hint and accessible error messaging.
Textarea
A calm, vertically resizable multiline field with supporting text.
Select
Native select semantics with DesignOS styling and hints.
Checkbox
A native checkbox with a precise custom control and visible focus.
Switch
A labeled native checkbox exposed as an accessible switch.
Card
Composable card regions with restrained borders and hierarchy.
Alert
Accessible alert and status messaging in four semantic tones.
Tabs
Controlled or uncontrolled tabs with roving keyboard navigation.
Accordion
A platform-native single-open disclosure group with animated indicators.
Dialog
A native modal dialog with backdrop dismissal and structured regions.
Dropdown Menu
A compact action menu with outside click and Escape handling.
Tooltip
A focus-aware tooltip for concise supplementary labels.
Command Palette
A Spotlight-style command surface with Cmd/Ctrl K, filtering, and keyboard selection.
Toast
An auto-dismissing live notification region with manual controls.
Skeleton
A restrained loading placeholder that honors reduced motion.
Progress
An accessible determinate progress indicator with smooth updates.
Table
Composable, scroll-safe semantic data table primitives.
Breadcrumb
Semantic path navigation with quiet monospaced metadata.
Pagination
Compact controlled pagination with clear current-page semantics.
Copy Control
Clipboard control with clear transient success feedback.
Code Block
A developer-focused code surface with filename, language, and copy feedback.
Navbar
A responsive product navigation bar with brand, search, menu, and action slots.
Sidebar
A grouped application sidebar with active state and footer slot.
Footer
A responsive multi-column footer carrying DesignOS authorship.
Hero
A signature DesignOS landing hero with responsive demo surface and restrained atmosphere.
Feature Section
A responsive feature grid with strong editorial hierarchy.
Pricing Section
Three-tier pricing cards with a restrained featured state.
Splash Screen
A timed launch sequence with breathing mark, progress motion, and graceful exit.
Synchronized Workbench
Paired text workspaces that resize together through pointer and keyboard controls.
Grid Background
The signature 48-pixel technical grid with an adjustable scale and soft fade.
Dot Background
A centered technical dot field for demos and empty states.
Orbit Background
Concentric structural rings for calm focal composition.
Scan Background
A low-intensity traveling scan plane for active system surfaces.
Noise Background
A subtle embedded grain layer that avoids external image assets.
Ambient Background
A restrained moving dual-radial atmosphere for large surfaces.
Reveal Motion
A composable load-in reveal with optional stagger delay.
Breathe Motion
A quiet breathing loop for live marks and waiting states.
Drop Motion
A short drop-in entrance tuned for menus and selection surfaces.