New
Storybook Ecosystem CIAutomate with Chromatic
Star75,957
Back to overview
Add your project

Sass components

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

1194components4390storiesLast updated 7 days ago
Tweet
Add your component

Accordion

View all (9)
Accordion
Monday.com4
Accordion
Carbon Design System4
Accordion
PetSmart3
accordion
GitLab2
accordion-item
GitLab2

Alert

View all (10)
alert
GitLab8
AlertBanner
Monday.com7
Alert
PetSmart7
Alert
JSTOR5
CalloutAlert
Massachusetts Digital Services2

Autocomplete

Autocomplete
Shopify9
Auto Complete Search
SpaceONE6

Avatar

View all (10)
SbAvatar
Storyblok11
Avatar
Monday.com8
Avatar
Shopify7
avatar
GitLab5
SbAvatarGroup
Storyblok3

Badge

View all (9)
Badge
PetSmart13
Badge
Shopify11
SbBadge
Storyblok7
badge
GitLab5
Badges
SpaceONE4

Banner

View all (9)
Banner
Shopify10
PromoBanner
PetSmart8
Banner
AnyVision5
banner
GitLab5
BrandBanner
Massachusetts Digital Services2

Breadcrumb

View all (10)
SbBreadcrumbs
Storyblok5
Breadcrumbs
SpaceONE5
BreadcrumbsBar
Monday.com4
Breadcrumb
Carbon Design System4
BreadcrumbItem
Monday.com3

Button

View all (56)
Button
PetSmart29
button
GitLab21
Button
Shopify19
Button
Monday.com11
SbButton
Storyblok11

Calendar

DRP - Calendar Props
AirBnb33
SDP - Calendar Props
AirBnb28

Card

View all (19)
Product Card
PetSmart23
Card
Shopify17
Image Card
JSTOR13
Select Card
SpaceONE9
Card
Grafana8

Carousel

HorizontalOverflowCarousel
PetSmart3
carousel
GitLab1
Carousel
PetSmart1

Chart

Dynamic Chart
SpaceONE4

Chat

View all (8)
ChatMessage
Agora1
ChatMessageList
Agora1
ChatMessages
Agora1
ChatPanel
Agora1
ChatTabTitle
Agora1

Checkbox

View all (19)
StyledCheckbox
Capgemini8
Checkbox
WFP7
Checkbox
SpaceONE6
CheckboxField
PetSmart6
Checkbox
JSTOR5

Chip

View all (7)
ChipsInput
AnyVision9
Chips
Monday.com5
Chips
PetSmart5
chart-tooltip
GitLab4
Chip
AnyVision3

Code

View all (15)
CloudStorageUploadItem
Agora7
CodeSnippet
Carbon Design System6
CloudStorageFileTitle
Agora5
CloudStorageFileList
Agora4
CloudStorageUploadTitle
Agora4

Collapse

View all (8)
Collapsible List
SpaceONE7
Collapsible Panel
SpaceONE3
Collapse
Grafana2
Collapsible Toggle
SpaceONE2
Collapsible
Shopify1

Color picker

Color
Narmi5
ColorPicker
Shopify4
Colors
Storyblok1

Combobox

View all (6)
Combo box
Monday.com10
Combobox
JSTOR6
Combobox
Shopify6
Combobox
Narmi5
ComboBox
Carbon Design System4

Context menu

Context Menu
SpaceONE14
Context Menu Item
SpaceONE6

Date picker

Datetime Picker
SpaceONE11
SbDatepicker
Storyblok7
DatePicker
Shopify5

Details

Details
Capgemini3
Item Detail
JSTOR1

Dialog

View all (6)
DialogWizard
AnyVision5
Dialog
Narmi4
DialogContentContainer
Monday.com3
SbUploadDialog
Storyblok1
Dialog
AnyVision1

Divider

View all (7)
MenuDivider
Monday.com3
Divider
Monday.com2
VideoThumbnail
Shopify2
Divider
Shopify2
Divider
SpaceONE2

Drawer

Drawer
PetSmart6
drawer
GitLab4
Drawer
Grafana4

Flex

Flex
Monday.com8
FilterBox
Massachusetts Digital Services1

Footer

View all (13)
Tier 1: Definitions
PetSmart8
Font
Narmi5
Font
Narmi5
Tier 2: Usage
PetSmart5
Footer
WFP4

Form

View all (11)
form-select
GitLab5
Form Controls
Palmetto4
FormLayout
Shopify3
Form
Shopify2
SbFormGroup
Storyblok2

Grid

View all (7)
Grid
Carbon Design System10
Progress Wizard
SpaceONE6
Grid Layout
SpaceONE5
ProgressWithIndicator
AnyVision3
ProgressIndicator
Carbon Design System3

Header

View all (15)
Header
Massachusetts Digital Services6
PageHeader
PetSmart5
HeaderSearch
Massachusetts Digital Services2
HeaderHamburger
Massachusetts Digital Services2
HeaderSlim
Massachusetts Digital Services2

Heading

View all (11)
Heading
PetSmart14
Heading
Monday.com5
Heading
JSTOR3
EditableHeading
Monday.com3
ResultsHeading
Massachusetts Digital Services2

Hero

Hero
WFP11
Hero
kickstartDS6
hover-load-directive
GitLab1
Hero
PetSmart1
TypeAheadDropdown
Massachusetts Digital Services1

Icon

View all (34)
DayPickerRangeController
AirBnb37
DayPickerSingleDateController
AirBnb21
Icon
PetSmart11
Icon
Monday.com6
Icon Toggle
PetSmart6

Image

