cc-design

v0.10.0

High-fidelity HTML design skill for slide decks, landing pages, interactive prototypes, animations, and design systems.

CodexClaude Code1 skill

by ZeroZ-labMIT823updated 1 month ago

Source

$ git clone https://github.com/ZeroZ-lab/cc-design

Clone the source, then follow the repository's marketplace instructions for your runtime. The repository root is the plugin root.

Layout

cc-design/

├── .codex-plugin/plugin.json
├── .claude-plugin/plugin.json
└── SKILL.md

Skills1

cc-designSKILL.md

High-fidelity HTML design and prototype creation. Use this skill whenever the user asks to design, prototype, mock up, or build visual artifacts in HTML — including slide decks, interactive prototypes, landing pages, UI mockups, animations, or any visual design work. Also use when the user mentions Figma, design systems, UI kits, wireframes, presentations, or wants to explore visual design directions. Even if they just say "make it look good" or "design a screen for X", this skill applies.

Manifests2

.codex-plugin/plugin.json

{
  "name": "cc-design",
  "version": "0.10.0",
  "description": "High-fidelity HTML design skill for slide decks, landing pages, interactive prototypes, animations, and design systems.",
  "author": {
    "name": "ZeroZ-lab",
    "url": "https://github.com/ZeroZ-lab"
  },
  "homepage": "https://github.com/ZeroZ-lab/cc-design",
  "repository": "https://github.com/ZeroZ-lab/cc-design",
  "license": "MIT",
  "keywords": [
    "design",
    "html",
    "prototype",
    "slides",
    "codex"
  ],
  "skills": "./skills",
  "interface": {
    "displayName": "cc-design",
    "shortDescription": "High-fidelity HTML design for Codex.",
    "longDescription": "Create slide decks, landing pages, interactive prototypes, animations, design systems, and export-ready visual artifacts with structured design planning and quality guardrails.",
    "developerName": "ZeroZ-lab",
    "category": "Productivity",
    "capabilities": [
      "Design",
      "Prototype",
      "Write"
    ],
    "websiteURL": "https://github.com/ZeroZ-lab/cc-design",
    "defaultPrompt": [
      "Design a landing page for this product.",
      "Create a pitch deck from this outline.",
      "Build an interactive prototype for this flow."
    ],
    "brandColor": "#111827"
  }
}

.claude-plugin/plugin.json

{
  "name": "cc-design",
  "description": "High-fidelity HTML design skill with structured design planning, Iron Law guardrails, and verification-first delivery",
  "version": "0.10.0",
  "author": {
    "name": "ZeroZ-lab",
    "url": "https://github.com/ZeroZ-lab/cc-design"
  },
  "homepage": "https://github.com/ZeroZ-lab/cc-design",
  "compatibility": {
    "claude-code": ">=1.0.0",
    "codex": ">=0.125.0"
  },
  "skills": [
    "./skills/cc-design"
  ]
}