Backpack Design System

Backpack is a collection of design resources, reusable components and guidelines for creating Skyscanner's products.

Quick links

• Documentation
• Changelog

Usage

Installing packages

npm install [package-name] --save-dev

Contributing

To contribute please see contributing.md.

List of packages

Component	Version
bpk-component-accordion
bpk-component-autosuggest
bpk-component-badge
bpk-component-banner-alert
bpk-component-barchart
bpk-component-blockquote
bpk-component-breadcrumb
bpk-component-breakpoint
bpk-component-button
bpk-component-calendar
bpk-component-card
bpk-component-checkbox
bpk-component-chip
bpk-component-close-button
bpk-component-code
bpk-component-content-container
bpk-component-datatable
bpk-component-datepicker
bpk-component-description-list
bpk-component-dialog
bpk-component-drawer
bpk-component-fieldset
bpk-component-form-validation
bpk-component-grid
bpk-component-grid-toggle
bpk-component-horizontal-nav
bpk-component-icon
bpk-component-image
bpk-component-infinite-scroll
bpk-component-input
bpk-component-label
bpk-component-link
bpk-component-list
bpk-component-loading-button
bpk-component-mobile-scroll-container
bpk-component-modal
bpk-component-navigation-bar
bpk-component-navigation-stack
bpk-component-nudger
bpk-component-pagination
bpk-component-panel
bpk-component-phone-input
bpk-component-popover
bpk-component-progress
bpk-component-radio
bpk-component-rtl-toggle
bpk-component-section-list
bpk-component-select
bpk-component-slider
bpk-component-spinner
bpk-component-star-rating
bpk-component-table
bpk-component-text
bpk-component-textarea
bpk-theming
bpk-component-ticket
bpk-component-tooltip
bpk-react-utils

List of external packages

These components are part of Backpack and are utilised by the components but live in the Foundations repository.

Component	Version
bpk-mixins
bpk-stylesheets
@skyscanner/bpk-svgs
@skyscanner/bpk-foundations-web

Contact

• [email protected]