Design System
37 components, semantic tokens, WCAG AA, mobile-first
Forms & Actions
Input & Select
Input
Error (string)
This field is required
SearchInput
Select (options)
Select (children)
Textarea
Switch
Checkbox
Get weekly updates and tips
You must accept the terms
A larger checkbox with description
Layout
Card
Default
Standard card
Outline
Thick border
Elevated
Shadow
Glass
Frosted
Gradient Accent
PageHeader
Your Agents
Deploy and monitor your AI fleet.
Activity
Tabs
Default
Overview content
Underline
Transcript view
Pills
All media
Data Display
Table
Sortable + Actions
| Name | Type | Status | Actions |
|---|---|---|---|
| Interview Recording | Audio | Done | |
| Product Demo | Video | Processing |
Pagination
Page 1 of 9 (87 total)
Empty
| Name | Type | Status |
|---|---|---|
No results found Try adjusting your search. | ||
Skeleton
StatCard
Hours
1,234
Docs
567
Users
89
Credits
$42
Badge
Variants
Colors
StatusBadge
InfoCard
Tip
Shortcuts make editing faster.
Warning
Trial expires in 3 days.
Action
Cannot be undone.
Success
All systems operational.
Feedback
Toast
Hover to pause. Errors persist 15s.
Dialog & ConfirmDialog
EmptyState
No documents
Upload your first document.
ErrorState
Something went wrong
Failed to load transcript.
Load Failed
Could not fetch data.
Utilities
DropdownMenu
With trigger (recommended)
Triggerless (legacy compat)
Tooltip
Avatar
Progress
Auth
AuthCard
With Logo & Subtitle
Welcome Back
Sign in to your Speak account
Register Variant
Create Account
Start your free trial today
PasswordInput
Default
With Error
Must be at least 8 characters
Error (boolean)
Disabled
Advanced Forms
ColorPicker
With Presets
Without Presets
Disabled
ImageUploader
Dropzone Variant
Avatar Variant
Profile Photo
Upload a profile picture
Disabled
FileDropzone
Default
Drop files here or click to browse
Accepted: .mp3,.wav,.mp4,.m4a
Custom Children
Upload Media Files
Drag audio or video files to start transcription
Disabled
Drop files here or click to browse
All file types accepted
Chips
With Suggestions
Without Suggestions
Max 3 Items
UI Components
RadioGroup
Vertical
Horizontal
Accordion
Single Mode
Multiple Mode
Slider
Default
Custom Range & Step
Disabled
Skeleton
Loading Skeletons
Text
Grid
Form (flat / sections)
variant="flat"
variant="sections"