Skip to main content
ZICQ

Skills ZICQ category:Agent Workflows figma-create-design-system-rules

Figma Create Design System Rules

Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source.

Official URL:GitHub

What this skill does

Intro in this page language first. The official description stays in its original wording; we do not rewrite SKILL.md.

What it does

Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source.

When to use it

The official description does not include a separate “Use when”. Per the spec, agents activate this skill when the task matches keywords in that description.

How agents load it

Per Agent Skills progressive disclosure: name and description load at startup (~100 tokens); the full SKILL.md body loads when the skill activates; scripts/, references/, and assets/ load only as needed. This file's sections: figma-create-design-system-rules; What it does; Source; How to use; Inspect the upstream README for exact paths.

File analysis

File analysis: instruction-only skill (SKILL.md). The agent loads the full body when activated.

figma-create-design-system-rulesWhat it doesSourceHow to useInspect the upstream README for exact paths

Source category:GitHub skill

SKILL.md & Agent activation

Official spec ↗
name
figma-create-design-system-rules
description
Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source.
  1. DiscoverThe client exposes names and descriptions to the agent.
  2. ActivateYour request or the task context selects the skill and loads its instructions.
  3. Load resourcesReferenced scripts, documentation and assets are used when needed.

Invocation syntax and available tools depend on your Agent client. Client integration guide ↗

Install this skill

Skills CLI ↗

Choose the target agent and installation scope, keep referenced package files, then verify the skill appears in the client's catalog.

Ask your Agent to install

Copy these instructions to a compatible agent and confirm the target directory matches your client.

Install the agent skill "figma-create-design-system-rules" into my project. The full SKILL.md and official description are at https://zicq.com/en/skills/skl-05e33b877e233ebf-Figma-Create-Design-System-Rules.html
Save it as .cursor/skills/figma-create-design-system-rules/SKILL.md or .claude/skills/figma-create-design-system-rules/SKILL.md and keep the frontmatter name and description exactly as-is.

Full package on GitHub ↗

Install from the terminal · Skills CLI

Requires Node.js and npx. First inspect the repository's skill list to confirm the name.

npx skills add 'https://github.com/nexu-io/open-design/tree/HEAD/skills/figma-create-design-system-rules' --list

npx skills add 'https://github.com/nexu-io/open-design/tree/HEAD/skills/figma-create-design-system-rules' --skill 'figma-create-design-system-rules'

The CLI lets you choose the agent interactively. The default scope is the project; use -g for user scope. Confirm package availability with the discovery command, then use npx skills list to inspect installed skills.

Readable layout

name: figma-create-design-system-rules description: | Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source. triggers:

  • "figma rules"
  • "design system rules"
  • "figma to code rules"
  • "figma tokens" od: mode: design-system category: figma upstream: "https://github.com/figma/skills"

figma-create-design-system-rules

Curated from Figma's MCP server guide.

What it does

Generate project-specific design system rules for Figma-to-code workflows. Useful for capturing tokens, naming, and lint rules in one source.

Source

  • Upstream: https://github.com/figma/skills
  • Category: figma

How to use

This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the upstream bundle into your active agent's skills directory:

# Inspect the upstream README for exact paths
open https://github.com/figma/skills

Then ask the agent to invoke this skill by name (figma-create-design-system-rules) or with one of the trigger phrases listed in this skill's frontmatter.

Related skills

Agent Workflows

Skill Creator

Guide for creating effective skills. This skill should be used when users want to create a new skill (or update an existing skill) that exte…

Agent Workflows

Clawdhub

Use the ClawdHub CLI to search, install, update, and publish agent skills from clawdhub.com. Use when you need to fetch new skills on the fl…

Agent Workflows

Agent Team Orchestration

Orchestrate multi-agent teams with defined roles, task lifecycles, handoff protocols, and review workflows. Use when: (1) Setting up a team …

Agent Workflows

Superpowers

Spec-first, TDD, subagent-driven software development workflow. Use when: (1) building any new feature or app — triggers brainstorm → plan →…