frontend-color-system

Installation
SKILL.md

Color System

Generate accessible color palettes. Check contrast. Create themes.

When to Use

  • Setting up project colors from brand color
  • Checking accessibility (WCAG contrast)
  • Creating dark mode variants
  • Generating shadcn/Tailwind theme

Process

BRAND → GENERATE → VALIDATE → APPLY

  1. Get brand color (HEX)
  2. Generate palette via API
  3. Check contrast ratios
  4. Apply to theme
Installs
10
GitHub Stars
11
First Seen
Jan 26, 2026
frontend-color-system — petbrains/mvp-builder