Name Layers for Dev Handoff

About this plugin

Name Layers for Dev Handoff Free Figma Plugin by Nafisa Tarannum Disha cleans up messy layer names in one click. It renames frames and groups based on what they actually are, tags text, images, icons, and GIFs with consistent labels, and lets you pick the naming format your codebase already uses — so files are ready to hand off the moment design is done.Supported naming formats•kebab-case — e.g. pricing-card•camelCase — e.g. pricingCard•snake_case — e.g. pricing_card•PascalCase — e.g. PricingCardWhy it’s dev-handoff friendly•Replaces vague default names (“Rectangle 14”, “Frame 2”) with names a developer can actually read.•Uses the same casing conventions codebases already use, so layer names map cleanly onto component and class names.•Tags every text, image, icon, and GIF by type, so developers know exactly what each layer is meant to be without opening it.•Works recursively inside frames and groups, so nested content is structured too — not just the top-level layers.•Cuts down the back-and-forth of developers asking “what is this layer for?” during implementation.How to use1.Select any layers or frames2.Pick a naming format3.Click “Name Layers for Devs”What gets renamed•Text layers → text--element•Images (PNG/JPG) → img-element•Icons / vectors → svg--element•GIFs → gif--element•Frames and groups → cleaned-up, structured namesName Layers for Dev Handoff Free Figma Plugin, Developed by Nafisa Tarannum Disha