> For the complete documentation index, see [llms.txt](https://dsplaybook.farcostudio.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://dsplaybook.farcostudio.com/part-2-the-process/documentation-1.md).

# Considerations before starting

## Figma Considerations

There are some limitations to creating design tokens in Figma that should be considered at the start. 

#### 1. Only some design characteristics can be managed through Figma libraries

Partially supported characteristics in Figma managed through styles stored in libraries:

* Color
* Typography
* Shadows
* Grid

Characcteristics that cannot be be stored through Figma libraries. All we can do is document them in Figma for development:

* Spacing
* Radius
* Opacity
* Border Width
* Size
* Interactions

To learn more how to document these characteriscits, skip to the documentation section of this playbook.

#### 2. Color styles in Figma cannot relate to other color styles

<figure><img src="/files/avABIIoa3MoAIMqp7z2c" alt=""><figcaption></figcaption></figure>

#### 3. Text styles in Figma cannot be defined in an atomic way.

<figure><img src="/files/JyLmAFJq01kMuexYTYJo" alt=""><figcaption></figcaption></figure>

## Development Considerations

#### 1. White-label design systems are compatible with any development ecosystem:

 React, Vue, Angular, Vanilla, mobile applications, etc.

<figure><img src="/files/9430P3h6UpAJ0G6u7UZP" alt=""><figcaption></figcaption></figure>

#### 2. Token logic is flexible and can be used with different stacks, practices, and file formats like CSS, SCSS, JS, JSON.&#x20;

Tokens can also be integrated into design system development tools like StoryBook.

<figure><img src="/files/iGKATAmC9GSHJdixiYEX" alt=""><figcaption></figcaption></figure>