View showcase

Sass components

Sass is a styling format that is compiled into CSS. It extends CSS with advanced features like scripting, mixins, and nesting.

1232components4179storiesLast updated 2 days ago
Tweet
Add your component

Accordion

View all (9)
Accordion
Monday.com
4
accordion
accordion-item
alert
AlertBanner
Alert
Alert

Autocomplete

SbAvatar
Avatar
avatar
Avatar
SbAvatarGroup
Badge
Badge
SbBadge
badge
Badges
Banner
PromoBanner
Banner
banner

Breadcrumb

View all (13)
SbBreadcrumbs
Breadcrumbs
BreadcrumbsBar
BreadcrumbItem
Button
button
Button
Button
SbButton

Calendar

DRP - Calendar Props
SDP - Calendar Props
Calendar
Calendar
Calendar
Card
Product Card
Select Card
Image Card
Card

Carousel

View all (6)
HorizontalOverflowCarousel
Carousel
Carousel
Carousel
carousel

Chart

Dynamic Chart
stacked-column-chart
area-chart
chart-series-label
gauge-chart
line-chart
Checkbox
Checkbox
CheckboxField
Checkbox
ChipsInput
Chips
DatePickerWithInput
CloudStorageUploadItem
CloudStorageFileTitle
CloudStorageFileList
CloudStorageUploadTitle

Collapse

View all (8)
Collapsible List
Collapsible Panel
Collapse
Collapsible Toggle
Collapsible

Color picker

Color
Color picker
Colors

Combobox

View all (9)
Combo box
Combobox
Combobox
Combobox

Context menu

Context Menu
Context Menu Item
Context Menu
Context Menu
Context Menu

Date picker

View all (6)
Datetime Picker
Date picker
SbDatepicker
Datepicker
Datepicker

Details

Item Detail
DialogWizard
Dialog
DialogContentContainer
Dialog
Dialog
MenuDivider
Divider
Video thumbnail
Divider
Video

Drawer

Drawer
drawer
Drawer

Flex

Tier 1: Definitions
Font
Font
Tier 2: Usage
Footer
form-select
Form Controls
Form layout
Form
SbFormGroup
Progress Wizard
Grid Layout
ProgressWithIndicator
ProgressIndicator
Heading
Heading
Heading
EditableHeading

Hero

Hero
WFP
11
hover-load-directive
DayPickerRangeController
DayPickerSingleDateController
Icon Toggle
Icon
Lazy Image
TimeRangeInput
TimeRangePicker
DRP - Input Props
SDP - Input Props
Input
Text Input
TextInput
labeled
label
Label
Layout
Layout
Layout
AuthLayout
VizLayout
LinkList
Link
Link
SbLink
Resource list
Action list
paginated-list
List

Listbox

Listbox
SbLoading
InlineLoading
Loading
InlineLoading
Loading
MenuItem
MenuTitle
Modal
SbModal
ModalWrapper
Modal
ComposedModal
StepNavigation
unstable_TreeView
Content Navigation
MainNavigation

Notification

SbNotification
Notification
Page
Page Title
Page actions
Skeleton page

Pagination

View all (15)
pagination
Pagination
SbPagination
Pagination

Pill

FilterPill
Popover
popover
Popover
Popovers
Popover

Progress

View all (8)
LinearProgressBar
Progress Bar
Progress bar
unstable_ProgressBar
Progress
RadioField
Radio
Radio Group
RadioButtons
Radio

Rating

StarRating
Search Dropdown
Query Search
Search
filtered-search
SbSelect
Select
SelectField
Select Dropdown
Select

Separator

View all (6)
Contextual save bar
SkeletonBar
Fullscreen bar
Bar
Bar
Slider
RangeSlider
Range slider
SbSlideover

Spinner

Spinner
Spinner
Inline error
Spinner

Stack

Stack
StatsPicker
WeekStartPicker

Switch

Switch
ContentSwitcher
ContentSwitcher
Switch
Index table
Data Table
Data table
Definition Table
SbDataTable
tabs
Tabs
SbTabs
Tabs
DateRangePicker (DRP)
Tag
TextField
Text
TextField
Textarea
Text Media

Text field

SbNumberField
Text field
TextField
TextareaField
Textarea
Text style

Title

LoginTitle

Toast

Toast
Toast
toast
Toast
Toggle
SbToggle
Toggle
toggle
Tooltip
Tooltip
Tooltip
tooltip

Typography

Typography
Typography
Typography
Docs
Documentation
Add Storybook to your project in less than a minute to build components faster and easier.
reactvueangularweb-components
Tutorial
Tutorials
Learn Storybook with in-depth tutorials that teaches Storybook best practices. Follow along with code samples.
Learn Storybook now
Storybook
The MIT License (MIT). Website design by @domyen and the awesome Storybook community.
StorybookShowcaseDocsTutorialsAddonsBlogReleasesGet involvedUse casesSupportTeam
Subscribe
Get news, free tutorials, and Storybook tips emailed to you.

Maintained by
Chromatic
Continuous integration by
CircleCI
Hosting by
Netlify