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.

1047components4175storiesLast updated last year
Tweet
Add your component

Accordion

View all (7)
bpk-component-accordion
Skyscanner
9
Accordion
Carbon Design System
4
accordion
GitLab
2
accordion-item
GitLab
2
SbAccordion
Storyblok
1

Alert

View all (9)
bpk-component-banner-alert
Skyscanner
17
alert
GitLab
8
Alert
JSTOR
5
CalloutAlert
Massachusetts Digital Services
2
EmergencyAlerts
Massachusetts Digital Services
2

Autocomplete

Avatar

View all (10)
SbAvatar
Storyblok
11
Avatar
Shopify
7
bpk-component-navigation-bar
Skyscanner
7
avatar
GitLab
5
SbAvatarGroup
Storyblok
3

Badge

View all (8)
Badge
Shopify
13
bpk-component-badge
Skyscanner
12
SbBadge
Storyblok
7
badge
GitLab
5
Badges
SpaceONE
4

Banner

View all (7)
Banner
Shopify
15
Banner
AnyVision
5
banner
GitLab
5
BrandBanner
Massachusetts Digital Services
2
BannerNavigation
WFP
2

Breadcrumb

View all (8)
SbBreadcrumbs
Storyblok
5
Breadcrumbs
SpaceONE
5
Breadcrumb
Carbon Design System
4
bpk-component-breadcrumb
Skyscanner
3
breadcrumb
GitLab
2

Button

View all (48)
Button
Shopify
24
button
GitLab
21
bpk-component-button
Skyscanner
21
bpk-component-loading-button
Skyscanner
14
SbButton
Storyblok
11

Calendar

DRP - Calendar Props
AirBnb
33
SDP - Calendar Props
AirBnb
28
bpk-component-calendar
Skyscanner
20
bpk-component-scrollable-calendar
Skyscanner
19

Card

View all (18)
Card
Shopify
22
LegacyCard
Shopify
18
Image Card
JSTOR
15
MediaCard
Shopify
9
Select Card
SpaceONE
9

Carousel

carousel
GitLab
1

Chart

bpk-component-barchart
Skyscanner
11
Dynamic Chart
SpaceONE
4

Chat

View all (8)
ChatMessage
Agora
1
ChatMessageList
Agora
1
ChatMessages
Agora
1
ChatPanel
Agora
1
ChatTabTitle
Agora
1

Checkbox

View all (15)
bpk-component-checkbox
Skyscanner
9
Checkbox
WFP
7
Checkbox
Shopify
6
Checkbox
SpaceONE
6
Checkbox
JSTOR
5

Chip

View all (8)
ChipsInput
AnyVision
9
bpk-component-graphic-promotion
Skyscanner
8
bpk-component-phone-input
Skyscanner
8
bpk-component-chip
Skyscanner
7
chart-tooltip
GitLab
4

Code

View all (23)
bpk-component-fieldset
Skyscanner
13
bpk-component-datepicker
Skyscanner
12
CloudStorageUploadItem
Agora
7
bpk-component-nudger
Skyscanner
7
bpk-component-slider
Skyscanner
7

Collapse

View all (8)
Collapsible List
SpaceONE
7
Collapsible
Shopify
4
Collapsible Panel
SpaceONE
3
Collapse
Grafana
2
Collapsible Toggle
SpaceONE
2

Color picker

ColorPicker
Shopify
4
Colors
Storyblok
1

Combobox

Combobox
Shopify
7
Combobox
JSTOR
6
Combobox
Narmi
5
ComboBox
Carbon Design System
4
form-combobox
GitLab
1

Context menu

Context Menu
SpaceONE
14
Context Menu Item
SpaceONE
6

Date picker

Datetime Picker
SpaceONE
11
SbDatepicker
Storyblok
7
DatePicker
Shopify
6

Details

Item Detail
JSTOR
1

Dialog

DialogWizard
AnyVision
5
Dialog
Narmi
4
bpk-component-dialog
Skyscanner
4
SbUploadDialog
Storyblok
1
Dialog
AnyVision
1

Divider

