New
Automatic visual tests in Storybook, plus 2.2x faster build times for React+TSVisual test with Chromatic
Star80,420
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.

1307components5106storiesLast updated last month
Tweet
Add your component

Accordion

View all (10)
bpk-component-accordion
Skyscanner9
Accordion
Monday.com4
Accordion
Carbon Design System4
Accordion
PetSmart4
accordion
GitLab2

Alert

View all (11)
bpk-component-banner-alert
Skyscanner17
alert
GitLab8
AlertBanner
Monday.com7
Alert
PetSmart7
Alert
JSTOR5

Autocomplete

Autocomplete
Shopify9
Auto Complete Search
SpaceONE6

Avatar

View all (11)
SbAvatar
Storyblok11
Avatar
Shopify9
Avatar
Monday.com8
bpk-component-navigation-bar
Skyscanner7
avatar
GitLab5

Badge

View all (10)
Badge
PetSmart14
Badge
Shopify12
bpk-component-badge
Skyscanner12
SbBadge
Storyblok7
badge
GitLab5

Banner

View all (9)
Banner
Shopify15
PromoBanner
PetSmart9
Banner
AnyVision5
banner
GitLab5
BrandBanner
Massachusetts Digital Services2

Breadcrumb

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

Button

View all (58)
Button
PetSmart31
Button
Shopify22
button
GitLab21
bpk-component-button
Skyscanner21
bpk-component-loading-button
Skyscanner14

Calendar

View all (8)
DRP - Calendar Props
AirBnb33
SDP - Calendar Props
AirBnb28
bpk-component-calendar
Skyscanner20
bpk-component-scrollable-calendar
Skyscanner19
Dark
Capgemini16

Card

View all (20)
Product Card
PetSmart23
LegacyCard
Shopify18
Image Card
JSTOR14
MediaCard
Shopify9
Select Card
SpaceONE9

Carousel

HorizontalOverflowCarousel
PetSmart3
carousel
GitLab1
Carousel
PetSmart1

Chart

bpk-component-barchart
Skyscanner11
Dynamic Chart
SpaceONE4

Chat

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

Checkbox

View all (19)
bpk-component-checkbox
Skyscanner9
Checkbox
WFP7
Checkbox
SpaceONE6
CheckboxField
PetSmart6
Checkbox
JSTOR5

Chip

View all (10)
ChipsInput
AnyVision9
bpk-component-graphic-promotion
Skyscanner8
bpk-component-phone-input
Skyscanner8
bpk-component-chip
Skyscanner7
Chips
Monday.com5

Code

View all (24)
bpk-component-fieldset
Skyscanner13
bpk-component-datepicker
Skyscanner12
CloudStorageUploadItem
Agora7
bpk-component-nudger
Skyscanner7
bpk-component-slider
Skyscanner7

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
Shopify6

Details

Item Detail
JSTOR1

Dialog

View all (7)
DialogWizard
AnyVision5
Dialog
Narmi4
bpk-component-dialog
Skyscanner4
DialogContentContainer
Monday.com3
SbUploadDialog
Storyblok1

Divider

View all (7)
VideoThumbnail
Shopify4
MenuDivider
Monday.com3
Divider
Monday.com2
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
FormLayout
Shopify4
Form Controls
Palmetto4
Form
Shopify2
SbFormGroup
Storyblok2

Grid

View all (8)
Grid
Carbon Design System10
Progress Wizard
SpaceONE6
Grid Layout
SpaceONE5
bpk-component-grid
Skyscanner4
ProgressWithIndicator
AnyVision3

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 (9)
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 (37)
DayPickerRangeController
AirBnb37
DayPickerSingleDateController
AirBnb21
Icon
PetSmart11
bpk-component-icon
Skyscanner10
Icon
Monday.com6

Image

View all (11)
bpk-component-image
Skyscanner12
Lazy Image
SpaceONE5
ImagePromo
Massachusetts Digital Services3
TimeRangeInput
Grafana2
TimeRangePicker
Grafana2

Input

View all (33)
DRP - Input Props
AirBnb18
SDP - Input Props
AirBnb14
bpk-component-input
Skyscanner14
Input
SpaceONE11
Text Input
JSTOR6

Label

View all (14)
chart-series-label
GitLab7
bpk-component-label
Skyscanner6
Label
Monday.com4
Label
PetSmart4
labeled
GitLab3

Layout

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

Link

View all (19)
LinkList
PetSmart7
bpk-component-link
Skyscanner7
Link
Monday.com6
Link
JSTOR5
Link
Shopify4

