Using our libraries

Find out how to use our Figma folders.

Core libraries

Backpack Foundations

These are styles native to Figma. Typography, Colours, Effects (layer styles). As Figma improves these options, we will too.

BKP Foundations Cover

Backpack Components

This file is home to anything built in Figma, and anything which exists in code in old Backpack Site. These are alphabetically ordered.

BKP Components Cover

Backpack Beta

These are components ready for designers to use which don't have a code counterpart. Beta components will eventually move to the main Backpack components library.

BKP Beta

Graveyard

When a component is deprecated, it goes to the Graveyard. We add a 👻 symbol to the component name and suggest an alternative component in its description. This is reviewed bi-annually until components are permanently deleted.

BKP Cover Graveyard

Icons

We have lots of icons, so these live in their own library. 16px and 24px versions are available.

BKP Cover Icons

System UI

These are a collection of Android and IOS keyboards, nav bars and status bars; basically anything that is native to these platforms.

Annotation

In the annotation file there are a handy collection of accessibility markup tools, dimensions indicators, labels, notes, pointers, and anything else you might need to put information on your work in a nicely organised way.

🌛 Night Mode Colours

This is a dedicated library for designing with Night Mode Colours.

BKP Night Mode Colours

⚡️ Agreed Patterns

A collection of 🎒 Bpk Components and/or 🎒 Bpk Tokens arranged together into a design.

If a pattern is made agnostic of all verticals, it could easily become a 🎒 Bpk Component. See our Card List or Snippet as good examples.

Agreed Patterns

👴🏻 Legacy Patterns

Anything that pre-dates Agreed Patterns lives here. You can find all the old Inventory Cards or Search Controls in this library.

Legacy Patterns

Team libraries

SAM Components

For those that don’t know, SAM stands for Skyscanner Ads Manager. This dedicated library is for designing with SAM Components. These aren’t in Backpack.


Other folders

Workshop

This is a constantly evolving workspace. It gives our team greater visibility of the initiatives which are currently being worked on. If work exists elsewhere, it makes sense to move it here.

We expect workshop files to be large, and they may contain many sub-pages.

This also acts as a ‘work-in-progress’ space for preparing components before they go into Bpk Beta. We leave all pages and discussions in these files for future reference.

Archive

Anything we publish into Bpk Beta or Bpk Components files will still have a workshop file. This is then moved into the archive.