Color Expert
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions, accessibility, perceptual matching, pigment mixing, print-vs-screen color, CSS color syntax, or historical color terminology. Use this skill whenever the user is choosing, comparing, generating, naming, converting, or explaining colors, even if they do not explicitly ask for "color theory.
Install
npx skills add meodai/skill.color-expert --skill color-expertgit clone --depth 1 https://github.com/meodai/skill.color-expert.git /tmp/skill.color-expert
mkdir -p ~/.claude/skills
cp -r /tmp/skill.color-expert/. ~/.claude/skills/color-expertPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# Color Expert A comprehensive knowledge base for color-related work. See `references/INDEX.md` for a one-line-per-file map of 180+ reference files; this skill file contains the essential knowledge to answer most questions directly. ## How to Use This Skill Match the response to the user's explicit request and clearly implied constraints from context. Five common modes: **Concrete design or art project** — "help me pick colors for my logo / poster / illustration / app." Ask about medium (print, screen, paint, mixed), brand or mood, audience, accessibility needs, and any existing colors to harmonize with. Then propose. Don't lecture about CIE 1931 or OKLCH internals unless asked. Recommend specific tools and palettes that fit the constraints, not generic theory. **Design system, ramps, or theme tokens** — "build me a 9-step accent scale", "palette for light + dark mode", "Tailwind/Radix-style ramps", "what's the right gray ramp for our brand?" Prioritize in this order: - Use OKLCH to build perceptually uniform scales (consistent lightness across hues, no muddy mid-tones). - Build a token graph: reference tokens (palette) → semantic tokens (surface, on-surface, accent, success, warning, danger) → component usage; see *Implementation Guidance* below. - Verify every text/background pair against APCA or WCAG in both light and dark.
Details
- Skill name
color-expert- Repository
- meodai/skill.color-expert
- License
- CC-BY-4.0
- Repo updated
- 21 October 2026
- Listed in
- VoltAgent/awesome-agent-skills
FAQ
What does the Color Expert skill do?
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions, accessibility, perceptual matching, pigment mixing, print-vs-screen color, CSS color syntax, or historical color terminology. Use this skill whenever the user is choosing, comparing, generating, naming, converting, or explaining colors, even if they do not explicitly ask for "color theory.
How do I install the Color Expert skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add meodai/skill.color-expert --skill color-expert. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Color Expert popular?
It lives in meodai/skill.color-expert, which has 629 GitHub stars and 39 forks, and is included in 1 curated skill list.
Related skills
Better Design
545marvkr/better-design
Build, improve, and review production interfaces with the Better Design MCP. Use for frontend design, UI, UX, interactions, flows, forms, navigation, components, styling, design systems, accessibility, responsive layouts, motion, React Native, Expo, Shopify, Three.js, and product video work, especially when creating, redesigning, polishing, or reviewing an interface.
Power Design
748ItsssssJack/power-design
Generate beautiful, on-brand HTML — presentation decks or full responsive websites — in any brand's design language, combining brand DNA extracted via Firecrawl with codified, research-backed design principles (20 rules for slides, 20 for the web).
Qiaomu Design
666joeseesun/qiaomu-design
为页面、组件和产品界面提供设计诊断、四方向可视化预览、设计系统编译、实现与视觉 QA， 也创作与修改微信公众号封面、B站封面、YouTube 缩略图、小绿书配图和小红书封面，按平台检查裁切与可读性。 在用户要求从零设计、重设计、优化 UI/UX、审查界面、建立设计系统、参考某种风格， 或创作公众号封面、设计公号头图、修改微信文章封面、制作 B站封面、YouTube 封面、小绿书配图、小红书配图时使用； 不用于只改业务逻辑、纯文案润色或与界面无关的普通编码。默认由当前 Codex 直接执行， 只有用户在当前任务明确点名 K3 时才调用外部模型。
Web Design
807xiaopu-ai/web-design
Web 视觉设计 SKILL。输入 PRD / 参考 URL / 截图 / 关键词（任意组合），先产出一份标准化 DESIGN.md 设计规范，用户确认后据此生成 UI/UX、视觉、动效、响应式全部达标的 web 代码。专攻 web 端：Landing Page、Portfolio、产品页、博客、个人站、SaaS 介绍页等。当用户说"帮我做个网站""设计一个页面""参考 XX 做一个""把这个截图/PRD 做成网页""做一个 landing page""出一份 design 规范"时触发。不用于后端、数据库、纯逻辑 bug 修复。
Spine Animation
616GenielabsOpenSource/spine-animation-ai
Create Spine 2D skeletal animations from pre-existing character assets (separated body-part PNGs, atlas spritesheet, or a full character image). Use this skill whenever the user wants to animate a 2D character, create Spine JSON from existing art assets, rig a character with bones, build walk/idle/run/attack animations, produce an interactive Spine Web Player preview, or generate Spine-compatible export files (.json + .atlas + .png). Also trigger when the user mentions "Spine animation", "2D rigging", "skeletal animation", "bone animation", "cutout animation", "animate this character", "make t
Bang Motion
780bangtutorial/bang-motion
Membangun motion graphic sinematik di browser (promo video, opener, intro, bumper, kinetic typography, explainer/video penjelasan bergambar 16:9 atau 9:16) memakai HTML + CSS + GSAP (+ Three.js bila perlu), dengan hasil yang bergerak seperti video sungguhan — bukan slide presentasi. Gunakan skill ini setiap kali user meminta "video promo", "opener", "intro animasi", "motion graphic", "bumper", "kinetic typography", "animasi teks sinematik", "explainer", "video penjelasan" (jurnalisme visual, kartun edukasi, kolase), atau menunjukkan referensi video promosi/explainer dan ingin dibuatkan versi w
Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.