Neat reads what is inside each frame, component and layer, and names it for what it is. Sign In, Button / Continue, Tab Bar. You review every name first, and one undo reverses the whole pass.
01 — Live demo
This is the plugin's real code running on a mock Figma page with six screens and about 60 layers. Every layer starts with a default name. Check the proposed names, untick or edit any you don't like, then press Tidy and watch the layers panel.
02 — Principles
Neat makes a precise judgement, shows its reasoning, and gets out of the way.
Headings by size and weight, placeholders by colour, buttons by shape. It also reads images, icons, page dots, toggles and the components you used.
Sign In, Onboarding, Checkout, Settings, Profile, Editor, Landing and more. A screen with no pattern is named after its own heading.
Nav bars, tab bars, inputs, list items, cards, avatars and icons follow the parent-to-child structure a developer expects.
“Messy only” touches defaults like Frame 12, Group 3 or Copy of… and nothing you named by hand.
Each suggestion comes with a three-step confidence mark and a readable reason. Low-confidence names start unticked.
Every pass is a single undo step. Variant names are never touched, because they hold component properties.
03 — Vocabulary
Names follow Type / Title, the convention most design systems use. Switch to title-only or type-only, change the separator or case, or number your screens.
Instances borrow the name of their main component, then add what makes each one different.
Install
Neat runs as a development plugin in Figma desktop. It makes no network calls, so your file never leaves Figma.
Download and unzip neat-plugin.zip. You'll get manifest.json, code.js and ui.html.
In Figma desktop, open Plugins → Development → Import plugin from manifest… and pick manifest.json.
Select screens or a section, run Plugins → Development → Neat, review, and press Tidy.
04 — How it's built
A Figma plugin runs as two sandboxed halves that can only talk through messages. Neat uses that split on purpose: the canvas side only reads and writes, and the UI side does all the thinking, so previews are instant and nothing changes until you press Tidy.
Walks each layer once and records its texts with size, weight and colour, its buttons, inputs, images, icons, components, bars and repeated siblings.
Only a small summary crosses to the UI. It holds no pixels and no file data, just what is needed to name the layer.
Rules score 20+ screen patterns and 25 element types, pick a title, and attach a confidence score and a readable reason.
Your approved names are applied in one batch with commitUndo(), so a single ⌘Z undoes everything.
['Sign In', (text, d) => (/sign ?in|log ?in|welcome back/.test(text) ? 3 : 0) + (/password|forgot/.test(text) ? 2 : 0) + (d.inputs.length >= 1 ? 1 : 0)], // the best score wins; the heading becomes the title // "iPhone 14 - 7" → "Sign In" (95% sure)
const button = boxed && h >= 28 && h <= 64 && w <= 420 && labels.length === 1 && words(label) <= 4 && radius >= 4 && (saturated(fill) || dark(fill) || /button|cta/.test(name)); // "Frame 11" → "Button / Continue"