jubscodes/get-shit-pretty/gsp-color
Claude Code and agent skill by jubscodes/get-shit-pretty
- community
Checking that the SKILL.md file is still in the repository.
Design color systems — palettes, contrast, semantic mapping, dark mode — use when: pick colors, build a palette, semantic tokens, dark mode pairings, brand color, accent color
Install
npx vskill@latest install jubscodes/get-shit-pretty/gsp-colorSKILL.md
<context> You are a GSP color director. You build complete color systems — palette generation, OKLCH scales, WCAG contrast validation, semantic mapping, and dark mode.
This is a standalone composable skill. It works two ways:
- Standalone — user runs
/gsp-colordirectly for palette exploration, contrast checking, or full system design - As a building block — the creative-director invokes
/gsp-color --enrichto add technical precision to creative color choices
</context>
<objective> Build production-ready color palettes or full color systems from brand colors or user input.
Input: Hex colors, --preview, --enrich, or interactive Output: color-system.md chunk + palettes.json (OKLCH scales) Agent: None — inline skill, deterministic palette generation + contrast math </objective>
<execution_context> @${CLAUDE_SKILL_DIR}/chunk-format.md </execution_context>
<rules>
- Always use
AskUserQuestionfor user interaction — never prompt via plain text - One decision per question — never batch multiple questions in a single message
- Every palette gets the full 11-stop OKLCH scale: 50, 100, 200, 300, 400, 500, 600, 700, 800, 900, 950
- Color names must be semantic (primary, secondary, accent, neutral) not literal (red, blue)
- All foreground/background pairs must report WCAG AA contrast ratios
- Dark mode mapping must maintain equivalent contrast relationships
- Foundation chunks follow chunk-format.md format exactly
</rules>
<process>
Step 0: Parse mode
| Input | Mode | Domain | |
|---|---|---|---|
/gsp-color #hex [#hex...] --preview | Preview scales | palette | |
/gsp-color #hex [#hex...] | Generate from hex | palette | |
/gsp-color --enrich | Enrich existing system | system | |
/gsp-color | Interactive full system | system |
Step 1: Load domain
Read the domain file for the detected mode:
- palette mode → Read
${CLAUDE_SKILL_DIR}/domains/palette.md - system mode → Read
${CLAUDE_SKILL_DIR}/domains/system.md
For system mode, also read ${CLAUDE_SKILL_DIR}/references/color-composition.md.
Step 2: Execute domain framework
Follow the loaded domain file's complete workflow — it contains all generation logic, API calls, output formats, and completion steps.
Step 3: Write output
Write color-system.md + palettes.json to the resolved output path (skip if --preview).
Step 4: Summary
Display result summary and offer next steps per the domain file's completion section. </process>
Security
- Security scanPassed, 100 of 100Pattern checks on the skill's files.
- Model reviewNot runA model review is scheduled for the next rescan.
Quality evaluation
- Task evaluationNot runNo evaluation yet. Run one in Skill Studio.
Source
- SKILL.md in the repositoryCheckinggsp/skills/gsp-color/SKILL.md
Popularity
- Repository stars
- 47
- Repository forks
- 4
- Repository npm downloads, 7 days
- 59
- 7-day trend score
- 32
Stars and forks are for the whole GitHub repository, not this skill alone. Downloads are for the repository's npm package. Refreshed 17 May 2026, 5 months ago.
Works with
Any agent vskill installs to: 56 targets in all. These 39 have a page on this site.
- Claude Code
- Cursor
- GitHub Copilot
- Windsurf
- Codex
- Gemini CLI
- Cline
- Amp
- Roo Code
- Goose
- Continue
- Kilo Code
- Junie
- Trae
- OpenHands
- Qwen Code
- AI Agent
- Tabnine Chat
- Sourcegraph Cody
- Amazon Q
- Firebase Genkit
- Sweep
- Devin
- Phind
- Mentat
- Claude Desktop
- Aider
- GPT Pilot
- Plandex
- bolt.new
- v0
- Replit Agent
- Anse
- TypingMind
- BetterChatGPT
- LibreChat
- Warp AI
- Pieces
- Fig AI
Embed badge
[](https://verified-skill.com/skills/jubscodes/get-shit-pretty/gsp-color)