VideoThumbnail
Shopify
4
Divider
Shopify
2
Divider
SpaceONE
2
Divider
Massachusetts Digital Services
1

Drawer

drawer
GitLab
4
Drawer
Grafana
4

Flex

FilterBox
Massachusetts Digital Services
1

Footer

View all (9)
Font
Narmi
5
Font
Narmi
5
Footer
WFP
4
FooterHelp
Shopify
3
Footer
Massachusetts Digital Services
2

Form

View all (9)
form-select
GitLab
5
FormLayout
Shopify
4
Form
Shopify
2
SbFormGroup
Storyblok
2
SbFormItem
Storyblok
2

Grid

View all (6)
Grid
Carbon Design System
10
Progress Wizard
SpaceONE
6
Grid Layout
SpaceONE
5
bpk-component-grid
Skyscanner
4
ProgressWithIndicator
AnyVision
3

Header

View all (13)
Header
Massachusetts Digital Services
6
HeaderSearch
Massachusetts Digital Services
2
HeaderHamburger
Massachusetts Digital Services
2
HeaderSlim
Massachusetts Digital Services
2
Header
JSTOR
1

Heading

View all (6)
Heading
JSTOR
3
ResultsHeading
Massachusetts Digital Services
2
unstable_Heading
Carbon Design System
1
CompHeading
Massachusetts Digital Services
1
Heading
Massachusetts Digital Services
1

Hero

Hero
WFP
11
Hero
kickstartDS
6
hover-load-directive
GitLab
1
TypeAheadDropdown
Massachusetts Digital Services
1

Icon

View all (32)
DayPickerRangeController
AirBnb
37
DayPickerSingleDateController
AirBnb
21
bpk-component-icon
Skyscanner
10
Icon
Shopify
8
bpk-component-floating-notification
Skyscanner
6

Image

View all (8)
bpk-component-image
Skyscanner
12
Lazy Image
SpaceONE
5
ImagePromo
Massachusetts Digital Services
3
TimeRangeInput
Grafana
2
TimeRangePicker
Grafana
2

Input

View all (32)
DRP - Input Props
AirBnb
18
SDP - Input Props
AirBnb
14
bpk-component-input
Skyscanner
14
Input
SpaceONE
11
Text Input
JSTOR
6

Label

View all (12)
chart-series-label
GitLab
7
bpk-component-label
Skyscanner
6
labeled
GitLab
3
label
GitLab
3
FormLabel
Carbon Design System
2

Layout

View all (10)
Layout
Shopify
7
Layout
JSTOR
5
AuthLayout
WFP
3
VizLayout
Grafana
2
Horizontal Layout
SpaceONE
2

Link

View all (16)
bpk-component-link
Skyscanner
7
Link
JSTOR
5
Link
Shopify
4
SbLink
Storyblok
3
Link
Carbon Design System
3

List

View all (36)
ResourceList
Shopify
19
ActionList
Shopify
10
ChoiceList
Shopify
7
OptionList
Shopify
7
MultiSelect
Carbon Design System
6

Listbox

Listbox
Shopify
7

Loading

View all (10)
SbLoading
Storyblok
7
InlineLoading
WFP
3
Loading
WFP
3
InlineLoading
Carbon Design System
2
Loading
Shopify
1

Menu

View all (8)
bpk-component-autosuggest
Skyscanner
8
Menu
AnyVision
7
OverflowMenu
Carbon Design System
3
bpk-component-blockquote
Skyscanner
3
ContextMenu
Carbon Design System
2

Modal

View all (21)
Modal
Shopify
16
bpk-component-modal
Skyscanner
12
SbModal
Storyblok
9
ModalWrapper
WFP
5
Modal
JSTOR
4

Nav

View all (18)
bpk-component-horizontal-nav
Skyscanner
11
StepNavigation
WFP
4
unstable_TreeView
Carbon Design System
3
UtilityNav
Massachusetts Digital Services
3
bpk-component-navigation-stack
Skyscanner
3

Notification

SbNotification
Storyblok
4

Page

View all (13)
Page
Shopify
19
Pages
kickstartDS
8
Page Title
SpaceONE
6
SkeletonPage
Shopify
5
PageActions
Shopify
4

