Layer Tree for AI

About this plugin

### English

Layer Tree for AI exports your Figma layer structure in formats optimized for AI assistants.

**Features:**

- Tree view: Visual hierarchy with └── ├── │ characters

- JSON export: Complete design details including colors, fonts, spacing, and auto layout

**What JSON includes:**

- Size and position

- Colors (fills, strokes) in HEX format

- Corner radius

- Auto Layout settings (direction, gap, padding, alignment)

- Text properties (font, size, line height, letter spacing)

- Effects (shadows, blur)

- Component information

**Use cases:**

- Ask AI to convert your design to React/HTML/CSS code

- Get AI feedback on your design structure

- Document your design system

Simply select layers, click export, and paste into your favorite AI tool.

---

### Japanese (日本語)

Layer Tree for AIは、FigmaのレイヤーをAIツール向けに最適化された形式で出力します。

**機能:**

- ツリー表示: └── ├── │ を使った階層表示

- JSON出力: 色、フォント、余白、Auto Layoutなど完全なデザイン詳細

**JSONに含まれる情報:**

- サイズと位置

- 色（塗り、線）HEX形式

- 角丸

- Auto Layout設定（方向、gap、padding、配置）

- テキスト（フォント、サイズ、行間、文字間隔）

- エフェクト（シャドウ、ブラー）

- コンポーネント情報

**活用例:**

- デザインをReact/HTML/CSSコードに変換

- デザイン構造についてAIにフィードバックをもらう

- デザインシステムのドキュメント化

レイヤーを選択して出力ボタンを押すだけ。