build-color-palette

Community

Build accessible, systematic color palettes.

Authorgnurio
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It solves the problem of inconsistent, under-scoped UI color systems that force designers to improvise shades, break accessibility contrast, and fail to support real interface states.

Core Features & Use Cases

  • Systematic palette generation: Produces a comprehensive set of shades including 8-10 greys, 5-10 primary shades, and 5-10 shades per accent family.
  • Role-based mapping: Assigns each shade to specific UI roles (backgrounds, borders, text, hover/active states, and semantic meaning).
  • Accessibility and usability guardrails: Evaluates that text contrast meets WCAG AA targets and recommends fixes for common palette failures (too few greys, missing semantic colors, inconsistent opacity usage).

Quick Start

Use the skill to generate a full palette by providing your brand colors and the UI’s intended mood.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: build-color-palette
Download link: https://github.com/gnurio/refactoring-ui-plugin/archive/main.zip#build-color-palette

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.