Back to mihaichirila.com Back

LayerAgent

Annotate Figma layers. Export AI-ready prompts.

A quick tour — 4 steps, 2 minutes

1Select any layer
and add a note

Frames, components, instances, text, rectangles — anything on your canvas.

  • 1 Pick any layer Click anywhere in your Figma file — the plugin updates instantly to show the current selection.
  • 2 Write your annotation One line or a paragraph. Describe what needs to change, what state it's in, or what's still unresolved.
  • 3 Hit ⌘↵ to save Or click the violet Add note button. Notes are saved per-file, persist across sessions, and sync to the current layer's ID.
Current
All Notes
Export
Session 2 · 5 notes
FRAME
search-view-modal
search-view-modal
Make the background slightly translucent
5m ago
Make the search results section taller
1 note on this layer · ⌘↵ to save
+ Add note

2Review notes,
grouped by layer

Annotations on the same layer are visually connected on a timeline — coloured per layer, so long reviews stay readable.

  • 1 Timeline connectors Multiple notes on one component share a coloured vertical line — spot related changes at a glance.
  • 2 10-colour palette Every layer gets a stable, unique colour derived from its node ID. Same layer = same colour, always.
  • 3 Click to jump Tap any layer name to select that layer on your Figma canvas and zoom to it.
Current
All Notes
Export
Session 2 · 6 notes
Container
Double the size
8m ago
Container
Add white background
8m ago
Create dark theme
Make it smaller
8m ago
Create dark theme
Add hover state
8m ago
Create dark theme
Apply DS tokens
8m ago
Chart Card
Use the new colour palette
12m ago
Session 2 (current) · 6 notes ▾
+ New session

3Export for Claude
or Figma Make

One toggle switches between AI targets. LayerAgent builds a structured, MCP-ready prompt with your full layer context — node IDs, paths, and clear instructions.

  • 1 Claude Code mode Generates an MCP-ready prompt with structured JSON. Claude can call get_node_info or write tools against the real node IDs.
  • 2 Figma Make mode Generates a round-trip brief: Make outputs an updated design you paste back into Figma to annotate iteration 2.
  • 3 Also Markdown, JSON, PDF Or download a complete skill.md MCP skill file for reuse across sessions.
Current
All Notes
Export
Session 2 · 5 notes
TARGET
✦ Claude Code
Figma Make
Copy prompt for Claude
6 notes · 3 layers · current session
›
Download skill.md
Full MCP skill file for Claude Code
›
FILE EXPORT
Markdown
Structured .md file · current session
›
JSON
Annotation data · current session
›

4Iterate.
Track your progress.

Paste to your AI, review the result, then close the loop. LayerAgent archives each iteration and shows you trends across sessions.

  • 1 Paste + execute Your prompt is on the clipboard. Paste into Claude Code or Figma Make and let the AI apply your changes.
  • 2 End iteration When you're done with a round, click New session. Your notes archive, and a fresh session starts for iteration 2.
  • 3 See your momentum The Analytics tab shows notes-per-session and your most annotated layers — know when your design is stabilising.
Current
All Notes
Export
Session 3 · 6 notes
17
TOTAL NOTES
3
SESSIONS
8
LAYERS
Notes per session
Progression across iterations
3 sessions · 17 notes
5
S01
6
S02
6
S03

Ready to ship better designs.

A few things worth knowing before you start.

Your data stays local

Notes are stored in Figma's plugin storage, scoped per file. Nothing leaves your machine automatically — exports only happen when you click.

Works with real tools

Tested with Claude Code + Figma MCP and Figma Make. Handles both read-only (Dev Mode) and write-capable MCP sessions.

Premium, out of the box

Light + dark themes, WCAG AA contrast, resizable window, per-file storage, timeline connectors — all there on day one.

Run it:  PluginsLayerAgent  → that's it.