File Structure

An overview of how the component libraries are configured

Overview

This document explains how Figma libraries are organised for designers working with the Compound component libraries.

The libraries are stored in separate Figma projects, but they share standard foundations, including design tokens, iconography, and pictograms.

Compound UI for Web

Web components are organised into separate Figma files to make them easier to manage across a larger team.

Dividing the files allows designers to branch and explore ideas within a single component file without affecting others.

Web Component Figma Files

Each web component is separated into it's own Figma file

Compound UI for React Native

The React Native component library changes less often, so it is managed within a single Figma file.
Each component has its own dedicated page, making it easy to view, maintain, and update as needed.