Documentation

Please bear with us whilst we work hard to align the documentation to with the latest updates to Flex Design System.

Flex Design System is intuitive and user-friendly, but understanding its structure will help you get the most out of it. We recommend exploring the resources on this page to familiarise yourself before diving in.

Watch On Youtube Figma Preview

Requirements
Find out what software you need to use Flex Design System.
Read more
Installation
Learn about how to download, set-up and start using Flex Design System.
Read more
File Structure
Explore how Flex Design System is structured to help you quickly understand and use its features.
Read more
Libraries
Discover how Figma libraries work and how they're used in Flex Design System.
Read more
Variables
Learn how Figma variables work and how they're structured in Flex Design System.
Read more
Design Tokens
Learn how design tokens work and how they're configured in the Flex Design System.
Read more
Components
Discover how Figma components work and how they're organised in Flex Design System.
Read more
Grids & Spacing
Learn how Figma grid layouts work and how Flex Design System uses a responsive grid.
Read more
Typography
Discover how Flex Design System manages responsive typography using styles and tokens.
Read more
Change Log
A detailed list of changes introduced in each version of Flex Design System.
Read more