Last updated 16 April 2026
Projects / Design Token Pipeline

Design Token Pipeline

Initiative / Design System

Unify design tokens and align React and Figma components to ensure consistency and scalable theming.

Open in Linear

This project introduces a single source of design tokens, synchronised across code and Figma, and reconciles component libraries to eliminate drift, enable scalable theming, and maintain visual consistency across products.

Status

Completed

Lead

Ian Lovell

Teams

Platform

Issues

Grouped by current Linear workflow status.

27 total

Done

27

  • PLT-12 - Add NX to design-system repo
  • PLT-13 - Add Tailwind v4 config
  • PLT-14 - Add avatar/icon size primitive design tokens
  • PLT-15 - Add spacing semantic groups
  • PLT-16 - Add Figma semantic colour variable collection
  • PLT-17 - Add border width and border radius primitive tokens
  • PLT-18 - Add opacity primitive design tokens
  • PLT-19 - Add shadow primitive design tokens
  • PLT-20 - Add z-index primitive design tokens
  • PLT-21 - Add CSS variable output to Style Dictionary
  • PLT-22 - Add dynamic spacing
  • PLT-23 - Add dynamic font css variables
  • PLT-24 - Add heading and paragraph components
  • PLT-25 - Add font primitive design tokens
  • PLT-26 - Add screen size primitive design tokens
  • PLT-27 - Add typography design tokens
  • PLT-28 - Add Figma output to Style Dictionary
  • PLT-29 - Add default theme package
  • PLT-30 - Add space primitive design tokens
  • PLT-31 - Add Style Dictionary build pipeline for metadata
  • PLT-32 - Add Playwright Component testing infrastructure
  • PLT-39 - Create example Playwright Component test for react package
  • PLT-44 - Add PR title linting to CI
  • PLT-45 - Add dependabot to repository
  • PLT-46 - Add CI build workflow
  • PLT-83 - Add brown colour scale
  • PLT-99 - Add layout tokens and container component