View all (10)
Lazy Image
SpaceONE5
ImagePromo
Massachusetts Digital Services3
TimeRangeInput
Grafana2
TimeRangePicker
Grafana2
Image
Massachusetts Digital Services2

Input

View all (34)
DRP - Input Props
AirBnb18
SDP - Input Props
AirBnb14
Input
SpaceONE11
Text Input
JSTOR6
TextInput
Narmi6

Label

View all (13)
chart-series-label
GitLab7
Label
Monday.com4
Label
PetSmart4
labeled
GitLab3
label
GitLab3

Layout

View all (12)
Layout
Shopify6
Layout
JSTOR5
Layout
PetSmart4
AuthLayout
WFP3
VizLayout
Grafana2

Link

View all (17)
LinkList
PetSmart7
Link
Monday.com6
Link
JSTOR5
Link
Shopify4
TextLink
PetSmart4

List

View all (43)
ResourceList
Shopify15
ActionList
Shopify8
MultiSelect
Carbon Design System6
paginated-list
GitLab6
List
WFP6

Listbox

Listbox
Shopify5

Loading

View all (12)
SbLoading
Storyblok7
MultiUpload
Capgemini4
InlineLoading
WFP3
Loading
WFP3
InlineLoading
Carbon Design System2

Menu

View all (9)
Menu
AnyVision7
Menu
Monday.com5
MenuItem
Monday.com5
OverflowMenu
Carbon Design System3
MenuTitle
Monday.com2

Modal

View all (21)
Modal
Shopify9
SbModal
Storyblok9
ModalWrapper
WFP5
Modal
JSTOR4
ComposedModal
Carbon Design System4

Nav

View all (18)
StepNavigation
WFP4
unstable_TreeView
Carbon Design System3
UtilityNav
Massachusetts Digital Services3
Content Navigation
kickstartDS2
MainNavigation
WFP2

Notification

SbNotification
Storyblok4
Notification
PetSmart1

Page

View all (13)
Page
Shopify14
Pages
kickstartDS8
Page Title
SpaceONE6
PageActions
Shopify4
SkeletonPage
Shopify2

Pagination

View all (15)
pagination
GitLab5
Pagination
PetSmart5
SbPagination
Storyblok4
Pagination
Shopify3
Pagination
Carbon Design System3

Pill

FilterPill
Grafana2

Popover

View all (6)
Popover
Shopify5
popover
GitLab3
Popover
Narmi2
Popovers
Grafana2
Popover
SpaceONE2

Progress

View all (9)
LinearProgressBar
Monday.com6
Progress Bar
SpaceONE5
ProgressBar
Shopify4
unstable_ProgressBar
Carbon Design System4
Progress
AnyVision3

Radio

View all (11)
RadioField
PetSmart12
StyledRadios
Capgemini8
Radio
SpaceONE6
Radio Group
JSTOR4
RadioButtons
Narmi4

Rating

StarRating
PetSmart4

Search

View all (13)
Search Dropdown
SpaceONE12
Query Search
SpaceONE7
Search
Carbon Design System5
Search
SpaceONE5
filtered-search
GitLab4

Select

View all (21)
SbSelect
Storyblok18
SelectField
PetSmart16
Select
Grafana11
Select Dropdown
SpaceONE9
Select
Capgemini9

Separator

SkeletonBar
PetSmart4
ContextualSaveBar
Shopify3
FullscreenBar
Shopify2

Slider

View all (8)
Slider
Monday.com9
RangeSlider
AnyVision9
RangeSlider
Shopify5
SbSlideover
Storyblok4
Slider
Carbon Design System4

Spinner

Inline
Shopify16
Spinner
Shopify3
Spinner
AnyVision3
InlineError
Shopify1
Spinner
Grafana1

Stack

stacked-column-chart
GitLab8
Stack
Shopify7
AlphaStack
Shopify6
StatsPicker
Grafana1
WeekStartPicker
Grafana1

Switch

Switch
AnyVision3
ContentSwitcher
WFP3
ContentSwitcher
Carbon Design System2
Switch
Grafana2

Table

View all (25)
IndexTable
Shopify18
Data Table
SpaceONE12
DataTable
Shopify11
SbDataTable
Storyblok11
Definition Table
SpaceONE9

Tabs

View all (15)
tabs
GitLab8
Tabs
Monday.com6
Tabs
Narmi6
Tabs
JSTOR5
SbTabs
Storyblok5

Tag

View all (16)
DateRangePicker (DRP)
AirBnb8
Tag
Shopify6
Tag
Carbon Design System5
Tag
SpaceONE4
Tag
Narmi3

Text

View all (18)
TextField
AnyVision17
Text
WFP8
TextField
Monday.com7
Textarea
SpaceONE6
Text Media
kickstartDS4

Text field

SbNumberField
Storyblok1

Textarea

View all (14)
TextField
Shopify20
TextField
PetSmart17
TextareaField
PetSmart7
Textarea
JSTOR6
TextStyle
Shopify6

Title

LoginTitle
Agora1
Tile
PetSmart1

Toast

Toast
Monday.com6
Toast
JSTOR5
Toast
Shopify5
toast
GitLab3
Toast
SpaceONE1

Toggle

View all (9)
Toggle
Monday.com5
Toggle
Capgemini5
SbToggle
Storyblok3
Toggle
Narmi3
Toggle
Carbon Design System3

Tooltip

View all (16)
Tooltip
JSTOR7
Tooltip
Carbon Design System6
Tooltip
Monday.com5
Tooltip
AnyVision4
tooltip
GitLab4

Typography

Typography
JSTOR12
Typography
Storyblok1
Typography
Grafana1
typography
Massachusetts Digital Services1