Backpack

Skyscanner's open-source system, Backpack, built across web and native for travel-search interfaces used worldwide.

Why we like it

Backpack is a clean lesson in what good token architecture buys you. Skyscanner keeps one JSON source of truth and compiles it out to web, iOS, Android and React Native, and when the whole brand changed in 2019 (logo, typeface, color, illustration), they shipped it as a theme swap that left every component API untouched. They even validated it with a deliberately garish test theme before the real one rolled out to tens of millions of travelers. The public repo was archived in 2026 with work continuing internally, so we'd point to it as a study rather than a live dependency.

Screenshots

Fig. 1Backpack's Contributing overview, with separate tabs routing engineers and product designers to their own contribution paths.
Fig. 2Backpack's product type scale, rendered as live specimens — Hero 1 at 120/100% down to Hero 5 at 48/100%, each shown at its actual size.
Fig. 3Card button usage guidance, demonstrated on a real SwissAir flight result card: share and save icons sit top-right, furthest from the content.

Related