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.

1047components4181storiesLast updated 10 months ago
Tweet
Add your component

Accordion

View all (7)
bpk-component-accordion
Skyscanner9
Accordion
Carbon Design System4
accordion
GitLab2
accordion-item
GitLab2
SbAccordion
Storyblok1

Alert

View all (9)
bpk-component-banner-alert
Skyscanner17
alert
GitLab8
Alert
JSTOR5
CalloutAlert
Massachusetts Digital Services2
EmergencyAlerts
Massachusetts Digital Services2

Autocomplete

Autocomplete
Shopify9
Auto Complete Search
SpaceONE6

Avatar

View all (10)
SbAvatar
Storyblok11
Avatar
Shopify7
bpk-component-navigation-bar
Skyscanner7
avatar
GitLab5
SbAvatarGroup
Storyblok3

Badge

View all (8)
Badge
Shopify13
bpk-component-badge
Skyscanner12
SbBadge
Storyblok7
badge
GitLab5
Badges
SpaceONE4

Banner

View all (7)
Banner
Shopify15
Banner
AnyVision5
banner
GitLab5
BrandBanner
Massachusetts Digital Services2
BannerNavigation
WFP2

Breadcrumb

View all (8)
SbBreadcrumbs
Storyblok5
Breadcrumbs
SpaceONE5
Breadcrumb
Carbon Design System4
bpk-component-breadcrumb
Skyscanner3
breadcrumb
GitLab2

Button

View all (48)
Button
Shopify24
button
GitLab21
bpk-component-button
Skyscanner21
bpk-component-loading-button
Skyscanner14
SbButton
Storyblok11

Calendar

DRP - Calendar Props
AirBnb33
SDP - Calendar Props
AirBnb28
bpk-component-calendar
Skyscanner20
bpk-component-scrollable-calendar
Skyscanner19

Card

View all (18)
Card
Shopify22
LegacyCard
Shopify18
Image Card
JSTOR15
MediaCard
Shopify9
Select Card
SpaceONE9

Carousel

carousel
GitLab1

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 (15)
bpk-component-checkbox
Skyscanner9
Checkbox
WFP7
Checkbox
Shopify6
Checkbox
SpaceONE6
Checkbox
JSTOR5

Chip

View all (8)
ChipsInput
AnyVision9
bpk-component-graphic-promotion
Skyscanner8
bpk-component-phone-input
Skyscanner8
bpk-component-chip
Skyscanner7
chart-tooltip
GitLab4

Code

View all (23)
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
Shopify4
Collapsible Panel
SpaceONE3
Collapse
Grafana2
Collapsible Toggle
SpaceONE2

Color picker

Color
Narmi5
ColorPicker
Shopify4
Colors
Storyblok1

Combobox

Combobox
Shopify7
Combobox
JSTOR6
Combobox
Narmi5
ComboBox
Carbon Design System4
form-combobox
GitLab1

Context menu

Context Menu
SpaceONE14
Context Menu Item
SpaceONE6

Date picker

Datetime Picker
SpaceONE11
SbDatepicker
Storyblok7
DatePicker
Shopify6

Details

Item Detail
JSTOR1

Dialog

DialogWizard
AnyVision5
Dialog
Narmi4
bpk-component-dialog
Skyscanner4
SbUploadDialog
Storyblok1
Dialog
AnyVision1

Divider

VideoThumbnail
Shopify4
Divider
Shopify2
Divider
SpaceONE2
Divider
Massachusetts Digital Services1

Drawer

drawer
GitLab4
Drawer
Grafana4

Flex

FilterBox
Massachusetts Digital Services1

Footer

View all (9)
Font
Narmi5
Font
Narmi5
Footer
WFP4
FooterHelp
Shopify3
Footer
Massachusetts Digital Services2

Form

View all (10)
form-select
GitLab5
FormLayout
Shopify4
Form
Shopify2
SbFormGroup
Storyblok2
SbFormItem
Storyblok2

Grid

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

Header

View all (13)
Header
Massachusetts Digital Services6
HeaderSearch
Massachusetts Digital Services2
HeaderHamburger
Massachusetts Digital Services2
HeaderSlim
Massachusetts Digital Services2
Header
JSTOR1

Heading

View all (6)
Heading
JSTOR3
ResultsHeading
Massachusetts Digital Services2
unstable_Heading
Carbon Design System1
CompHeading
Massachusetts Digital Services1
Heading
Massachusetts Digital Services1

Hero

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

Icon

