Skill

/reference-design-contract

Goal, audience, references, or the style problem to resolve

shell

$ npx -y skills add nexu-io/open-design --skill reference-design-contract --agent claude-code

Installs just this skill. Get the whole plugin for auto-invocation.

How it fires

How this skill gets triggered: by you, by Claude, or both.

Fires itselfClaude auto-loads it when your prompt matches the work.
You can call itInvoke it directly when you want it.
Slash command/reference-design-contract

Context preview

The summary Claude sees to decide when to auto-load this skill.

Goal, audience, references, or the style problem to resolve

Stats

Stars80,924

Forks9,349

LanguageTypeScript

LicenseApache-2.0

Ships with open-design

SKILL.md

reference-design-contract.SKILL.md

---
name: reference-design-contract
zh_name: "参考转设计合约"
en_name: "Reference Design Contract"
description: |
  Turn vague taste, screenshots, URLs, product notes, or "make it feel like this"
  references into a grounded DESIGN.md plus an implementation handoff. Use it
  before prototypes, decks, redesigns, or image remix work when the user needs
  a reusable visual direction rather than a one-off prompt.
triggers:
  - "design contract"
  - "reference design brief"
  - "style contract"
  - "visual direction handoff"
  - "turn references into DESIGN.md"
  - "make it feel like this"
  - "做同款但不照抄"
  - "把参考图转成设计规范"
od:
  mode: design-system
  platform: desktop
  scenario: planning
  category: design-systems
  preview:
    type: html
    entry: example.html
  design_system:
    requires: false
    generates: true
    sections: [visual-theme, color, typography, spacing, layout, components, motion, voice, anti-patterns]
  craft:
    requires:
      - typography