Pagination

View all (15)
bpk-component-pagination
Skyscanner
6
Pagination
Shopify
5
pagination
GitLab
5
SbPagination
Storyblok
4
Pagination
Carbon Design System
3

Pill

bpk-component-infinite-scroll
Skyscanner
10
FilterPill
Grafana
2

Popover

View all (9)
bpk-component-popover
Skyscanner
11
Popover
Shopify
10
bpk-component-overlay
Skyscanner
8
Popover
JSTOR
5
popover
GitLab
3

Progress

View all (7)
Progress Bar
SpaceONE
5
ProgressBar
Shopify
4
unstable_ProgressBar
Carbon Design System
4
bpk-component-progress
Skyscanner
4
Progress
AnyVision
3

Radio

View all (9)
bpk-component-radio
Skyscanner
7
Radio
SpaceONE
6
Radio Group
JSTOR
4
RadioButtons
Narmi
4
SbRadio
Storyblok
3

Rating

bpk-component-star-rating
Skyscanner
11
bpk-component-rating
Skyscanner
6

Search

View all (12)
Search Dropdown
SpaceONE
12
Query Search
SpaceONE
7
Search
Carbon Design System
5
Search
SpaceONE
5
filtered-search
GitLab
4

Select

View all (19)
SbSelect
Storyblok
18
bpk-component-select
Skyscanner
12
Select
Grafana
11
Select
Shopify
9
Select Dropdown
SpaceONE
9

Separator

ContextualSaveBar
Shopify
4
FullscreenBar
Shopify
3

Slider

View all (7)
IndexFilters
Shopify
13
RangeSlider
AnyVision
9
RangeSlider
Shopify
5
SbSlideover
Storyblok
4
Slider
Carbon Design System
4

Spinner

Spinner
Shopify
4
Spinner
AnyVision
3
bpk-component-spinner
Skyscanner
3
InlineError
Shopify
1
Spinner
Grafana
1

Stack

View all (6)
InlineStack
Shopify
18
BlockStack
Shopify
12
stacked-column-chart
GitLab
8
LegacyStack
Shopify
7
StatsPicker
Grafana
1

Switch

Switch
AnyVision
3
ContentSwitcher
WFP
3
bpk-component-switch
Skyscanner
3
ContentSwitcher
Carbon Design System
2
Switch
Grafana
2

Table

View all (23)
IndexTable
Shopify
49
DataTable
Shopify
12
Data Table
SpaceONE
12
SbDataTable
Storyblok
11
Definition Table
SpaceONE
9

Tabs

View all (12)
tabs
GitLab
8
Tabs
Shopify
7
LegacyTabs
Shopify
6
Tabs
Narmi
6
Tabs
JSTOR
5

Tag

View all (16)
Tag
Shopify
8
DateRangePicker (DRP)
AirBnb
8
Tag
Carbon Design System
5
Tag
SpaceONE
4
Tag
Narmi
3

Text

View all (17)
TextField
AnyVision
17
Text
WFP
8
Textarea
SpaceONE
6
bpk-component-text
Skyscanner
6
bpk-component-textarea
Skyscanner
6

Text field

SbNumberField
Storyblok
1

Textarea

View all (7)
TextField
Shopify
29
Text
Shopify
9
Textarea
JSTOR
6
SbTextField
Storyblok
6
SkeletonDisplayText
Shopify
4

Title

LoginTitle
Agora
1

Toast

Toast
Shopify
9
Toast
JSTOR
5
toast
GitLab
3
Toast
SpaceONE
1

Toggle

View all (8)
SettingToggle
Shopify
3
SbToggle
Storyblok
3
Toggle
Narmi
3
Toggle
Carbon Design System
3
toggle
GitLab
2

Tooltip

View all (14)
Tooltip
Shopify
15
Tooltip
JSTOR
7
bpk-component-tooltip
Skyscanner
7
Tooltip
Carbon Design System
6
Tooltip
AnyVision
4

Typography

Typography
JSTOR
12
Typography
Storyblok
1
Typography
Grafana
1
typography
Massachusetts Digital Services
1