Ready-made components for BarefootJS
Pick a component. Copy the code. Make it yours.
Components
Accordion
Vertically collapsing content sections
Alert
Callout for important content
Alert Dialog
Modal dialog for important confirmations
Aspect Ratio
Content within a desired ratio
Avatar
User profile image with fallback
Badge
Small status indicator labels
Breadcrumb
Navigation hierarchy trail
Button
Clickable actions with multiple variants
Calendar
Date picker with month navigation
Card
Container for grouped content
Carousel
Motion and swipe content slider
Checkbox
Toggle selection control
Collapsible
Expandable content section
Command
Search and command menu
Combobox
Autocomplete input with searchable dropdown
Context Menu
Right-click menu at cursor position
Data Table
Sortable, filterable data table
Date Picker
Date selection with calendar popup
Dialog
Modal overlay with custom content
Drawer
Slide-out panel from screen edge
Dropdown Menu
Action menu triggered by a button
Hover Card
Preview card on hover
Input
Text input field
Input OTP
One-time password input
Label
Accessible label for form controls
Menubar
Desktop application menu bar
Navigation Menu
Hover-activated navigation links
Pagination
Page navigation controls
Popover
Floating content anchored to a trigger
Progress
Task completion indicator bar
Radio Group
Single-select option group
Resizable
Draggable resize panels
Scroll Area
Custom scrollbar container
Select
Dropdown selection control
Sidebar
Collapsible navigation panel
Separator
Visual divider between content
Skeleton
Placeholder loading indicator
Sheet
Side panel overlay
Slider
Range value selector
Spinner
Animated loading indicator
Switch
On/off toggle control
Table
Responsive data table
Tabs
Tabbed content navigation
Textarea
Multi-line text input
Toast
Temporary notification message
Toggle
Two-state pressed button
Toggle Group
Group of toggle buttons
Tooltip
Informational text on hover