Repository navigation
Figloo 0.6.0
map_tokens maps a design onto the project's own tokens and components. Only the MCP server changed: the extension's code is the same as in 0.5.0, and the bridge protocol is still 0.3.0.
Upgrading
- Replace the extension with the new zip and press the reload button on its card in
chrome://extensionsorarc://extensions. - Update the Claude Code plugin, or the
.mjsfile you registered, then start new agent sessions so they run the new server. - The extension and the MCP server speak bridge protocol 0.3.0. A pair that speaks different versions does not connect, and
get_statusreportsPROTOCOL_MISMATCH.
Files
| File | SHA-256 |
|---|---|
figloo-extension-0.6.0.zip |
455e999ec3149825c13b312dfcce54c95f63b9da8ccd2447e367319d1967f972 |
figloo-mcp-0.6.0.mjs |
5906c7d3cc46ab9613c5e83ae8d3482f1f6d187ce01055081cc2784c5fc03b78 |
figloo-mcp-0.6.0.mcpb |
a542db96285bcd0618ab606bebdced336a64599524e0e41417d9b8e6350e19d7 |
Install
- Unzip
figloo-extension-0.6.0.zipinto a folder you keep. Onchrome://extensionsorarc://extensions, turn on Developer mode, click "Load unpacked", and select that folder. - Register the MCP server. In Claude Code, install the plugin, which downloads
figloo-mcp-0.6.0.mcpbfrom this release:Without the plugin, keep/plugin marketplace add g761007/figloo /plugin install figloo@figloofigloo-mcp-0.6.0.mjsanywhere (it needs only Node.js 24), register it, then start a new session:claude mcp add -s user figloo -- node /absolute/path/to/figloo-mcp-0.6.0.mjs
- Pair once: run
node figloo-mcp-0.6.0.mjs pairand paste the token and port into the extension's options page. The plugin's server reads the same~/.figloo/config.json, so this works for the plugin too. - In Figma, sign in (view access is enough), use the English UI, keep the UI expanded, and turn on "Adapt content for screen readers" under Main menu, Preferences, Accessibility settings. Keep the Figma tab on screen while the agent works.
Or let your agent do it: the README's Quickstart has one sentence to paste into Claude Code or Codex, which installs Figloo by following docs/agent-install.md and walks you through the steps only you can do.
The README has the details, and docs/troubleshooting.md the common problems.
Changes
Added
map_tokensputs a saved snapshot's colors, text styles, spacing, and corner radii next to the tokens the project already defines, without the Figma tab: exact matches, near ones with what differs (such as a color difference, an alpha, a pixel, or a weight), and values with none, and it lists project components whose names share an instance's words. It reads CSS custom properties, SCSS and Less variables, design token JSON, theme objects in JavaScript and TypeScript such as a Tailwind config, iOS asset catalogs and Swift, Android resources and Compose, and Flutter, from the project directory or a folder in it, skipping dependencies, build output, hidden folders, tests, and.envfiles.- The figloo-implement skill maps a design onto the project with
map_tokens: it uses exact matches, shows near and unmatched values to the user before choosing, and reports the mapping as a table. - Workflow evals for the skill, in an unpublished harness under
tests/skill-eval/that answers Figloo's tools from mocks, sinceclaude plugin evalcannot stand in for a server declared through an MCP bundle.