HelpKoder
Blog

Claude Code

CLAUDE.md from a UI mock

Claude Code reads CLAUDE.md in the working directory. It does not read Cursor rules. Set the HelpKoder target to Claude Code before you generate, copy the short first instruction, and attach the screenshot. The frame is visual canon. The file is structural canon.

Open the studio

GitHub · $10/month

  1. 01 / Target

    Switch the target before you stream

    Drop a PNG or paste a Figma frame URL. Pick Claude Code. The export becomes CLAUDE.md, not AGENTS.md. GitHub login and $10/month still apply. Read the verdict before you copy anything.

  2. 02 / File

    Put CLAUDE.md where Claude Code runs

    The working directory, not a nested docs folder. Keep the kickoff short — first messages and deep links have a tight character budget. The studio document can be long. The paste cannot.

  3. 03 / Image

    Attach the same PNG

    Claude Code will follow hex values and still invent layout if the frame is missing. Extra Figma frames for empty and error land as more images on the dropzone. Do not paste a KINDA spec plus a second essay from ChatGPT.

Figma MCP plugin vs a saved spec

Anthropic’s Figma plugin and the Figma MCP talk to the file live. That is the right tool when you are already in a Claude Code session and the file is yours. HelpKoder is the other door: capture the frame, write CLAUDE.md, share the spec with someone who was never invited to Figma.

Community templates still need an open or duplicate before a personal access token can export. Capture is not a Figma plugin. Token scope is file_content:read. Do not paste the token into the Claude Code prompt.

Do not rename AGENTS.md and hope

A Cursor export talks to Cursor. A Claude Code export talks to Claude Code. If you already generated for Cursor, switch the target and stream again. The AGENTS.md vs CLAUDE.md note is the file map. The how-to is copy a Claude Code kickoff from a UI screenshot.