GAP KANSI
Figma内のGapを自動監視・可視化し、JSONで出力。Web実装を加速させる人間・AIフレンドリーな開発支援ツール
Plugin Preview
About this plugin
GAP KANSI は、選択したフレームの「見た目どおりのレイアウト」を解析して、スタック(縦/横)・グリッド・フロー・自由配置を自動判定し、要素間の余白(ギャップ)や位置関係をミニマップで可視化するプラグインです。
解析結果は、階層を指定した「再帰的なレイアウト構造」としてJSONまたはAI向けプロンプト形式でエクスポートできるため、Figma内部構造に引きずられず、実装しやすいクリーンなHTML/CSSやコードを作るのに役立ちます。
GAP KANSI is a Figma plugin that analyzes the visual layout of the selected frame, automatically detecting vertical/horizontal stacks, grids, flows, and free layouts while visualizing gaps and positions between elements on a minimap.
You can export the analysis as a recursive layout structure in JSON or as an AI-ready prompt, helping you generate clean, implementation-friendly HTML/CSS and code without being constrained by Figma’s internal Auto Layout structure.
Plugin Details
| Version | 1 |
|---|---|
| Created | November 25, 2025 |
| Last Updated | December 15, 2025 |
| Category | Software development |
| Creator | tai5863 |
| Stats | 0 installs, 0 likes |
| Pricing | Free |
Technical Details
- API:1.0.0
- UI:dist/ui/ui.html
- main:dist/main/code.js
- Document Access:dynamic-page
- Editor Types:figma
- Allowed Domains:
- none
More Like This
Discover other plugins in the Software development category.
Figma to Code (HTML, Tailwind, Flutter, SwiftUI)
Code Conversion Made Easy: Figma to Web & Apps
Builder.io - Figma to Code & AI Apps (React, Vue, Tailwind, etc)
Export designs to clean, responsive code or turn Figma screens into AI apps and prototypes.
SkewDat
Skew any layer or group with all layers preserved to edit.