naming-conventions

naming-conventions is a skill for Claude Code, Codex from madebypan/FigCC. It costs 21 tokens per session (412 once invoked), scanned A, original, MIT.

A naming guide for keeping Figma pages, layers, components, variables, and styles consistent and readable.

In plain words
What is it for?
Naming layers, auto-layout frames, components, variants, variables, colors, spacing, typography, effects, and pages.
Why use it?
It replaces vague names with patterns that show what each design element is for and how related elements belong together.

Skill for Claude CodeCodex

Written for no agent in particular: nothing here depends on one.

Install

Getting it into your agent

One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.

agentmods
npx agentmods add skills/madebypan/figcc/naming-conventions
Any agent
npx skills add madebypan/FigCC --skill naming-conventions
Clone the repo
git clone --depth 1 https://github.com/madebypan/FigCC

Made for: Claude Code, Codex.

Wrote this? Show the measurements

A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.

agentmods badge for naming-conventions

README.md
[![agentmods](https://agentmods.dev/badge/skills/madebypan/figcc/naming-conventions.svg)](https://agentmods.dev/skills/madebypan/figcc/naming-conventions)
Your own site
<a href="https://agentmods.dev/skills/madebypan/figcc/naming-conventions"><img src="https://agentmods.dev/badge/skills/madebypan/figcc/naming-conventions.svg" alt="Measured on agentmods" height="20"></a>
Per session 21 Skills are progressive disclosure: only the name and description are preloaded; the body loads when the skill is used.
When invoked 412 The whole file, excluding the scripts and references it only reads on demand.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

What it costs to keep this loaded

Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.

ModelPer sessionOnce invoked
Fable 5.1 $0.00021 $0.00412
Opus 5 $0.00010 $0.00206
Sonnet 5 $0.00004 $0.00082
Haiku 4.5 $0.00002 $0.00041

Measured 6d ago against content hash 03b27274fa6d, method: parsed. Prices are Anthropic first-party input rates as of 2026-09-06, from the pricing page.

Security

Grade A, and why

naming-conventions scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 6d ago.

A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.

Nothing flagged

None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.

skills/naming-conventions/SKILL.md · 43 lines

What it actually says

Skill: Naming Conventions

When creating or renaming layers, components, variables, and styles, always follow these conventions unless the user specifies otherwise.

Layers

  • Use descriptive, lowercase kebab-case: card/header, button/primary/default
  • Group related nodes by prefixing with a category and /: icon/arrow-right
  • Avoid generic names like Frame 1, Rectangle, Group
  • Auto-layout frames: name them after their content role, e.g. layout/sidebar, list/item

Components

  • Component names use Title Case with / for grouping: Button/Primary, Input/Text/Default
  • Variant properties use Title Case: State, Size, Variant
  • Variant values use Title Case: Default, Hover, Disabled, Small, Large

Variables & styles

  • Variables: category/subcategory/name in lowercase kebab-case
    • Colors: color/brand/primary, color/neutral/100
    • Spacing: spacing/xs, spacing/md, spacing/2xl
    • Radius: radius/sm, radius/full
    • Typography sizes: font-size/body, font-size/heading-lg
  • Paint styles: Color/Brand/Primary
  • Text styles: Body/Regular, Heading/Large/Bold
  • Effect styles: Shadow/Card, Shadow/Modal

Pages

  • Page names are Title Case: Design, Prototype, Components, Icons, Archive

Rules

  • Always rename any auto-generated names (Frame 1, Rectangle 2, etc.) before finishing.
  • When creating components, set .name on the component, not just the wrapper frame.
  • Apply the naming convention when duplicating or cloning existing nodes too.
Changes

What this file has done since we first saw it

Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.

  1. 6d ago First seen · 43 lines · 21 tokens per session scan A 03b27274fa6d

Subscribe to this mod's changes

naming-conventions is a skill published in the GitHub repository madebypan/FigCC (22 stars, last pushed 1mo ago), licensed MIT. It adds 21 tokens to every session and 412 once invoked, about $0.0001 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.

Related

Other skills, from other repositories

figma-codegen

Generate framework-aware code from a Figma design. Reads the project's stack profile and emits code matching the existing framework (React/Vue/Svelte/Next/etc.) and styling (Tailwind/CSS/CSS-in-JS), reusing existing components and design tokens instead of regenerating from scratch. Triggers whenever the user wants a…

awdr74100/figwright · 145 tokens

figma-build

Build a Figma design from code or a description — the reverse of figma-codegen. Reuses the connected file's existing design system (components, variables, styles) instead of drawing primitives with hardcoded values. Triggers whenever the user wants something created or updated IN Figma from code or a spec — e.g.…

awdr74100/figwright · 180 tokens

claude-design-skill

Claude Code-based design skill for hi-fi prototyping and Figma MCP-driven precision design work. Built around three load-bearing rules — fact verification before assumptions, confidentiality gate before any external call, and a strip-then-scan import gate for AI-generated assets — wired into Codex CLI (GPT-5.5…

0xmhha/claude-design-skill · 184 tokens

aw-mg-import-parity

MasterGo2Figma 仓库的 mg 导入保真度修复工作流。用户给出新的 .mg 测试文件与对应基准 zip 的路径,外加一个包含 mg 导入、zip 导入、截图(图片)三种页面的 Figma 链接,要求以截图为渲染基准、zip 为结构辅助、修复 mg 导入还原问题时必须使用本 SKILL。只要用户在 MasterGo2Figma 项目里提到"新测试集""导入效果不对""贴近图片/截图""mg 导入问题""还原有问题"并附上 .mg/zip 路径或 figma.com 链接,即使没有点名本 SKILL 也应触发。覆盖 comparemgimport 结构比对、mgPackage.js 二进制逆向、importer…

AaronXu-Lab/MasterGo2Figma · 210 tokens

create-component-md

Generate a canonical JSON contract and a self-contained implementation Markdown specification for a Figma component covering API, structure, color, and screen-reader behavior. Reads a base.json produced by the uSpec Extract plugin, runs four read-only interpretation skills in parallel, reconciles their outputs, and…

redongreen/uSpec · 107 tokens

create-color

Generate color annotation specifications mapping UI elements to design tokens. Use when the user mentions "color", "color annotation", "color spec", "tokens", "design tokens", or wants to document which color tokens a component uses.

redongreen/uSpec · 48 tokens