←Leaderboard/Design/hue
Last commit on June 11, 2026·Created on April 12, 2026

dominikmartn/hue

“Turn a brand into a reusable design system.”
Combined rank
#464
across all skills
In Design
#51
category rank
Stars
880
+3.3% in last 7d
Forks
70
+4.5% in last 7d
Watchers
4
0.0% in last 7d
Traction scoreGitHub stars can be faked, so popularity alone can be misleading. Traction Score looks for broader signs of recent attention, adoption, and active maintenance.
TL;DR

Hue is a meta-skill that creates design language skills for AI coding assistants. It takes a brand name, URL, codebase, or screenshots and extracts visual identity—colors, typography, spacing, components—then produces a structured skill that Claude Code or Codex can use to generate brand-consistent interfaces. It helps product designers, design system engineers, and frontend developers enforce brand identity without manual token management.

WHO IT'S FOR
Product Designers
generate brand-aligned design systems for AI
Design System Engineers
accelerate token generation for design systems
Frontend Developers using AI Assistants
produce consistent brand-matched UI components
Brand / Creative Directors
enforce visual identity in AI outputs
Repository contents

1 skill file

Categories
Compatible AgentsThe repository documents support for these agents. The skills may also work with other agents that can load SKILL.md files, but they may need some setup or small changes.

Use this skill

Follow the documented setup, then try a first task.

I’m using

Claude Code

Installs: Installs the complete hue skill repository. · Claude Code

  1. Run this terminal command to clone hue into Claude Code's skills directory.

    git clone https://github.com/dominikmartn/hue ~/.claude/skills/hue
README.md ↗ · Checked Nov 5, 2026SKILL.md ↗ · Checked Nov 5, 2026

Give it something to do.

Suggested first task

Create a design skill from a website

Uses hue

  • A brand website URL; replace cursor.com with the URL you want analyzed.
Use the hue skill to make a design skill from cursor.com.
README.md ↗ · Checked Nov 5, 2026SKILL.md ↗ · Checked Nov 5, 2026
Suggested first task

Create a design language from a brand name

Uses hue

  • A brand name; replace Raycast with the brand you want to use as inspiration.
  • Confirmation of the website URL hue identifies before it proceeds.
Use the hue skill to create a design language inspired by Raycast.
README.md ↗ · Checked Nov 5, 2026SKILL.md ↗ · Checked Nov 5, 2026
Suggested first task

Create a design skill from a screenshot

Uses hue

  • A screenshot showing the visual design language to analyze.
Use the hue skill to generate a design skill from this screenshot.
README.md ↗ · Checked Nov 5, 2026SKILL.md ↗ · Checked Nov 5, 2026