The same system, in Figma

The library mirrors the code rather than the other way round. Colour, spacing, radius and motion are variables named for their CSS custom properties, with dark and light as modes. The components carry the states the product turns on (revealed and sealed, live and locked), and the reader is composed from instances in both themes. Use the page menu to move between the cover, foundations, components and the reader.