View all (32)
DayPickerRangeController
AirBnb37
DayPickerSingleDateController
AirBnb21
bpk-component-icon
Skyscanner10
Icon
Shopify8
bpk-component-floating-notification
Skyscanner6

Image

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

Input

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

Label

View all (12)
chart-series-label
GitLab7
bpk-component-label
Skyscanner6
labeled
GitLab3
label
GitLab3
FormLabel
Carbon Design System2

Layout

View all (10)
Layout
Shopify7
Layout
JSTOR5
AuthLayout
WFP3
VizLayout
Grafana2
Horizontal Layout
SpaceONE2

Link

View all (16)
bpk-component-link
Skyscanner7
Link
JSTOR5
Link
Shopify4
SbLink
Storyblok3
Link
Carbon Design System3

List

View all (36)
ResourceList
Shopify19
ActionList
Shopify10
ChoiceList
Shopify7
OptionList
Shopify7
MultiSelect
Carbon Design System6

Listbox

Listbox
Shopify7

Loading

View all (10)
SbLoading
Storyblok7
InlineLoading
WFP3
Loading
WFP3
InlineLoading
Carbon Design System2
Loading
Shopify1

Menu

View all (8)
bpk-component-autosuggest
Skyscanner8
Menu
AnyVision7
OverflowMenu
Carbon Design System3
bpk-component-blockquote
Skyscanner3
ContextMenu
Carbon Design System2

Modal

View all (21)
Modal
Shopify16
bpk-component-modal
Skyscanner12
SbModal
Storyblok9
ModalWrapper
WFP5
Modal
JSTOR4

Nav

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

Notification

SbNotification
Storyblok4

Page

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

Pagination

View all (15)
bpk-component-pagination
Skyscanner6
Pagination
Shopify5
pagination
GitLab5
SbPagination
Storyblok4
Pagination
Carbon Design System3

Pill

bpk-component-infinite-scroll
Skyscanner10
FilterPill
Grafana2

Popover

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

Progress

View all (7)
Progress Bar
SpaceONE5
ProgressBar
Shopify4
unstable_ProgressBar
Carbon Design System4
bpk-component-progress
Skyscanner4
Progress
AnyVision3

Radio

View all (9)
bpk-component-radio
Skyscanner7
Radio
SpaceONE6
Radio Group
JSTOR4
RadioButtons
Narmi4
SbRadio
Storyblok3

Rating

bpk-component-star-rating
Skyscanner11
bpk-component-rating
Skyscanner6

Search

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

Select

View all (19)
SbSelect
Storyblok18
bpk-component-select
Skyscanner12
Select
Grafana11
Select
Shopify9
Select Dropdown
SpaceONE9

Separator

ContextualSaveBar
Shopify4
FullscreenBar
Shopify3

Slider

View all (7)
IndexFilters
Shopify13
RangeSlider
AnyVision9
RangeSlider
Shopify5
SbSlideover
Storyblok4
Slider
Carbon Design System4

Spinner

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

Stack

View all (6)
InlineStack
Shopify18
BlockStack
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 (23)
IndexTable
Shopify49
DataTable
Shopify12
Data Table
SpaceONE12
SbDataTable
Storyblok11
Definition Table
SpaceONE9

Tabs

View all (12)
tabs
GitLab8
Tabs
Shopify7
LegacyTabs
Shopify6
Tabs
Narmi6
Tabs
JSTOR5

Tag

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

Text

View all (17)
TextField
AnyVision17
Text
WFP8
Textarea
SpaceONE6
bpk-component-text
Skyscanner6
bpk-component-textarea
Skyscanner6

Text field

SbNumberField
Storyblok1

Textarea

View all (7)
TextField
Shopify29
Text
Shopify9
Textarea
JSTOR6
SbTextField
Storyblok6
SkeletonDisplayText
Shopify4

Title

LoginTitle
Agora1

Toast

Toast
Shopify9
Toast
JSTOR5
toast
GitLab3
Toast
SpaceONE1

Toggle

View all (8)
SettingToggle
Shopify3
SbToggle
Storyblok3
Toggle
Narmi3
Toggle
Carbon Design System3
toggle
GitLab2

Tooltip

View all (14)
Tooltip
Shopify15
Tooltip
JSTOR7
bpk-component-tooltip
Skyscanner7
Tooltip
Carbon Design System6
Tooltip
AnyVision4

Typography

Typography
JSTOR12
Typography
Storyblok1
Typography
Grafana1
typography
Massachusetts Digital Services1