List

View all (45)
ResourceList
Shopify16
ActionList
Shopify9
OptionList
Shopify7
MultiSelect
Carbon Design System6
paginated-list
GitLab6

Listbox

Listbox
Shopify7

Loading

View all (12)
SbLoading
Storyblok7
Floating
Capgemini5
InlineLoading
WFP3
Loading
WFP3
InlineLoading
Carbon Design System2

Menu

View all (11)
bpk-component-autosuggest
Skyscanner8
Menu
AnyVision7
Menu
Monday.com5
MenuItem
Monday.com5
OverflowMenu
Carbon Design System3

Modal

View all (22)
Modal
Shopify15
bpk-component-modal
Skyscanner12
SbModal
Storyblok9
ModalWrapper
WFP5
Modal
JSTOR4

Nav

View all (21)
bpk-component-horizontal-nav
Skyscanner11
StepNavigation
WFP4
unstable_TreeView
Carbon Design System3
UtilityNav
Massachusetts Digital Services3
bpk-component-navigation-stack
Skyscanner3

Notification

SbNotification
Storyblok4
Notification
PetSmart1

Page

View all (13)
Page
Shopify17
Pages
kickstartDS8
Page Title
SpaceONE6
SkeletonPage
Shopify5
PageActions
Shopify4

Pagination

View all (16)
bpk-component-pagination
Skyscanner6
pagination
GitLab5
Pagination
PetSmart5
SbPagination
Storyblok4
Pagination
Shopify3

Pill

bpk-component-infinite-scroll
Skyscanner10
FilterPill
Grafana2

Popover

View all (9)
bpk-component-popover
Skyscanner11
Popover
Shopify9
bpk-component-overlay
Skyscanner8
Popover
JSTOR5
popover
GitLab3

Progress

View all (9)
LinearProgressBar
Monday.com6
Progress Bar
SpaceONE5
ProgressBar
Shopify4
unstable_ProgressBar
Carbon Design System4
bpk-component-progress
Skyscanner4

Radio

View all (11)
RadioField
PetSmart12
bpk-component-radio
Skyscanner7
Radio
SpaceONE6
Radio Group
JSTOR4
RadioButtons
Narmi4

Rating

bpk-component-star-rating
Skyscanner11
bpk-component-rating
Skyscanner6
StarRating
PetSmart4

Search

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

Select

View all (20)
SbSelect
Storyblok18
SelectField
PetSmart17
bpk-component-select
Skyscanner12
Select
Grafana11
Select Dropdown
SpaceONE9

Separator

SkeletonBar
PetSmart4
ContextualSaveBar
Shopify3
FullscreenBar
Shopify3

Slider

View all (9)
Slider
Monday.com9
RangeSlider
AnyVision9
RangeSlider
Shopify5
IndexFilters
Shopify5
SbSlideover
Storyblok4

Spinner

Spinner
Shopify4
Spinner
AnyVision3
bpk-component-spinner
Skyscanner3
InlineError
Shopify1
Spinner
Grafana1

Stack

View all (6)
HorizontalStack
Shopify16
VerticalStack
Shopify12
stacked-column-chart
GitLab8
LegacyStack
Shopify7
StatsPicker
Grafana1

Switch

Switch
AnyVision3
ContentSwitcher
WFP3
bpk-component-switch
Skyscanner3
ContentSwitcher
Carbon Design System2
Switch
Grafana2

Table

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

Tabs

View all (15)
tabs
GitLab8
Tabs
Shopify7
Tabs
Monday.com6
LegacyTabs
Shopify6
Tabs
Narmi6

Tag

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

Text

View all (20)
TextField
AnyVision17
Text
WFP8
TextField
Monday.com7
Textarea
SpaceONE6
bpk-component-text
Skyscanner6

Text field

SbNumberField
Storyblok1

Textarea

View all (12)
TextField
Shopify22
TextField
PetSmart19
Text
Shopify9
Textarea
JSTOR6
SbTextField
Storyblok6

Title

LoginTitle
Agora1
Tile
PetSmart1

Toast

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

Toggle

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

Tooltip

View all (16)
Tooltip
Shopify14
Tooltip
JSTOR7
bpk-component-tooltip
Skyscanner7
Tooltip
Carbon Design System6
Tooltip
Monday.com5

Typography

Typography
JSTOR12
Typography
Storyblok1
Typography
Grafana1
typography
Massachusetts Digital Services1