skills.rest
a-ng-d
a-ng-dCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

ui-color-palette-help

Provide command overview and workflow help for the UI Color Palette plugin.

1|Updated Apr 18, 2026
Search Tags:#onboarding#figma#commands#help#palette#design-tools#ui-color-palette
One-click install
npx skills add https://github.com/a-ng-d/claude-ui-color-palette --skill ui-color-palette-help
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-color-palette-help
Source: https://github.com/a-ng-d/claude-ui-color-palette/tree/main/skills/ui-color-palette-help
Command: npx skills add https://github.com/a-ng-d/claude-ui-color-palette --skill ui-color-palette-help

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Display a complete color system workflow in Claude — from source colors to design tools and code export. You can build a palette from scratch, audit its accessibility, push it to Figma/Penpot/Framer/Sketch, export it as CSS/Tailwind/DTCG, and manage published palettes — all in one conversation.

Core Features & Use Cases

  • Source → Palette → Deploy → Manage: Pick or generate source colors, build a full shade scale, export to code or push to design tools.
  • Integrations: Push palettes to Figma, Penpot, Framer, and Sketch; audit accessibility and export tokens in CSS/Tailwind/DTCG formats.
  • Use Case: Build a brand palette from an image or prompt and deliver ready-to-use code tokens for your project.

Quick Start

Just say: Build a palette — the orchestrator will guide you through colors, color space, scale, and themes.

Frequently Asked Questions about ui-color-palette-help

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a UI color palette and export it to code tokens?▼

Yes, you can push generated color palettes directly into Figma, Penpot, Framer, and Sketch. The workflow supports deploying your complete shade scale and design tokens straight into these integrated design tools.

What is the best way to audit color palette accessibility during design?▼

The best way to audit color palette accessibility is to generate a full shade scale from your source colors and run an accessibility audit within the same workflow, ensuring contrast compliance before exporting tokens or pushing to design tools.

Can I generate a complete brand color system from a single image?▼

Yes, you can generate a complete brand color system from a single image. The workflow extracts source colors, builds a multi-shade scale, audits accessibility, and exports the final palette as CSS, Tailwind, or DTCG tokens.

What commands are available for managing published UI color palettes?▼

Available commands cover the full palette lifecycle: generating source colors, building shade scales, auditing accessibility, pushing to Figma or Sketch, exporting code tokens, and managing your published palettes through a structured command reference.

Related Skills

Explore More Design & Creative Skills→
SyntaxAsSpiralSyntaxAsSpiral
5

catppuccin-theming

Generate CSS variables, JSON palettes, and terminal themes from Catppuccin flavors.

Community
Intermediate
viably-labsviably-labs

design-to-tailwind

Convert Figma, Sketch, and Penpot designs into semantic Tailwind HTML structures.

Official
Intermediate
andronicsandronics
1

color-tools

Generate accessible color palettes and validate WCAG contrast for UI designs.

Community
Intermediate
booklib-aibooklib-ai
35

refactoring-ui

Apply Refactoring UI principles to improve visual hierarchy in UI designs.

Official
Intermediate