이 저장소 패키지는 휴대용 기술로 Figma 디자인 시스템 워크플로를 재사용할 수 있습니다.

canonical 근원은 skills/에서 생활합니다. Repo는 프로젝트-local Claude Code 항목을 통해 동일한 기술을 노출합니다 .claude/skills/, 그래서 같은 체크 아웃은 Codex와 Claude Code에서 사용할 수 있습니다.

포함 된 기술

• [T2]] 기존 설계를 검토하고 시스템 구성 요소를 설계하기 위해 연결하십시오.
• [T3] Figma 화면 또는 구성 요소 설계 시스템 통합 편류, 누락된 공유 구성 요소, 로컬 오버라이드 및 언바운드 토큰을 포함하여.
• [T4]] Figma Screen 또는 Components의 특정 설계 시스템 통합을 수정하여 누락된 공유 구성 요소, 로컬 오버라이드 및 언바운드 토큰을 포함하여.

저장소 레이아웃

각 기술 폴더 포함:

• SKILL.md: open Agent Skills 형식을 사용하여 도구를 통해 작업하는 공유 지침
• agents/openai.yaml: Codex/OpenAI UI 메타데이터; 무시할 다른 도구에 대한 안전

필수품

이 기술은 호스트 환경을 이미 Figma 액세스 설정. 즉

Figma Design System Skills

This repository packages reusable Figma design-system workflows as portable skills.

The canonical source lives in skills/. The repo also exposes the same skills through project-local Claude Code entries in .claude/skills/, so the same checkout can be used in both Codex and Claude Code.

Included Skills

• apply-design-system Review an existing design and connect it to design system components.
• audit-design-system Audit a Figma screen or component for design-system integration drift, including missing shared components, local overrides, and unbound tokens.
• fix-design-system-finding Fix a specific design-system integration finding in a Figma screen or component, including missing shared components, local overrides, and unbound tokens.

Repository Layout

.
├── README.md
├── skills/
│   ├── apply-design-system/
│   ├── audit-design-system/
│   └── fix-design-system-finding/
└── .claude/
    └── skills/
        ├── apply-design-system -> ../../skills/apply-design-system
        ├── audit-design-system -> ../../skills/audit-design-system
        └── fix-design-system-finding -> ../../skills/fix-design-system-finding

Each skill folder contains:

• SKILL.md: shared instructions that work across tools using the open Agent Skills format
• agents/openai.yaml: Codex/OpenAI UI metadata; safe for other tools to ignore

Prerequisites

These skills assume the host environment already has Figma access set up. In practice that means:

• Figma MCP read tools such as get_design_context, get_screenshot, get_metadata, get_variable_defs, and search_design_system
• Figma write access via use_figma
• a helper skill or built-in workflow that teaches safe use_figma usage, if your environment requires one

This repository does not vendor the full Figma helper stack. It contains the design-system workflows themselves.

Use In Codex

Copy the skills you want into your Codex skills directory:

mkdir -p "${CODEX_HOME:-$HOME/.codex}/skills"
cp -R skills/* "${CODEX_HOME:-$HOME/.codex}/skills/"

After that, the skills are available as:

• $apply-design-system
• $audit-design-system
• $fix-design-system-finding

Codex uses the agents/openai.yaml files for display names, descriptions, and default prompts.

Use In Claude Code

Claude Code already discovers project-local skills from .claude/skills/, so opening this repository in Claude Code is enough to make the three skills available as slash commands:

• /apply-design-system
• /audit-design-system
• /fix-design-system-finding

If you want them available across all projects instead, copy the same folders into ~/.claude/skills/.

Claude Code reads SKILL.md and ignores the Codex-specific agents/openai.yaml metadata.

Editing And Publishing