---
# System prepended metadata

title: Figma With Token Studio

---

# Figma With Token Studio

## Base Component

```mermaid
graph TD;
Design_Token
Design_Token --> Figma_Design
Design_Token --> JSON_HUB
JSON_HUB --> UI_Library_FE
```

## Project F1 (Extend From Base Component)

Design Token & UI Library extends from base component.

```mermaid
graph TD;
Design_Token_F1
Design_Token_F1 --> Figma_Design
Design_Token_F1 --> JSON_HUB_F1
JSON_HUB_F1 --> Project_FE
```

## Project F2 (Extend From Base Component)

Design Token & UI Library extends from base component.

```mermaid
graph TD;
Design_Token_F2
Design_Token_F2 --> Figma_Design
Design_Token_F2 --> JSON_HUB_F2
JSON_HUB_F2 --> Project_FE
```

### If designer update token at base component it will update to all project

### If designer update token at project f1 it will update to f1 project only
