Documentation

Overview

While Flex Design System is built to be intuitive and user-friendly, understanding its structure is essential to get the most out of it. We recommend using the resources on this page to help get yourself familiarised, before diving in.

Preview In Figma

Installation

Learn about how to download, set-up and start using Flex Design System.

Requirements

Find out the software requirements needed to effectively use the Flex Design System.

File Structure

Learn how Flex Design System's library is structured to help you quickly familiarise yourself with and utilise its features.

Figma Libraries

Learn how libraries work in Figma and how they've been implemented within Flex Design System.

Figma Variables

Learn what variables are in Figma and how they are structured in Flex Design System.

Design Tokens

Learn what design tokens are and how they are configured in Flex Design System.

Figma Components

Discover what Figma components are, how they function, and how they are organised within Flex Design System.

Grids & Spacing

Learn about Figma grid layouts and how the responsive grid functions in Flex Design System.

Typography

Discover how responsive typography is managed in Flex Design System through a combination of styles and tokens.

Change Log

A list of all the changes that have been made in each version of Flex Design System.