🍽️ Basecoat UI Kitchen Sink
Comprehensive showcase of all 24 Basecoat UI components organized by category
🔥 Performance Benchmark (Astro)
🏆 Professional Performance Benchmark Suite
Form Controls
Interactive components for user input and form handling
Buttons
Input Fields
Select Dropdown
Textarea
Checkboxes
Switches
Radio Groups
Payment method:
Toggle
Display Components
Components for showing content, status, and visual information
Sample Card
This is a basic card component with title and content.
Alerts
Success!
Warning
Error
Badges
Avatars
Progress
Loading (25%)
Upload (75%)
Loading Skeletons
Toast Notifications
Click buttons to trigger different toast notifications
Example static toast (server-rendered):
Static Toast
This is a server-rendered toast for demonstration.
Breadcrumbs
- Home /
- Library /
- Components /
- Breadcrumb
Navigation Components
Components for organizing and navigating through content
Nested Tabs Example
Account settings and profile information.
Security settings and password management.
Notification preferences and email settings.
Accordion
What is Basecoat UI?
How do I install it?
Is it accessible?
Dropdown Menu
Data Table
| Name | Role | Status | |
|---|---|---|---|
| John Doe | john@example.com | Admin | Active |
| Jane Smith | jane@example.com | User | Pending |
| Mike Johnson | mike@example.com | Editor | Active |
Sidebar Navigation
This is the main content area. The sidebar can be collapsed or expanded.
Overlay Components
Modal dialogs, tooltips, and overlay components
Alert Dialog
Click to open alert dialog
Modal
Click to open modal with different sizes
Popover
Click to show popover
Tooltips
Hover over elements for tooltips
Toggle States
Interactive toggle states