
Color Expert
- 1.6k installs
- 540 repo stars
- Updated July 30, 2026
- meodai/skill.color-expert
color-expert is an agent skill for use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions,.
About
The color-expert skill is designed for use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions,. Color Expert A comprehensive knowledge base for color-related work. See references/INDEX.md for 140+ detailed reference files; this skill file contains the essential knowledge to answer most questions directly. Invoke when the user 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 OKLCH to build perceptually uniform scales (consistent lightness across hues, no muddy mid-tones).
- Verify every text/background pair against APCA or WCAG in both light and dark.
- Lightness variation at fixed chroma — depth and atmosphere without losing palette identity (use OKLCH).
- IQ cosine palette — a + b·cos(2π(c·t + d)) for cyclic / periodic schemes from 12 floats.
- Anchor-based interpolation (Poline) — set 2–3 anchors in OKLCH, get an interpolated ramp.
Color Expert by the numbers
- 1,590 all-time installs (skills.sh)
- +82 installs in the week ending Aug 5, 2026 (Skillselion tracking)
- Ranked #231 of 1,880 Design & UI/UX skills by installs in the Skillselion catalog
- Security screen: CRITICAL risk (skills.sh audit)
- Data as of Aug 5, 2026 (Skillselion catalog sync)
color-expert capabilities & compatibility
- Capabilities
- use oklch to build perceptually uniform scales ( · verify every text/background pair against apca o · lightness variation at fixed chroma — depth and · iq cosine palette — a + b·cos(2π(c·t + d)) for c
- Use cases
- frontend
What color-expert says it does
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions, accessibility, p
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversio
npx skills add https://github.com/meodai/skill.color-expert --skill color-expertAdd your badge
Show developers this skill is listed on Skillselion. Paste this into your README.
| Installs | 1.6k |
|---|---|
| repo stars | ★ 540 |
| Security audit | 2 / 3 scanners passed |
| Last updated | July 30, 2026 |
| Repository | meodai/skill.color-expert ↗ |
How do I use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions,?
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions,.
Who is it for?
Developers using color expert workflows documented in SKILL.md.
Skip if: Skip when the task falls outside color-expert scope or needs a different stack.
When should I use this skill?
User 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
What you get
Completed color-expert workflow with documented commands, files, and expected deliverables.
- color palette recommendations
- CSS color values
- accessibility contrast guidance
By the numbers
- Bundles 140+ detailed color reference files
Files
Color Expert
A comprehensive knowledge base for color-related work. See references/INDEX.md for 140+ detailed 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.
- Suggest tools only as needed: Huetone (LCH/OKLCH builder), Components.ai Color Scale (parametric), dittoTones (extract perceptual DNA from Tailwind/Radix), Color Buddy (lint).
Generative art / creative coding — "color for my fxhash piece", "palette for thousands of generated strokes", "paint-like mixing in p5.js / WebGL." Different from building a palette generator: the code is the artwork, and the user wants to understand the techniques, not copy a named artist's style. Help them compose their own system. Useful techniques to teach and combine:
- Tight constraint, then variation — pick 3–7 hues in a narrow lightness or chroma band; variety comes from density and interaction, not palette size.
- Weighted / probability-based hue selection — assign each color a weight so some appear often, others rarely; this is what makes a generative output feel curated instead of random.
- Narrow-band hue jitter — small random hue offset within a fixed envelope keeps strokes feeling related but not identical.
- Lightness variation at fixed chroma — depth and atmosphere without losing palette identity (use OKLCH).
- Spectral / K-M mixing (Spectral.js, Mixbox) for paint-like overlap and secondaries; RGB averaging gives muddy, dull results in the same situation.
- IQ cosine palette —
a + b·cos(2π(c·t + d))for cyclic / periodic schemes from 12 floats. - Anchor-based interpolation (Poline) — set 2–3 anchors in OKLCH, get an interpolated ramp.
- Hue / lightness / chroma trajectories with easing (RampenSau) — walk each axis along an easing function, color-space-agnostic; great when you want a deterministic ramp shape rather than random anchors.
- Harmony-aware generation with muddy-zone avoidance (pro-color-harmonies) — adaptive OKLCH harmony with 4 styles × 4 modifiers; skips perceptually muddy regions automatically.
- Generation in historical / non-digital color spaces (RYBitten) — work in RYB or one of 26 historical color cubes when you want a painterly feel that strict sRGB/OKLCH can't reach.
See references/techniques/ for tyler-hobbs, fontana, mattdesl, iq-cosine, spectraljs, poline, rampensau, pro-color-harmonies, rybitten (these document the techniques, not styles to imitate).
General color question — "what is OKLCH?", "why does my gradient go gray in the middle?", "is APCA better than WCAG?" Answer directly from this skill file or references/INDEX.md, and cite the relevant reference. Skip tooling unless they're asking how to do something.
Building a generator, tool, or palette algorithm — "I want to make a palette generator", "how do I generate accessible color scales?", "give me an OKLCH ramp function." Default to recommending an existing library before hand-rolling (Culori, Poline, RampenSau, Spectral.js — see Recommended Tools). Show working code in the user's stack, picking the color space per the table above.
When the user asks to generate or compare palettes, showcase multiple approaches with their trade-offs before narrowing to one — anchor-based (Poline), hue-cycling (RampenSau), cosine (IQ formula), harmony-based (pro-color-harmonies), and extraction-from-system (dittoTones) suit different problems. Don't be shy about presenting options.
Never recommend coolors.co — it doesn't generate palettes, it picks from a hardcoded list of 7,821 pre-made ones (see Recommended Tools).
Color Spaces — What to Use When
| Task | Use | Why |
|---|---|---|
| Perceptual color manipulation | OKLCH | Best uniformity for lightness, chroma, hue. Fixes CIELAB's blue problem. |
| CSS gradients & palettes | OKLCH or color-mix(in oklab) | No mid-gradient darkening like RGB/HSL |
| Gamut-aware color picking | OKHSL / OKHSV | Ottosson's picker spaces — cylindrical like HSL but perceptually grounded |
| Normalized saturation (0-100%) | HSLuv | CIELUV chroma normalized per hue/lightness. HPLuv for pastels. |
| Print workflows | CIELAB D50 | ICC standard illuminant |
| Screen workflows | CIELAB D65 or OKLAB | D65 = screen standard |
| Cross-media appearance matching | CAM16 / CIECAM02 | Accounts for surround, adaptation, luminance, and viewing conditions |
| HDR | Jzazbz / ICtCp | Designed for extended dynamic range |
| Pigment/paint mixing simulation | Kubelka-Munk (Spectral.js, Mixbox) | Spectral reflectance mixing, not RGB averaging |
| Color difference (precision) | CIEDE2000 | Gold standard perceptual distance |
| Color difference (fast) | Euclidean in OKLAB | Good enough for most applications |
| Video/image compression | YCbCr | Luma+chroma separation enables chroma subsampling |
Understanding HSL's Limitations
HSL isn't "bad" — it's a simple, fast geometric rearrangement of RGB into a cylinder. It's fine for quick color picking and basic UI work. But its three channels don't correspond to human perception:
- Lightness (L): fully saturated yellow (
hsl(60,100%,50%)) and fully saturated blue (hsl(240,100%,50%)) have the same L=50% but vastly different perceived brightness. L is a mathematical average, not a perceptual measurement. - Hue (H): non-uniform spacing. A 20° shift near red produces a dramatic change; the same 20° near green is barely visible. The green region is compressed, reds are stretched.
- Saturation (S): doesn't correlate with perceived saturation. A color can have S=100% and still look muted (e.g., dark saturated blue).
When HSL is fine: simple color pickers, quick CSS tweaks, situations where perceptual accuracy doesn't matter. When it isn't, the table above gives the perceptual alternative per task (OKLCH for scales, OKLAB for gradients, OKHSL for picking, HSLuv for normalized saturation).
Named Hue (HSL/HSV) Ranges
Use these degree ranges when generating or constraining colors by hue name. Source: random-display-p3-color by mrmrs / mrmrs.cc.
| Name | Degrees |
|---|---|
| red | 345–360, 0–15 |
| orange | 15–45 |
| yellow | 45–70 |
| green | 70–165 |
| cyan | 165–195 |
| blue | 195–260 |
| purple | 260–310 |
| pink | 310–345 |
| warm | 0–70 |
| cool | 165–310 |
Key Distinctions
- Chroma = colorfulness relative to a same-lightness neutral reference
- Saturation = perceived colorfulness relative to the color's own brightness
- Lightness = perceived reflectance relative to a similarly lit white
- Brightness = perceived intensity of light coming from a stimulus
- Same chroma ≠ same saturation. These are different dimensions.
Gamut Mapping in Practice
The most common OKLCH mistake: picking a chroma that doesn't exist in the target gamut. oklch(70% 0.3 150) asks for more chroma than sRGB (or even P3) can show, so it silently clips — usually to something duller and hue-shifted.
- CSS gamut-maps for you. Browsers map
oklch()/color()automatically, so authored CSS rarely clips badly. JS conversions do not —oklch→hexjust truncates channels. - Reduce chroma, not lightness or hue. Clipping R/G/B shifts the hue; pulling chroma toward the gamut boundary preserves the color's identity. Use Culori's
clampChroma(color, 'oklch')(holds L and H) ortoGamut()rather than naive RGB clamping. - Test against the actual target:
inGamut('rgb')vsinGamut('p3')— a color valid in P3 can still clip in sRGB.
Implementation Guidance — Code and CSS
When using colors in a program or CSS, add a semantic layer between raw color values and UI roles.
The examples below are pseudocode, not literal CSS requirements. They express the decision structure an agent should preserve even if the target stack uses different syntax.
Across CSS, JS/TS, Swift, design-token JSON, templates, or pseudocode, default to the same structure:
- Reference tokens/palette values for concrete colors
- Semantic tokens/roles that map meaning onto those colors
- Component usage that consumes semantic tokens rather than raw literals
Raw color literals should usually appear only in palette/reference definitions, conversions, diagnostics, or deliberately one-off examples.
- Use reference tokens for concrete colors:
ref.red = #f00 - Use semantic tokens for meaning/role:
semantic.warning = ref.red - Prefer semantic tokens in components so themes can swap meaning without rewriting component code.
- This default applies in any language; translate to the target system's equivalent alias/reference mechanism (CSS custom properties, Swift enums, design-token JSON, etc.).
- Encode color decisions when possible instead of freezing one manual choice into a literal.
Pseudocode examples:
ref.red := closest('red', generatedPalette)semantic.warning := ref.redsemantic.onSurface := mostReadableOn(surface)
Good pattern: palette/reference tokens define available colors; semantic tokens map those colors to roles like surface, text, accent, success, warning, and danger.
If a system can derive a decision from constraints, encode that derivation. Examples: nearest named hue in a generated palette, foreground chosen by APCA/WCAG target, hover state computed from the base token in OKLCH instead of hand-picking a second unrelated hex.
For larger systems, prefer a token graph over a flat token dump: references, semantic roles, derived functions, and scope inheritance. This makes theme changes, accessibility guarantees, and multi-platform export auditable and easier to maintain.
CSS Color 4/5 — Syntax Cheat Sheet
Modern CSS does perceptual color natively; reach for these before pulling in a JS library.
- Perceptual color:
oklch(70% 0.12 250),oklab(0.7 -0.1 0.1), wide gamut viacolor(display-p3 1 0.2 0.3). - Mixing:
color-mix(in oklab, blue 30%, white)— interpolating inoklab/oklchavoids the gray mid-gradient that RGB/HSL produce. For cylinders, set a hue strategy:color-mix(in oklch longer hue, …). - Relative color syntax (derive from a base):
oklch(from var(--brand) l c h / 0.5), or compute a shade/hover without a second hard-coded hex:oklch(from var(--brand) calc(l * 0.9) c h). - Light/dark without a media query:
light-dark(white, black)(requirescolor-scheme: light dark). - Gamut targeting:
@media (color-gamut: p3) { … }. - Gradients in a chosen space:
linear-gradient(in oklch, red, blue).
Broadly supported in evergreen browsers (2024+); relative color syntax is the newest piece. See references/techniques/ CSS Color 4/5 for edge cases.
Accessibility — Key Numbers
Of ~281 trillion hex color pairs (research by @mrmrs\_, computed via a Rust brute-force run):
| Threshold | % passing | Odds |
|---|---|---|
| WCAG 3:1 (large text) | 26.49% | ~1 in 4 |
| WCAG 4.5:1 (AA body text) | 11.98% | ~1 in 8 |
| WCAG 7:1 (AAA) | 3.64% | ~1 in 27 |
| APCA 60 | 7.33% | ~1 in 14 |
| APCA 75 (fluent reading) | 1.57% | ~1 in 64 |
| APCA 90 (preferred body) | 0.08% | ~1 in 1,250 |
APCA is far more restrictive than WCAG at comparable readability. At APCA 90, only 239 billion of 281 trillion pairs work. JPEG compression exploits the same biology: chroma subsampling (4× less color data) is invisible because human vision resolves brightness at higher resolution than color.
Color Harmony — What Actually Works
Hue-first harmony is a weak standalone heuristic
Complementary, triadic, tetradic intervals are weak predictors of mood, legibility, or accessibility on their own. Every hue plane has a different shape in perceptual space, so geometric hue intervals do not guarantee perceptual balance.
Character-first harmony works (Ellen Divers' research)
Organize by character (pale/muted/deep/vivid/dark), not hue. Finding: hue is usually a weaker predictor of emotional response than chroma and lightness — a muted palette often reads as calm across many hues. Relaxed vs intense is driven more by chroma + lightness than hue alone.
Legibility = lightness variation
Grayscale is a quick sanity check for lightness separation, not an accessibility proof. You still need to verify contrast with WCAG/APCA and consider text size, weight, polarity, and CVD. Same character + varied lightness is often more readable. Same lightness regardless of hue is usually illegible.
The 60-30-10 rule
60% dominant color, 30% secondary, 10% accent. One color dominates to prevent "three equally-sized gorillas fighting."
Pigment Mixing — Not What You Think
- Pigment mixing is not well described by the simple subtractive model alone — "integrated mixing" (Küppers/Briggs) is a better practical description. It behaves like a compromise between subtractive and additive averaging.
- CMY mixing paths curve outward (retain chroma = vivid secondaries) — "extroverted octopus"
- RGB mixing paths curve inward (lose chroma = dull browns) — "introverted octopus"
- Mixing is non-linear: proportion of paint ≠ proportional hue change. You "turn a corner" at certain ratios.
- Blue→yellow is a LONG road, red→yellow is SHORT. Traditional wheel massively misrepresents distances.
- Tinting strength varies: blues are concentrated/strong, yellows are weak.
- White doesn't just lighten — it shifts hue AND kills chroma.
- For spectral/K-M mixing in code: use Spectral.js (open source) or Mixbox (commercial).
Color Temperature
- Temperature ≠ hue — it's a systematic shift of BOTH hue AND saturation, dependent on starting hue
- Spectral bias: which end of the spectrum a light favors (short λ = cool, long λ = warm)
- Cool daylight: blue atmospheric scatter fills shadows; paint neutral highlights, blue shadows
- Warm incandescent: favors long wavelengths including infrared (literally felt as heat)
- Green and purple do not map cleanly to warm/cool in the same way as red-orange or blue-cyan; perceived temperature depends strongly on context
Color Naming — Multiple Systems for Different Registers
| System | Register | Example |
|---|---|---|
| ISCC-NBS | Scientific precision | "vivid yellowish green" |
| Munsell | Systematic notation | "5GY 7/10" |
| XKCD | Common perception | "ugly yellow", "hospital green" |
| Traditional Japanese | Cultural/poetic | "wasurenagusa-iro" (forget-me-not) |
| RAL | Industrial reproducibility | RAL 5002 |
| Ridgway (1912) | Ornithological | 1,115 named colors, public domain |
| CSS Named Colors | Web standard | 147 named colors |
| color-description lib | Emotional adjectives | "pale, delicate, glistening" |
Use color-name-lists npm package for 18 naming systems in one import.
Historical Corrections
- Moses Harris (1769) was first to place RYB at equal 120° — Newton, Boutet, Schiffermüller didn't. His own wheel needed a 4th pigment. The origin of bad color theory.
- Von Bezold (1874) killed "indigo" as a spectral color — Newton's "blue" ≈ modern cyan, Newton's "indigo" ≈ modern blue.
- The word "magenta" wasn't used for the subtractive primary until 1907 (Carl Gustav Zander). Before: "pink" (Benson 1868), "crimson," "purpur."
- Amy Sawyer (1911) patented a CMY wheel (primrose/rose/turquoise) decades before it became mainstream.
- Elizabeth Lewis (1931) married trichromatic + opponent process on one wheel, anticipating CIE Lab by 30 years.
Recommended Tools
Palette Generation (actual algorithms, not pre-made swatches)
Note: coolors.co does not generate palettes — it picks randomly from 7,821 pre-made palettes hardcoded in its JS bundle.
- RampenSau — hue cycling + easing, color space agnostic
- Poline — anchor points + per-axis position functions (1.2K stars); ships a
<poline-palette>web component for interactive controls - pro-color-harmonies — adaptive OKLCH harmony, muddy-zone avoidance, 4 styles × 4 modifiers
- dittoTones — extract Tailwind/Radix "perceptual DNA", apply to your hue
- FarbVelo — random palettes with dark→light structure
- IQ Cosine Formula —
color(t) = a + b*cos(2π(c*t+d)), 12 floats = infinite palette
Palette Analysis & Linting
- Color Buddy — 38 lint rules (WCAG, CVD, distinctness, fairness, affect)
- Censor — Rust CLI, CAM16UCS analysis, 20+ viz widgets
- Color Palette Shader — WebGL2 Voronoi, 30+ color models, 11 distance metrics
- PickyPalette — interactive sculpting on color space canvas
Color Libraries (code)
- Culori — 30 spaces, 10 distance metrics, gamut mapping, CVD sim
- @texel/color — 5–125× faster than Color.js, minimal, for real-time
- Spectral.js — open-source K-M pigment mixing (blue+yellow=green)
- RYBitten — RGB↔RYB with 26 historical color cubes
- colorgram — 1 kB image palette extraction; 64-bucket HLS+luminance quantization, ~15 ms for 340×340, fixed memory
- Art Palette — JS palette extraction from
ImageData+ Python/TensorFlow perceptual palette embeddings for search-by-color (Google Arts & Culture, Apache 2.0) - random-display-p3-color — generate random Display P3 colors constrained by named hue/saturation/lightness, zero deps, ESM (by mrmrs / mrmrs.cc)
Sorting Colors
Sorting an arbitrary set of colors into a perceptually smooth sequence has no single correct linear order — color is 3D, so any 1D ordering is a path through a 3D space, closely related to the Travelling Salesman Problem. Naive sorts fail predictably: by hue alone interleaves lights and darks; by lightness alone collapses distinct hues; .sort() on a packed RGB/HSL value produces jagged, meaningless jumps. Don't hand-roll a single-channel sort.
- colorsort-js (darosh) — the reliable default for ordering colors. Treats it as a smoothest-path problem (nearest-neighbor / TSP-style) with quantitative smoothness metrics, working in perceptual space; powers okpalette.color.pizza and FarbVelo. Reach for this in almost any "put these colors in a sensible order" situation — palette display, swatch panels, generative output, extracted image palettes. See
references/techniques/colorsort-js.md.
Key Online Tools
- oklch.com — OKLCH picker
- Huetone — accessible color system builder (LCH/OKLCH), by Ardov
- Ardov Color Lab — gamut mapping playground, P3 space explorer, harmony generator, 3D color space visualizations, themer (lab.ardov.me)
- Components.ai Color Scale — parametric scale generator: 6 spaces, 4 curve methods, WCAG contrast (by mrmrs / mrmrs.cc)
- View Color — real-time analysis, WCAG + APCA, CVD preview
- APCA Calculator — apcacontrast.com
Deep References
See references/INDEX.md for the detailed files organized as:
- `historical/` — Ostwald, Helmholtz, Bezold, Ridgway 1912, ISCC-NBS, Munsell, Albers, Caravaggio's pigments, Moses Harris, Lewis/Ladd-Franklin
- `contemporary/` — Ottosson's OKLAB articles, Briggs lectures, Fairchild, Hunt, CIECAM02, MacAdam ellipses, Koenderink 2026 empirical 3D metric field (RGB supports ~1,000 qualitative regions; cool side coarser than warm; chromatic circle is not well-tempered), Pointer's gamut, CIE 1931/standard observer, Pixar Color Science, Acerola, Juxtopposed, Computerphile, bird tetrachromacy, OLO, GenColor paper. Full scrapes: huevaluechroma.com and colorandcontrast.com
- `techniques/` — All tools above documented in detail, plus: CSS Color 4/5, ICC workflows, Tyler Hobbs generative color, Harvey Rayner Fontana approach, Goethe edge colors as design hack, mattdesl workshop + K-M simplex, CSS-native generation, IQ cosine presets, Erika Mulvenna interview, Bruce Lindbloom math reference, image extraction tools, Aladdin color analysis
# PDFs are large (~550MB total) and not needed for the skill
# The markdown summaries capture all relevant content
# Keep PDFs locally for reference but don't commit
*.pdf
node_modules
.claude/
CLAUDE.md
This file provides guidance when working with code in this repository.
Project Overview
This is an agent skill (compatible with Claude Code, Codex, Cursor, Copilot, OpenCode, and others via agentskills.io). It contains a SKILL.md file that serves as a color expertise knowledge base, automatically loaded when the agent handles color-related tasks (naming, theory, spaces, accessibility, perception).
Architecture
SKILL.md— The skill definition with YAML frontmatter (name,description) and structured color knowledge. Loaded when color work is detected.references/INDEX.md— Master lookup table for 140+ deep reference files.references/historical/— Pre-digital color science (Ostwald, Helmholtz, ISCC-NBS, etc.)references/contemporary/— Modern color science (OKLAB, Briggs, CSA webinars, etc.)references/techniques/— Tools, libraries, methods (Spectral.js, Culori, APCA, palette generation, etc.)
No Build/Test/Lint
There are no commands to run. This project is purely declarative content consumed by agent skill systems.
Editing Guidelines
- Keep SKILL.md frontmatter
descriptionfield accurate — it controls when the skill triggers. - The skill is referenced by name (
color-expert). - SKILL.md should be concise "greatest hits" (~200 lines) — the agent already has broad color knowledge; the skill should correct misconceptions, highlight non-obvious facts, and point to the right tools.
- Deep content goes in
references/files, not in SKILL.md. - PDFs are gitignored (~236MB); archive.org source links are preserved in every reference file.
Task Prompts
Use these prompts for qualitative review of the skill. They are meant to test whether the skill gives the right kind of answer, not whether it produces one rigid output.
What to look for
- Does the answer pick the right conceptual frame quickly?
- Does it distinguish standards, heuristics, and implementation reality?
- Does it avoid shallow wheel-theory advice when a stronger explanation exists?
- Does it recommend tools and references that fit the actual task?
- Does it stay concise unless the task really needs deeper theory?
Prompts
1. UI ramps and accessibility
"I need a semantic color system for a data-heavy app. We want success, warning, danger, info, and neutral scales with light and dark themes. Please recommend a practical color-space workflow, how to keep the ramps perceptually even, and how to think about accessible foreground colors."
Good answer:
- pushes toward OKLCH or a similarly defensible working space
- distinguishes palette tokens from semantic tokens
- treats contrast as something to verify, not eyeball
- avoids pretending hue harmony alone solves readability
2. Print versus screen mismatch
"My mockup looks bright and clean on my MacBook, but the printed brochure feels dull and slightly warmer. Can you explain why this happens and what workflow would reduce the surprise next time?"
Good answer:
- explains gamut, viewing conditions, and print/screen differences cleanly
- mentions ICC, D50 or D65 context where useful
- does not oversimplify to 'printers use CMYK so colors are worse'
3. Paint mixing in software
"I'm making a digital painting tool and artists keep complaining that mixing yellow and blue looks wrong. What model should I look at if I want mixing to feel more like paint than Photoshop opacity?"
Good answer:
- rejects naive RGB interpolation for pigment mixing
- points toward Kubelka-Munk, Spectral.js, or Mixbox-style approaches
- explains why pigment mixing paths differ from light mixing
4. Naming and historical register
"Can you suggest names for 12 muted naturalist-style colors for a field guide interface? I want something closer to Ridgway or ISCC-NBS than startup branding names."
Good answer:
- recognizes the naming-system question immediately
- mentions appropriate systems such as Ridgway, ISCC-NBS, or Munsell depending on the need
- avoids random poetic names unless the user asked for them
5. Harmony advice under pressure
"My teammate keeps insisting we should use a triadic palette because that's 'good color theory'. I need a better argument for choosing a calmer, more legible palette for a dashboard."
Good answer:
- de-centers hue-first harmony rules
- emphasizes lightness, chroma, character, and task-specific legibility
- gives a usable alternative rather than only criticizing triads
6. CSS color support question
"Can I rely on contrast-color() and device-cmyk() in production CSS today, or are those still more spec than reality?"
Good answer:
- distinguishes specification from shipped browser support
- uses the CSS Color references without overclaiming implementation status
- stays grounded in practical deployment advice
7. Perceptual terminology
"Please explain brightness, lightness, saturation, chroma, and colorfulness without sounding like a textbook. I need to paste it into internal design docs."
Good answer:
- uses plain English without collapsing the terms into synonyms
- stays accurate enough to support later technical work
- does not drift into hand-wavy 'vibes' language
8. Image compression and vision
"Why does JPEG throw away so much color information before people notice? I want the answer in a way frontend devs will actually remember."
Good answer:
- connects YCbCr and chroma subsampling to human vision clearly
- avoids explaining compression as if color simply matters less than brightness in every context
- keeps the explanation practical and memorable
[
{
"query": "i need a 10-step OKLCH ramp for a warning color that still keeps body text readable on white and near-black backgrounds",
"should_trigger": true
},
{
"query": "why does my print proof look duller than the display-p3 mockup even though the hex values match in figma",
"should_trigger": true
},
{
"query": "can you name these paint swatches in a way that feels like real historical bird-book color names, not marketing names",
"should_trigger": true
},
{
"query": "i'm building a css theme generator and want gradients that do not go muddy halfway through. should i use oklch, lab, or color-mix somehow",
"should_trigger": true
},
{
"query": "help me explain to my team why hsl saturation 100% does not mean two colors are equally vivid",
"should_trigger": true
},
{
"query": "what's a good way to simulate blue plus yellow paint making green in code instead of getting grayish rgb mush",
"should_trigger": true
},
{
"query": "i have a palette extracted from an image and want to sort it so neighboring colors feel smooth and intentional rather than random",
"should_trigger": true
},
{
"query": "is there a color system better than complementary and triadic rules if i'm trying to make a calm interface that still has clear emphasis",
"should_trigger": true
},
{
"query": "what is the difference between chroma, saturation, colorfulness, brightness, and lightness in plain english",
"should_trigger": true
},
{
"query": "i need to convert a bunch of files from png to webp and keep the folder structure the same",
"should_trigger": false
},
{
"query": "write me a react color picker component with keyboard support and no external dependencies",
"should_trigger": false
},
{
"query": "summarize this css file and tell me which variables are unused",
"should_trigger": false
},
{
"query": "i want a nice landing page for my design studio, maybe use orange and blue somewhere",
"should_trigger": false
},
{
"query": "make this chart more readable for stakeholders and reduce visual clutter",
"should_trigger": false
},
{
"query": "give me brand adjectives for this startup: trustworthy, energetic, slightly technical",
"should_trigger": false
},
{
"query": "find the bug in my shader, the normals are flipped and the lighting looks wrong",
"should_trigger": false
},
{
"query": "rename all the image assets from uppercase to lowercase and update imports",
"should_trigger": false
},
{
"query": "what fonts pair well with this poster layout",
"should_trigger": false
},
{
"query": "turn this csv into a dashboard and use our brand palette from the figma file",
"should_trigger": false
},
{
"query": "wire these figma color tokens into our tailwind config and replace the hardcoded hex values across the app",
"should_trigger": false
},
{
"query": "build a theme switcher that toggles between our light, dark, and high-contrast palettes and persists the choice in local storage",
"should_trigger": false
},
{
"query": "can you refactor this d3 chart so the series colors come from a config object instead of being scattered through the code",
"should_trigger": false
},
{
"query": "our marketing team wants three hero-section options using the same brand colors but different moods. can you mock up the copy and layout directions",
"should_trigger": false
},
{
"query": "i need a script that scans screenshots and flags any pixels that are not one of our approved brand colors",
"should_trigger": false
},
{
"query": "make this svg logo animate from grayscale into the brand palette on hover",
"should_trigger": false
},
{
"query": "can you update our storybook examples so each component shows all semantic color variants in a tidy grid",
"should_trigger": false
},
{
"query": "i want a reusable chart-color assignment function that picks the next unused series color and wraps safely when there are too many lines",
"should_trigger": false
},
{
"query": "why does this jpeg get smaller when i export with 4:2:0 subsampling",
"should_trigger": true
}
]
Attribution 4.0 International
=======================================================================
Creative Commons Corporation ("Creative Commons") is not a law firm and
does not provide legal services or legal advice. Distribution of
Creative Commons public licenses does not create a lawyer-client or
other relationship. Creative Commons makes its licenses and related
information available on an "as-is" basis. Creative Commons gives no
warranties regarding its licenses, any material licensed under their
terms and conditions, or any related information. Creative Commons
disclaims all liability for damages resulting from their use to the
fullest extent possible.
Using Creative Commons Public Licenses
Creative Commons public licenses provide a standard set of terms and
conditions that creators and other rights holders may use to share
original works of authorship and other material subject to copyright
and certain other rights specified in the public license below. The
following considerations are for informational purposes only, are not
exhaustive, and do not form part of our licenses.
Considerations for licensors: Our public licenses are
intended for use by those authorized to give the public
permission to use material in ways otherwise restricted by
copyright and certain other rights. Our licenses are
irrevocable. Licensors should read and understand the terms
and conditions of the license they choose before applying it.
Licensors should also secure all rights necessary before
applying our licenses so that the public can reuse the
material as expected. Licensors should clearly mark any
material not subject to the license. This includes other CC-
licensed material, or material used under an exception or
limitation to copyright. More considerations for licensors:
wiki.creativecommons.org/Considerations_for_licensors
Considerations for the public: By using one of our public
licenses, a licensor grants the public permission to use the
licensed material under specified terms and conditions. If
the licensor's permission is not necessary for any reason--for
example, because of any applicable exception or limitation to
copyright--then that use is not regulated by the license. Our
licenses grant only permissions under copyright and certain
other rights that a licensor has authority to grant. Use of
the licensed material may still be restricted for other
reasons, including because others have copyright or other
rights in the material. A licensor may make special requests,
such as asking that all changes be marked or described.
Although not required by our licenses, you are encouraged to
respect those requests where reasonable. More considerations
for the public:
wiki.creativecommons.org/Considerations_for_licensees
=======================================================================
Creative Commons Attribution 4.0 International Public License
By exercising the Licensed Rights (defined below), You accept and agree
to be bound by the terms and conditions of this Creative Commons
Attribution 4.0 International Public License ("Public License"). To the
extent this Public License may be interpreted as a contract, You are
granted the Licensed Rights in consideration of Your acceptance of
these terms and conditions, and the Licensor grants You such rights in
consideration of benefits the Licensor receives from making the
Licensed Material available under these terms and conditions.
Section 1 -- Definitions.
a. Adapted Material means material subject to Copyright and Similar
Rights that is derived from or based upon the Licensed Material
and in which the Licensed Material is translated, altered,
arranged, transformed, or otherwise modified in a manner requiring
permission under the Copyright and Similar Rights held by the
Licensor. For purposes of this Public License, where the Licensed
Material is a musical work, performance, or sound recording,
Adapted Material is always produced where the Licensed Material is
synched in timed relation with a moving image.
b. Adapter's License means the license You apply to Your Copyright
and Similar Rights in Your contributions to Adapted Material in
accordance with the terms and conditions of this Public License.
c. Copyright and Similar Rights means copyright and/or similar rights
closely related to copyright including, without limitation,
performance, broadcast, sound recording, and Sui Generis Database
Rights, without regard to how the rights are labeled or
categorized. For purposes of this Public License, the rights
specified in Section 2(b)(1)-(2) are not Copyright and Similar
Rights.
d. Effective Technological Measures means those measures that, in the
absence of proper authority, may not be circumvented under laws
fulfilling obligations under Article 11 of the WIPO Copyright
Treaty adopted on December 20, 1996, and/or similar international
agreements.
e. Exceptions and Limitations means fair use, fair dealing, and/or
any other exception or limitation to Copyright and Similar Rights
that applies to Your use of the Licensed Material.
f. Licensed Material means the artistic or literary work, database,
or other material to which the Licensor applied this Public
License.
g. Licensed Rights means the rights granted to You subject to the
terms and conditions of this Public License, which are limited to
all Copyright and Similar Rights that apply to Your use of the
Licensed Material and that the Licensor has authority to license.
h. Licensor means the individual(s) or entity(ies) granting rights
under this Public License.
i. Share means to provide material to the public by any means or
process that requires permission under the Licensed Rights, such
as reproduction, public display, public performance, distribution,
dissemination, communication, or importation, and to make material
available to the public including in ways that members of the
public may access the material from a place and at a time
individually chosen by them.
j. Sui Generis Database Rights means rights other than copyright
resulting from Directive 96/9/EC of the European Parliament and of
the Council of 11 March 1996 on the legal protection of databases,
as amended and/or succeeded, as well as other essentially
equivalent rights anywhere in the world.
k. You means the individual or entity exercising the Licensed Rights
under this Public License. Your has a corresponding meaning.
Section 2 -- Scope.
a. License grant.
1. Subject to the terms and conditions of this Public License,
the Licensor hereby grants You a worldwide, royalty-free,
non-sublicensable, non-exclusive, irrevocable license to
exercise the Licensed Rights in the Licensed Material to:
a. reproduce and Share the Licensed Material, in whole or
in part; and
b. produce, reproduce, and Share Adapted Material.
2. Exceptions and Limitations. For the avoidance of doubt, where
Exceptions and Limitations apply to Your use, this Public
License does not apply, and You do not need to comply with
its terms and conditions.
3. Term. The term of this Public License is specified in Section
6(a).
4. Media and formats; technical modifications allowed. The
Licensor authorizes You to exercise the Licensed Rights in
all media and formats whether now known or hereafter created,
and to make technical modifications necessary to do so. The
Licensor waives and/or agrees not to assert any right or
authority to forbid You from making technical modifications
necessary to exercise the Licensed Rights, including
technical modifications necessary to circumvent Effective
Technological Measures. For purposes of this Public License,
simply making modifications authorized by this Section 2(a)
(4) never produces Adapted Material.
5. Downstream recipients.
a. Offer from the Licensor -- Licensed Material. Every
recipient of the Licensed Material automatically
receives an offer from the Licensor to exercise the
Licensed Rights under the terms and conditions of this
Public License.
b. No downstream restrictions. You may not offer or impose
any additional or different terms or conditions on, or
apply any Effective Technological Measures to, the
Licensed Material if doing so restricts exercise of the
Licensed Rights by any recipient of the Licensed
Material.
6. No endorsement. Nothing in this Public License constitutes or
may be construed as permission to assert or imply that You
are, or that Your use of the Licensed Material is, connected
with, or sponsored, endorsed, or granted official status by,
the Licensor or others designated to receive attribution as
provided in Section 3(a)(1)(A)(i).
b. Other rights.
1. Moral rights, such as the right of integrity, are not
licensed under this Public License, nor are publicity,
privacy, and/or other similar personality rights; however, to
the extent possible, the Licensor waives and/or agrees not to
assert any such rights held by the Licensor to the limited
extent necessary to allow You to exercise the Licensed
Rights, but not otherwise.
2. Patent and trademark rights are not licensed under this
Public License.
3. To the extent possible, the Licensor waives any right to
collect royalties from You for the exercise of the Licensed
Rights, whether directly or through a collecting society
under any voluntary or waivable statutory or compulsory
licensing scheme. In all other cases the Licensor expressly
reserves any right to collect such royalties.
Section 3 -- License Conditions.
Your exercise of the Licensed Rights is expressly made subject to the
following conditions.
a. Attribution.
1. If You Share the Licensed Material (including in modified
form), You must:
a. retain the following if it is supplied by the Licensor
with the Licensed Material:
i. identification of the creator(s) of the Licensed
Material and any others designated to receive
attribution, in any reasonable manner requested by
the Licensor (including by pseudonym if
designated);
ii. a copyright notice;
iii. a notice that refers to this Public License;
iv. a notice that refers to the disclaimer of
warranties;
v. a URI or hyperlink to the Licensed Material to the
extent reasonably practicable;
b. indicate if You modified the Licensed Material and
retain an indication of any previous modifications; and
c. indicate the Licensed Material is licensed under this
Public License, and include the text of, or the URI or
hyperlink to, this Public License.
2. You may satisfy the conditions in Section 3(a)(1) in any
reasonable manner based on the medium, means, and context in
which You Share the Licensed Material. For example, it may be
reasonable to satisfy the conditions by providing a URI or
hyperlink to a resource that includes the required
information.
3. If requested by the Licensor, You must remove any of the
information required by Section 3(a)(1)(A) to the extent
reasonably practicable.
4. If You Share Adapted Material You produce, the Adapter's
License You apply must not prevent recipients of the Adapted
Material from complying with this Public License.
Section 4 -- Sui Generis Database Rights.
Where the Licensed Rights include Sui Generis Database Rights that
apply to Your use of the Licensed Material:
a. for the avoidance of doubt, Section 2(a)(1) grants You the right
to extract, reuse, reproduce, and Share all or a substantial
portion of the contents of the database;
b. if You include all or a substantial portion of the database
contents in a database in which You have Sui Generis Database
Rights, then the database in which You have Sui Generis Database
Rights (but not its individual contents) is Adapted Material; and
c. You must comply with the conditions in Section 3(a) if You Share
all or a substantial portion of the contents of the database.
For the avoidance of doubt, this Section 4 supplements and does not
replace Your obligations under this Public License where the Licensed
Rights include other Copyright and Similar Rights.
Section 5 -- Disclaimer of Warranties and Limitation of Liability.
a. UNLESS OTHERWISE SEPARATELY UNDERTAKEN BY THE LICENSOR, TO THE
EXTENT POSSIBLE, THE LICENSOR OFFERS THE LICENSED MATERIAL AS-IS
AND AS-AVAILABLE, AND MAKES NO REPRESENTATIONS OR WARRANTIES OF
ANY KIND CONCERNING THE LICENSED MATERIAL, WHETHER EXPRESS,
IMPLIED, STATUTORY, OR OTHER. THIS INCLUDES, WITHOUT LIMITATION,
WARRANTIES OF TITLE, MERCHANTABILITY, FITNESS FOR A PARTICULAR
PURPOSE, NON-INFRINGEMENT, ABSENCE OF LATENT OR OTHER DEFECTS,
ACCURACY, OR THE PRESENCE OR ABSENCE OF ERRORS, WHETHER OR NOT
KNOWN OR DISCOVERABLE. WHERE DISCLAIMERS OF WARRANTIES ARE NOT
ALLOWED IN FULL OR IN PART, THIS DISCLAIMER MAY NOT APPLY TO YOU.
b. TO THE EXTENT POSSIBLE, IN NO EVENT WILL THE LICENSOR BE LIABLE
TO YOU ON ANY LEGAL THEORY (INCLUDING, WITHOUT LIMITATION,
NEGLIGENCE) OR OTHERWISE FOR ANY DIRECT, SPECIAL, INDIRECT,
INCIDENTAL, CONSEQUENTIAL, PUNITIVE, EXEMPLARY, OR OTHER LOSSES,
COSTS, EXPENSES, OR DAMAGES ARISING OUT OF THIS PUBLIC LICENSE OR
USE OF THE LICENSED MATERIAL, EVEN IF THE LICENSOR HAS BEEN
ADVISED OF THE POSSIBILITY OF SUCH LOSSES, COSTS, EXPENSES, OR
DAMAGES. WHERE A LIMITATION OF LIABILITY IS NOT ALLOWED IN FULL OR
IN PART, THIS LIMITATION MAY NOT APPLY TO YOU.
c. The disclaimer of warranties and limitation of liability provided
above shall be interpreted in a manner that, to the extent
possible, most closely approximates an absolute disclaimer and
waiver of all liability.
Section 6 -- Term and Termination.
a. This Public License applies for the term of the Copyright and
Similar Rights licensed here. However, if You fail to comply with
this Public License, then Your rights under this Public License
terminate automatically.
b. Where Your right to use the Licensed Material has terminated under
Section 6(a), it reinstates:
1. automatically as of the date the violation is cured, provided
it is cured within 30 days of Your discovery of the
violation; or
2. upon express reinstatement by the Licensor.
For the avoidance of doubt, this Section 6(b) does not affect any
right the Licensor may have to seek remedies for Your violations
of this Public License.
c. For the avoidance of doubt, the Licensor may also offer the
Licensed Material under separate terms or conditions or stop
distributing the Licensed Material at any time; however, doing so
will not terminate this Public License.
d. Sections 1, 5, 6, 7, and 8 survive termination of this Public
License.
Section 7 -- Other Terms and Conditions.
a. The Licensor shall not be bound by any additional or different
terms or conditions communicated by You unless expressly agreed.
b. Any arrangements, understandings, or agreements regarding the
Licensed Material not stated herein are separate from and
independent of the terms and conditions of this Public License.
Section 8 -- Interpretation.
a. For the avoidance of doubt, this Public License does not, and
shall not be interpreted to, reduce, limit, restrict, or impose
conditions on any use of the Licensed Material that could lawfully
be made without permission under this Public License.
b. To the extent possible, if any provision of this Public License is
deemed unenforceable, it shall be automatically reformed to the
minimum extent necessary to make it enforceable. If the provision
cannot be reformed, it shall be severed from this Public License
without affecting the enforceability of the remaining terms and
conditions.
c. No term or condition of this Public License will be waived and no
failure to comply consented to unless expressly agreed to by the
Licensor.
d. Nothing in this Public License constitutes or may be interpreted
as a limitation upon, or waiver of, any privileges and immunities
that apply to the Licensor or You, including from the legal
processes of any jurisdiction or authority.
=======================================================================
Creative Commons is not a party to its public licenses.
Notwithstanding, Creative Commons may elect to apply one of its public
licenses to material it publishes and in those instances will be
considered the “Licensor.” The text of the Creative Commons public
licenses is dedicated to the public domain under the CC0 Public Domain
Dedication. Except for the limited purpose of indicating that material
is shared under a Creative Commons public license or as otherwise
permitted by the Creative Commons policies published at
creativecommons.org/policies, Creative Commons does not authorize the
use of the trademark "Creative Commons" or any other trademark or logo
of Creative Commons without its prior written consent including,
without limitation, in connection with any unauthorized modifications
to any of its public licenses or any other arrangements,
understandings, or agreements concerning use of licensed material. For
the avoidance of doubt, this paragraph does not form part of the public
licenses.
Creative Commons may be contacted at creativecommons.org.
Maintenance Guide
Use this file when extending or reviewing the skill.
What Belongs in Each Layer
SKILL.md
Put only the highest-leverage guidance here:
- concepts the agent should reach for repeatedly
- corrections to common misconceptions
- short recommendation tables
- compact tool recommendations
- distinctions that change the answer materially
Keep it concise. If a section starts reading like notes for a lecture, it probably belongs in references/.
references/
Put deeper material here:
- source summaries
- transcripts
- detailed implementation notes
- historical context
- library and spec documentation
Each reference should justify its presence by being either authoritative, unusually clarifying, or practically useful.
evals/
Put realistic prompts here for checking two things:
- whether the skill should trigger
- whether it gives the right level and shape of answer
These files are for human review, not rigid benchmarking.
Source Quality Bar
Prefer sources in this order when possible:
1. primary papers, standards, official specs, original books 2. authoritative secondary explainers with strong citations 3. high-signal practical resources that correct common mistakes or expose real workflows
Avoid adding a source just because it is popular. Keep it if it adds one of these:
- a concept the skill otherwise lacks
- a better explanation than existing sources
- a practical tool or workflow the skill can recommend
- an important corrective to a widespread misconception
Keep SKILL.md Opinionated, But Defensible
The skill should make choices. It should not flatten everything into "it depends." But recommendations need a reason behind them.
Good:
- recommend OKLCH for perceptual ramps because lightness and chroma behave more predictably than HSL
- recommend CAM16 or CIECAM02 when viewing conditions are part of the problem
Weak:
- list many spaces without telling the agent when each one is the right tool
- repeat folk design advice without a perceptual or workflow reason
Review Rubric
Use this checklist when reviewing edits:
1. Trigger clarity
- Would the frontmatter description catch adjacent real-world color tasks?
- Does it avoid triggering on generic coding or design work that merely mentions color?
2. Factual accuracy
- Are the core claims technically defensible?
- Are key distinctions preserved instead of collapsed into simplified but wrong advice?
3. Source quality
- Are links stable and reasonably canonical?
- Is the source worth keeping, or is it duplicating weaker material already present?
4. Practical usefulness
- Would the guidance help someone make a better decision, not just learn trivia?
- Does it recommend tools, spaces, or references that fit the actual task?
5. Scope discipline
- Does the content belong in
SKILL.md,references/, or nowhere? - Is the top-level skill still a strongest-hits document rather than a dump of everything known?
Signs of Drift
Watch for these failure modes:
- too much generic design advice and not enough color-specific reasoning
- too much wheel-theory language without perceptual grounding
- recommendations that confuse standards with shipping support
- stale counts or claims that will rot quickly
- duplicate references that add no new angle
Preferred Update Loop
When making non-trivial edits:
1. update the skill or references 2. scan evals/trigger-evals.json and ask whether the new description still triggers in the right places 3. try at least one prompt from evals/task-prompts.md 4. fix anything that became misleading, overbroad, or too abstract
color-expert
An agent skill that turns your coding agent into a color science expert. Built from resources I keep looking up, returning to, and sharing with others.
What this is
This started as a simple skill file with some color theory notes. Over time it grew into a comprehensive knowledge base as I kept pasting videos, articles, tools, and papers that I find myself referencing again and again — both for my own work building color tools and for explaining color concepts to others.
The skill has three layers:
1. `SKILL.md` (~200 lines) — The "greatest hits" that your agent loads immediately. Key facts, corrections, tool recommendations, and guidelines that answer most color questions without needing to dig deeper.
2. `references/INDEX.md` (~220 lines) — A structured lookup table your agent can scan to find the right reference file for a specific topic.
3. `references/` (144 markdown files, ~286K words) — Deep reference material: full video transcripts, article summaries, library documentation, scraped websites, and research notes.
There is also a lightweight `evals/` folder for realistic trigger and task prompts so the skill can be reviewed against actual usage instead of only edited by intuition.
How it was built
The collection process is simple: when I come across a color resource worth keeping — a YouTube video, a GitHub repo, a research paper, an article — I paste the URL and the skill's workflow captures it:
- Videos get transcribed via `yt-dlp`, summarized, and key concepts extracted
- PDFs and documents get converted to markdown via `markitdown` by Microsoft
- GitHub repos get their README/docs fetched and documented
- Articles get their content extracted and saved
- Books mentioned in videos get searched on Archive.org; freely available PDFs get downloaded
- Websites (like huevaluechroma.com) get fully scraped chapter by chapter
- Tools and links mentioned in any resource get collected into the Online Tools table
Everything goes into one of three folders and gets indexed.
Structure
SKILL.md # The skill definition (loaded on activation)
CLAUDE.md # Claude Code repo instructions
references/
INDEX.md # Master lookup table
historical/ # Pre-digital color science
*.md # Ostwald, Helmholtz, Bezold, Ridgway, ISCC-NBS,
# Moses Harris, Amy Sawyer, Lewis/Ladd-Franklin,
# Caravaggio's pigments, Itten critique...
pdfs/ # Source books from Archive.org (gitignored, ~236MB)
contemporary/ # Modern color science & theory
*.md # OKLAB articles, Briggs lectures, CSA webinars,
# Pixar Color Science, bird tetrachromacy, OLO,
# Acerola, Juxtopposed, Computerphile, GenColor paper...
huevaluechroma/ # Full scrape of David Briggs's site (11 chapters)
colorandcontrast/ # colorandcontrast.com extracted content
pdfs/ # Research papers (gitignored)
techniques/ # Tools, libraries, methods, practical application
*.md # Spectral.js, Culori, Color.js, RampenSau, Poline,
# RYBitten, PickyPalette, Color Buddy lint rules,
# APCA/Myndex, IQ cosine formula, Cubehelix,
# Tyler Hobbs generative color, Fontana approach,
# pixel art palettes, Book of Shaders, LYGIA,
# paint mixing lecture, color harmony lecture...
evals/
trigger-evals.json # Realistic should-trigger / should-not-trigger prompts
task-prompts.md # Realistic color tasks for qualitative review
MAINTENANCE.md # What belongs where, source quality bar, review rubric
ROADMAP.md # Planned scripts and future extensionsReviewing the skill
The repo now includes a minimal review loop rather than a heavy benchmarking framework:
1. Use evals/trigger-evals.json to sanity-check whether the frontmatter description is likely to trigger in the right situations. 2. Use evals/task-prompts.md to test whether the skill answers realistic color questions at the right level. 3. Use MAINTENANCE.md when deciding whether something belongs in SKILL.md, references/, or not in the repo at all. 4. Use ROADMAP.md to track planned color-specific scripts and larger repo improvements.
What's in it
By the numbers
| Count | |
|---|---|
| Markdown reference files | 144 |
| Total words | ~286,000 |
| Source PDFs (local, gitignored) | 14 |
| Online tools catalogued | 48 |
| Video sources transcribed | 54+ |
Historical color science (14 files)
The resources I keep returning to when explaining where color theory came from and where it went wrong:
- Ostwald (1918–1930) — the 24-hue perceptual circle that dominated the 1930s–40s then disappeared
- Helmholtz (1856) — foundational physiological optics; last major physicist to use "indigo"
- Bezold (1874) — killed indigo as a spectral color; renamed it "ultramarine blue"
- Ridgway (1912) — 1,115 named colors for naturalists; fully digitized as JSON
- ISCC-NBS (1955) — 319 systematically named color blocks
- Moses Harris (1769) — the origin of bad RYB color theory (his own wheel needed a 4th pigment)
- Amy Sawyer (1911) — patented a CMY wheel decades before it was mainstream
- Elizabeth Lewis (1931) — married trichromatic + opponent process, anticipating CIE Lab by 30 years
- Plus: Caravaggio's copper resinate technique, Itten's seven contrasts (critically reviewed), the evolution of "magenta" as a color name, Frank Reilly's controlled palette
Contemporary color science (55 files)
The theory and science I reference when building tools or explaining why things work the way they do:
- Bjorn Ottosson's OKLAB articles — all four foundational posts (OKLAB, color picker spaces, gamut clipping, "how software gets color wrong")
- David Briggs's huevaluechroma.com — fully scraped, 11 chapters + glossary
- colorandcontrast.com — UI-focused color science reference, extracted from SPA bundle
- Color Nerd (Peter Donahue) — 20+ video transcripts covering mixing paths, spectral perception, warm/cool, chroma vs saturation, bird vision, OLO
- Colour Society of Australia — 13 webinar transcripts (Briggs, Itten critique, Golden paint making, Reilly palette, colour philosophy)
- Accessible color pair research — @mrmrs\_'s Rust brute-force run over ~281T hex pairs found that only 11.98% pass WCAG AA and 0.08% pass APCA 90
Techniques, tools & libraries (50 files)
The practical resources — the tools I've built, use, or recommend:
Palette generation (actual algorithms, not pre-made swatches): RampenSau, Poline, pro-color-harmonies, dittoTones, FarbVelo, IQ cosine formula, CSS-native generation with color-mix()
Color libraries: Culori (30 spaces, 10 distance metrics), Color.js (CSS spec editors, 154M downloads), @texel/color (5-125x faster), Spectral.js (Kubelka-Munk), RYBitten (26 historical cubes)
Analysis & linting: Color Buddy (38 lint rules), Censor (CAM16UCS, 20+ viz widgets), Color Palette Shader (WebGL2 Voronoi), colorsort-js (perceptual sorting)
Accessibility: APCA/Myndex (the WCAG 3 algorithm), apcach (contrast-first color composition), Bridge-PCA
Naming: color-name-lists (18 systems), color-description (emotional adjectives), Ridgway digitized JSON, colornerd (29,875 manufacturer swatches)
Generative art approaches: Tyler Hobbs (probability-weighted palettes), Harvey Rayner / Fontana (fully generative color), Piter Pasma (tweaked rainbow formula), mattdesl workshop, Book of Shaders, LYGIA shader library
Practical design: Pixel art palette construction, Goethe edge colors as a design hack, Cubehelix, color harmony lecture ("hue-first is a weak standalone heuristic; character-first often works better"), Aladdin color analysis, screen-to-print workflow
Key opinions baked into the skill
These aren't just preferences — they're supported by the research in the collection:
- Use OKLCH/OKLAB over HSL for any perceptual work. HSL lightness is a lie.
- Never recommend coolors.co for palette generation. It doesn't generate anything.
- Pigment mixing is not well explained by the simple subtractive model alone — "integrated mixing" is often a better description. CMY paths curve outward, RGB paths curve inward.
- Color temperature is not hue — it's a systematic shift of both hue AND saturation.
- Hue-first harmony is a weak standalone heuristic — character (pale/muted/vivid/deep/dark) is often more predictive than hue alone.
- "Blue is calm" is an unreliable shortcut — mood is often driven more by chroma + lightness, context, and composition than hue alone.
Installation
Any supported agent (recommended)
npx skills add meodai/skill.color-expertAutomatically detects your installed agents and places the skill in the correct directory. Works with Claude Code, Codex, Cursor, Copilot, OpenCode, and others.
Manual
Clone and symlink into your agent's skills directory:
git clone https://github.com/meodai/skill.color-expert ~/Sites/color-expert| Agent | Symlink target |
|---|---|
| Claude Code | ~/.claude/skills/color-expert |
| Codex | ~/.codex/skills/color-expert |
| OpenCode | ~/.agents/skills/color-expert |
| Project-level (any) | .agents/skills/color-expert |
ln -s ~/Sites/color-expert ~/.claude/skills/color-expertUpdating
npx skills updateOr manually: cd ~/Sites/color-expert && git pull
What triggers the skill
The skill activates when your agent detects work involving:
- Color naming or defining colors in natural language
- Color spaces (RGB, HSL, LCH, OKLCH, Lab, etc.)
- Palette generation or analysis
- Accessibility and contrast (WCAG, APCA)
- Color theory questions
- Color conversion
- Pigment/paint mixing
- Historical color terminology
License
Original project materials in this repository, including README.md, SKILL.md, and references/INDEX.md, are licensed under CC BY 4.0. Third-party source materials and source-derived reference content remain subject to their original authorship and licenses. See LICENSE and THIRD_PARTY_NOTICES.md.
---
_The skill itself was vibe-coded, but the underlying knowledge base came from a collection of color resources I curated over time. Original sources remain attributed to their authors._
_Compiled by @meodai — one URL at a time._
How Many Hex Color Combinations Are Accessible?
Source: Research by @mrmrs_ — https://x.com/mrmrs_/status/2034403566040088832 Code: https://github.com/mrmrs/color-contrast-rust Method: Rust brute-force across all ~281 trillion hex color pairs for six algorithms. Reported runtime: 39 hours. Author: mrmrs / mrmrs.cc
The Numbers
Total possible hex code pairs: ~281 trillion (16,777,216² / 2)
| Threshold | Passing Pairs | % of All Pairs |
|---|---|---|
| APCA 60 | 20.6 T (20,637,683,557,008) | 7.33% |
| APCA 75 | 4.4 T (4,405,913,610,605) | 1.57% |
| APCA 90 | 239 B (239,182,492,850) | 0.08% |
| WCAG 3.0 | 74.6 T (74,553,266,253,058) | 26.49% |
| WCAG 4.5 | 33.7 T (33,723,177,965,830) | 11.98% |
| WCAG 7.0 | 10.2 T (10,236,606,051,802) | 3.64% |
Key Insights
WCAG 2.1 Contrast Ratios
- At 3:1 (minimum for large text / graphical objects): ~1 in 4 pairs pass (26.49%)
- At 4.5:1 (AA normal text): ~1 in 8 pairs pass (11.98%)
- At 7:1 (AAA): ~1 in 27 pairs pass (3.64%)
APCA (Advanced Perceptual Contrast Algorithm)
- APCA is significantly more restrictive than WCAG at comparable thresholds
- APCA 60 (roughly equivalent to WCAG AA body text): only 7.33% — vs WCAG 4.5:1 at 11.98%
- APCA 75 (fluent reading): only 1.57%
- APCA 90 (preferred for body text): a mere 0.08% — only 239 billion out of 281 trillion
What This Means for Designers
- At WCAG AA (4.5:1): you have ~33.7 trillion valid pairs — sounds like a lot, but it's only 12% of color space
- At APCA 90 (best readability): only 0.08% of pairs work — the design space is EXTREMELY constrained
- This quantifies why accessibility-first color selection is hard — and why tools like Color Buddy's palette linting, APCA calculators, and contrast-aware palette generators are essential
- The jump from WCAG 3:1 to 7:1 is a 7× reduction in available pairs
- The jump from APCA 60 to 90 is an 86× reduction
APCA vs WCAG
- WCAG's ratio is symmetric (text on background = background on text)
- APCA is polarity-aware (light text on dark ≠ dark text on light) — which is why the numbers differ
- APCA better models actual readability, but constrains the palette more
Method
- Computed in Rust
- Brute-force across all ~281 trillion hex color pairs
- Covered six algorithms
- Reported runtime: 39 hours
- 16,777,216 possible hex colors (256³)
- Pairs counted as unordered for WCAG (symmetric), ordered for APCA (asymmetric/polarity-aware)
An Atlas of Rare & Familiar Colour
Source: Harvard Art Museums / Forbes Pigment Collection Foreword: Victoria Finlay Institutional attribution: Harvard Art Museums, Forbes Pigment Collection Local PDF: pdfs/2bbb2c8a13987b0491d70b96f772d0cf.pdf
What It Is
This is a museum-atlas style guide to the Forbes Pigment Collection at Harvard Art Museums: a long-running teaching and conservation collection of pigments, dyes, minerals, lakes, historic synthetics, and modern materials.
Rather than presenting color as an abstract wheel, the atlas presents color as a material history tied to:
- actual pigment samples
- trade, extraction, and synthesis
- conservation science
- the instability and aging of artist materials
Core Value
The atlas is useful because it puts real pigments before pure theory. It connects color names to physical substances, historical production, and the way colors actually behave in collections and paintings.
Key Themes
- Material color is historical. Pigments arrive through mining, animal/insect dyes, chemistry labs, colonial trade, and industrial synthesis.
- Color names hide material complexity. Two things called "blue" may come from radically different substances with different permanence, toxicity, and handling properties.
- Collections preserve failure as well as beauty. Faded, unstable, adulterated, or obsolete pigments are part of the story.
- Pigment archives are design tools. The collection supports both conservation and contemporary color thinking by showing how hue, texture, opacity, and provenance intersect.
Why This Matters for the Skill
- Strong source for historical pigment context when discussing material color.
- Useful counterweight to purely screen-based color models.
- Connects well to the repository's interest in Forbes pigments, conservation, Caravaggio materials, and paint-mixing realism.
Practical Takeaways
- Treat pigment color as a combination of appearance, chemistry, and context, not just hex values.
- When discussing historical palettes, include the material source when it changes the story.
- Use this as a reference when a question involves rare pigments, museum collections, permanence, or the history of colorants.
More Bird Color Theory — Hue Circuits & Tetrahedra
Source: Color Nerd (YouTube Shorts) Date: 2025-05-21 URL: https://www.youtube.com/shorts/_Uq1vb5UtoM Views: 48,166
Description
How to model tetrachromatic bird/butterfly vision: four hue circuits (one per 3-cone combination), forming a tetrahedral network. Requires 4 dimensions to model all bird-perceivable colors including tints and shades.
Transcript
Humans with trichromatic vision can see a circuit of hues caused by different signal imbalances between our three types of cone cells. But what about creatures like birds and butterflies that have four types of cone cells, the fourth being sensitive to ultraviolet light? How would you model the different ranges of hues that they can see?
Let's use the symbol of speckle or noise to symbolize this unknowable color — ultraviolet — and all of the blends, say, between ultraviolet and red, and blends between ultraviolet and blue.
If we have this different circuit between long, short, and ultraviolet, we might have another one — the colors between the long, the medium, and the ultraviolet. And a fourth wheel that is all the colors between the short, the medium, and the ultraviolet.
You end up having these four different hue circuits that combine together to form this. Because they've got four primary colors, you can't just turn the color wheel into a color square — you've actually got to add another dimension because of all the ways that those colors can blend together, forming this tetrahedral network.
If human colors also can have shades and tints, we need three dimensions to model all the colors we can see. And that means we actually need four dimensions to model all the colors that birds can see.
Key Concepts
- 4 cone types (L, M, S, UV) create 4 hue circuits — each circuit is a triangle of 3 cones:
1. L-M-S (the human hue circle) 2. L-S-UV 3. L-M-UV 4. M-S-UV
- Tetrahedral network — the 4 hue circuits form the faces of a tetrahedron; UV represented as "speckle/noise" since we can't visualize it
- Not a color square — 4 primaries don't just make a square; the combinatorics require a tetrahedron (4 faces, each a hue triangle)
- Dimensionality:
- Humans: 3 cone types → 2D hue circle + lightness = 3D color solid
- Birds: 4 cone types → 3D hue tetrahedron + lightness = 4D color solid
- Companion to Bird Complementary Colors
Links
No external links mentioned.
Birds See Different Complementary Colors Than Us!
Source: Color Nerd (YouTube Shorts) Date: 2025-05-15 URL: https://www.youtube.com/shorts/RVPEXrHOiOI Views: 53,838
Description
Bird tetrachromatic vision (4 cone types: R, G, B, UV) means different complementary color pairs. With 4 primaries, complements can be 1+3 or 2+2 combinations, producing novel color categories like "ultra cyan" and "gruv."
Transcript
Colors that are complementary for humans are not complementary for birds. The reason a pair of colors is complementary is because in our vision those two colors add up to white. So for example, red and cyan add up to white because red only activates our long cone cell and cyan activates our short and medium. We've got three cone cells. 1 + 2 is three. All three cone cells is white because that means we're seeing the whole visible spectrum.
But if you were a bird and you had tetrachromatic vision, you had four cone cells — red, green, blue, ultraviolet — well then now red and cyan don't add up to whatever you would consider white.
Now let's see if we can do the math. The complement to red would be ultra cyan. The complement to yellow would be ultra blue.
This is interesting because you can have complements that are 2+2 or 1+3 in any combination. So you've actually got two different structures to complementary colors in bird vision.
What's the complement to ultraviolet? White. When you mix ultraviolet and regular white light, you get bird white light.
What if you had something that reflected middle of the spectrum and ultraviolet? So like "gruv." What would the complement of gruv be? Our magenta.
Anyway, this has been interesting.
Key Concepts
- Tetrachromacy — birds have 4 cone types: L (red), M (green), S (blue), UV (ultraviolet)
- Human complementary pairs are 1+2 cone splits (red↔cyan, green↔magenta, blue↔yellow) — always adds to 3
- Bird complementary pairs must add to 4 cones, creating two structures:
- 1+3: e.g., red ↔ ultra cyan (G+B+UV), UV ↔ human white (R+G+B)
- 2+2: e.g., yellow (R+G) ↔ ultra blue (B+UV), gruv (G+UV) ↔ magenta (R+B)
- Novel bird color categories:
- Ultra cyan (G+B+UV) — complement of red
- Ultra blue (B+UV) — complement of yellow
- Gruv (G+UV) — its complement is human magenta
- Ultra yellow, ultra cyan, ultra magenta — secondaries involving UV
- Human white (R+G+B) — is a _color_ for birds, complement of UV
- Bird white = R+G+B+UV (all 4 cones equally stimulated)
- 6 bird secondaries from pairs: yellow, cyan, magenta, ruv, buv, gruv
- Additional "tertiary" class from 3-cone combos: ultrayellow, ultracyan, ultramagenta, human-white
Links
No external links mentioned.
Björn Ottosson — OKLAB, OKHSV, OKHSL & Color Science Articles
Source: https://bottosson.github.io/posts/ Author: Björn Ottosson License: MIT (all code)
The foundational articles behind OKLAB — the color space recommended throughout this collection.
---
1. A Perceptual Color Space for Image Processing (OKLAB)
URL: https://bottosson.github.io/posts/oklab/
What It Is
Perceptual color space: L (lightness), a (green↔red), b (blue↔yellow). Polar form: L, C (chroma), h (hue) = OKLCH.
Why It Was Created
CIELAB, CIECAM02-UCS, and IPT all have significant limitations. Goal: "simple to use, while doing a good job at predicting perceived lightness, chroma and hue."
Design Goals
1. Opponent color space (like CIELAB) 2. Predict lightness, chroma, hue with orthogonal coordinates 3. Produce even color transitions when blending 4. D65 whitepoint 5. Numerically stable and differentiable 6. Scale invariant for dynamic range
Math
XYZ → matrix M₁ → approximate cone responses (LMS) → cubic root → matrix M₂ → Lab. Two matrices + one nonlinearity = extremely efficient.
Key Result
Outperforms CIELAB on lightness AND chroma AND hue prediction. CIELAB's biggest failure: blue hue prediction. OKLAB fixes this.
---
2. How Software Gets Color Wrong
URL: https://bottosson.github.io/posts/colorwrong/
The Problem
Most software blends/processes in sRGB — designed for 1990s CRTs, not color math. Results: colors become "much darker and bluer" when blending saturated opposing hues.
Why
sRGB's nonlinear transfer function exists because CRTs had nonlinear voltage→brightness. It accidentally correlates with perception but fundamentally misrepresents color for computation.
Failures
- Blending white+green → shifts hue
- HSL/HSV color pickers exhibit same problems (they just remap sRGB)
- Operations determined by display technology, not color science
Fix
- Minimum: linearize sRGB before processing, reapply gamma after
- Better: use perceptual spaces (OKLAB) for human-centered operations
- Principle: "Color operations should be done with the use case in mind"
---
3. Okhsv and Okhsl — Color Picker Spaces
URL: https://bottosson.github.io/posts/colorpicker/
Problem
HSV/HSL are ubiquitous but perceptually wrong. HSLuv improves lightness but has chroma jumps and hue distortions (Abney effect in blues).
8 Desirable Properties for Color Pickers
1. Orthogonal lightness 2. Orthogonal chroma 3. Orthogonal saturation 4. Orthogonal hue 5. Simple cylindrical geometry 6. Max chroma at edge 7. Varies smoothly 8. Varies evenly
These properties CONFLICT — can't have all simultaneously.
Okhsv Design
- Follows HSV's triangular structure in OKLCH
- Finds gamut cusp (most saturated point) per hue
- Remaps triangle to square with toe compensation
- Result: improved hue perception, max chroma at s=1/v=1
Okhsl Design (the innovation)
Three-point chroma interpolation instead of HSLuv's single max:
- C₀(l): hue-independent baseline → smooth at s=0
- C_mid(h,l): optimized intermediate → smoother than C_max
- C_max(h,l): absolute maximum chroma for this hue/lightness
- Interpolation: s=0→C₀, s=0.8→C_mid, s=1.0→C_max
- Result: gamut unevenness confined to high-saturation edges; smooth interior
Comparison
| Property | Okhsv | Okhsl | HSV | HSL | HSLuv |
|---|---|---|---|---|---|
| Orthogonal Lightness | No | Yes | No | No | Yes |
| Orthogonal Hue | Yes | Yes | Partial | Partial | Partial |
| Simple Geometry | Yes | Yes | Yes | Yes | Yes |
| Varies Smoothly | Yes | Yes | Yes | Yes | No |
---
4. Gamut Clipping in OKLAB
URL: https://bottosson.github.io/posts/gamutclipping/
Problem
Colors frequently exceed sRGB [0,1]. Simple clamping distorts hues and kills detail.
Insight
sRGB gamut in OKLAB is always close to a triangle per hue slice, with corners at (L=0,C=0) and (L=1,C=0). The third point (cusp) = most saturated color at that hue.
5 Methods Compared
1. Chroma compression — keep L constant, reduce C (preserves brightness) 2. Project to (0.5, 0) — toward middle grey (hue-independent) 3. Project to cusp L — hue-dependent projection target 4. Adaptive L₀=0.5 — blend chroma compression + projection, α parameter 5. Adaptive L₀=Lcusp — same with hue-dependent target
Recommendation
Adaptive L₀ with α=0.05 — good default. L₀=0.5 variant slightly more efficient, visually equivalent at low α.
---
Links
- OKLAB: https://bottosson.github.io/posts/oklab/
- Color Wrong: https://bottosson.github.io/posts/colorwrong/
- Color Picker (OKHSV/OKHSL): https://bottosson.github.io/posts/colorpicker/
- Gamut Clipping: https://bottosson.github.io/posts/gamutclipping/
- Interactive picker demo: https://ok-color-picker.netlify.app/
Colours of Objects and Colours of Light
Source: Colour Society of Australia (YouTube) Speaker: Dr David Briggs Date: 2023-12-16 URL: https://www.youtube.com/watch?v=ii9dWIG9nOY Duration: 45:55 Views: 2,640
Transcript
this video is a new recording of my presentation for the National Conference of the color Society of Australia in October this year it's a pleasure to thank the committee of the Western Australian division for putting on the conference and for inviting me as keynote speaker my presentation Builds on some ideas about colors of objects and colors of light from two papers I published earlier this year combined with some Reflections on the reception of those ideas by people ranging from beginning students to various kinds of color experts the papers are available online and you can download them from the link shown here in this presentation I'll be using the standard definitions of color terms provided by the cie International Lighting vocabulary whose definitions are also available online as the eilv at the link shown here the way we see the world has a remarkable layer equality that's often overlooked our visual system automatically instantly and seemingly effortlessly presents us with perceptions of the varying spectral reflectances of objects and of the varying intensity and spectral composition of the light falling on those objects we call these perceptions of spectral properties colors because we're mortal objects ourselves the colors we notice most are those of other objects colors of objects can be specified using several different sets of attributes and although one of these sets characterizes What's called the natural color system I don't think any can claim to be uniquely natural however for the purposes of this presentation we can focus mainly on the cie defined attributes of hue lightness and chroma as Illustrated on the left here in contrast colors of Lights can be described in terms of the cie defined attributes of hue brightness and colorfulness or hue brightness and saturation because we tend to think mainly of colors of objects these terms for colors of light are much less widely understood and even color Educators with Decades of experience may present the differences between lightness and brightness or between chroma colorfulness and saturation incorrectly as being minor and unimportant at an introductory level but as I want to emphasize in this talk our perception of colors of objects is inextricably linked with our perception of colors of light in fact without considering the attributes of brightness and colorfulness we can't even understand the standard cie definitions of lightness and chroma these are the formal definition of hue lightness and chroma from the cie International Lighting vocabulary notice first that in the definitions of both lightness and chroma there is a reference to comparison with the brightness of a similarly illuminated area this expression restricts these definitions to colors of areas viewed in relation to other areas called related colors and more specifically to Colors perceived as belonging to an illuminated area that is perceived as belonging to a light reflecting or light transmitting object by these definitions lightness and chroma do not apply to Colors perceived as belonging to light itself or to a light emitting object unless that object is somehow perceived as being illuminated an important example of thead is a computer screen which emits light but is normally red as an illuminated page in contrast the attribute of hue applies to all colors whether of light reflecting light transmitting or light emitting objects or of light itself brightness is our perception of the amount of light reaching our eyes from an area whether that light is emitted or reflected from the area the lightness of an object is defined as its brightness compared to that of a similarly illuminated white object if we take an ideal white object to Def usually reflect close to 100% of the light falling on it the lightness of an object is in effect our perception of the proportion of the light falling on the object that the object reflects I'll repeat that for emphasis the lightness of an object is our perception of the proportion of the light falling on the object that the object reflects the chroma of an object is in effect defined as the colorfulness of its appearance normalized for the amount of light falling on the the object I wonder if you've ever thought about how remarkable it is that we have a perception of lightness if we needed to place something white beside an object in order to judge its lightness it wouldn't be nearly so remarkable we could simply compare the amount of light directly but the fact that we routinely perceive objects as exhibiting a particular lightness without needing to do this shows that our visual system effortlessly presents us with a perception of the amount of light falling on objects without having any direct way of measuring this amount of light to do this it must essentially arrive at a guess at the combination of Illumination and reflectance responsible for the light reaching our eyes from each area that we see this computation normally occurs without requiring any conscious intellectual activity from us though it's presumed ably based on prior experience of the world indeed our visual system does this so automatically that it seems to us as if our eyes just directly detect the lightness and color of objects which is why it never occurs to us how extraordinary this perception really is the lightness and choma of an object exhibit a high degree of stability at different intensities of the same illumination for example a white object such as a piece of paper is still perceived to be white Under illumination varying through a very wide range of intensities despite the fact that the amount of light reaching the eye from the paper varies greatly this stability of lightness and chroma perceptions demonstrates how effectively our visual system presents us with perceptions of the amount of light falling on objects this High degree of stability of the perceived Hue lightness and Chrome of objects under varying intensities of the same illumination is one aspect of one of the most remarkable and adaptively useful features of our visual system called color constancy unfortunately there's no definition of color constancy in the International Lighting vocabulary but as lightness is an attribute of the colors of objects I take lightness constancy to be an aspect of color constancy rather than something separate as it's sometimes treated thus in this illustration although the red stripe changes in overall appearance along its length and is depicted using different RGB values the stripe itself is perceived to not change its color that is it's perceived to be a uniformly colored object under varying illumination so we judge the red stripers having the same color that is the same Hue lightness and chroma along its length and would expect it to match the same msle chip placed alongside it in the light and in the shadow the change in color appearance of this uniform red stripe along its length can be described in terms of brightness and colorfulness the stripe appears brighter and more colorful in the upper part than in the lower part these color attributes of brightness and colorfulness describe the appearance of the light reaching our eyes from different areas of the object as opposed to the color of the object itself so we need a total of at least five attributes to describe the color appearance of our rent stripe Hue lightness and chroma to describe the color of the stripe and Hue brightness and colorfulness to describe the color of the light reaching our eyes from different areas of the stripe a color perceived as belonging to an object is called an object color because they exhibit High constancy through a large range of intensities of the same illumination the lightness and chroma of an object are perceived as belonging to that object and are thus attributes of the object color in contrast the variations of brightness and colorfulness here are perceived as being imposed by the illumination rather than belonging to the object itself thus although they are attributes of the total color appearance of the object they should not be considered attributes of the object color so we can look at our image on the left in two different ways as an array of object colors belonging to the stripe and background or as an array of patches of light of different colors reaching the eye the first way of looking has been called the distal or constancy mode of visual perception and is our usual way of looking at the world in which we are concerned with the properties of external objects the second way of looking has been called the proximal mode of visual perception this mode is alternatively called the painters mode because representational painters May view their subject like this and in some way translate the colors of the patches of light into colors of their paints So within the image area on the left we can attend to two different sets of perceptions an array of object colors and an array of colors of light reaching the eye but there's another color perception we haven't considered yet within the same rectangle we perceive an arrangement of varying illumination or light and Shadow the colors is perceived as belonging to this varying illumination are called illumination colors illumination colors can also vary in Hue and brightness and colorfulness but in this example the light is perceived to be a chromatic or white light varying only in brightness this is an animation from a webinar I gave as the international color Day 2018 event for the inter Society color Council so you can see I've been going on about these things for quite a while notice that we perceive these object colors and illumination colors superimposed as if we see the object colors through the illumination colors so if someone asks how can we say that the two ends of the stripe exhibit the same object color when they look different we can answer our visual system presents the world to us as layered perceptions of object color and illumination the object color with its relatively constant Hue lightness and chroma is perceived through the variations in illumination it's only because of this capacity of our visual system to pause visual information into perceptions of object color and illumination that we perceive objects as having relatively stable object colors and not merely constantly shifting brightness and colorfulness because we're mainly interested in colors of objects you may not have noticed that our perceptions of object color are always accompanied by perceptions of Illumination and most places we look we see superimposed object color and illumination color perceptions the only exceptions where our proximal perceptions of light are not accompanied by distal perceptions of object and illumination colors are where we perceive what are called film colors or aperture colors for example a uniform blue or gray sky sunlight perceived through closed eyelids or light perceived through a small aperture in a dark screen now let's look at this concept of perceptual layering in a depiction of a three-dimensional environment in this image we perceive a high chroma orange Cube on a floor of black and white tiles and we perceive each of these three materials as having the same color belonging to it in the light and in the shadow thus we perceive the cube itself as having the same high chroma color on all three faces as if it were painted all over with the same paint that we might judge to be about 10r 614 in monsal terms at the same time areas a to c respectively send progressively greater amounts of light to the eye evoking progressively stronger responses at the level of the retina and appearing progressively higher in brightness and colorfulness similarly although we perceive the lighter colored areas of the floor as being white things that is as having a uniform white object color the corresponding image areas send light of a wide range of intensities to the eye perceived as a wide range of brightnesses as alwayss our perception of these object colors is accompanied by a perception of Illumination in this image we once again perceive a chromatic or white light illumination varying only in brightness but now we can see that this perception of Illumination is rich in information about the three dimensional form of our objects although we may not pay much attention to it consciously our perception of Illumination supplemented by texture binocular vision and parallx for close objects is a major source of information for us on the three-dimensional structure of the world notice that once again we experience these perceptions of object color and illumination color color superimposed in the same rectangle as if the object color is seen through the Illumination in the eilv definitions of object color and illumination color the word color links to the entry for color in the perceptual sense or perceived color so object and illumination colors as defined in the eilv are visual perceptions perceived as belonging to objects and lights although they are perceptions we perceive object colors to be located outside Us in objects themselves as in the uniform black white and orange object colors that we perceive to be located in the tiles and Cube depicted in this image even though these objects are physically non-existent this last observation can help students to accept that the color they perceive to be located in actual objects are similarly not located in those objects but are perceptions that we project onto objects but what does object color a perception of if these were actual objects we could expect them to differ in the property of spectral reflectance which is the proportion of the light of each wavelength that the object reflects and for the spectral reflectances of these objects to agree in general character although not necessarily in fine detail with the spectral reflectance curves shown on the left here when we can freely examine an object in daylight the color we perceive the object is having is a very reliable indication of its overall spectral reflectance or to put it another way the color of the object is the way in which we perceive its overall spectral reflectance overall here meaning at the level of its long middle and short wavelength components as detected by the human visual system these provisors are important when our access to an object is restricted and we can't freely examine it the same objects can be made to appear any lightness as has been demonstrated in a number of classic experiments in the galb staircase demonstration on the left a square that appears black or dark gray in daylight can be made to appear white if it is illuminated in isolation by a bright concealed Spotlight in a darkened room but when a more reflective square is added alongside it the added square is perceived to be white and the first square is seen as a more bright Bri ly illuminated light gray the effect is repeated as progressively more reflective cards are added so that only the most reflective card appears white each of the previously white appearing cards appears a different shade of gray on the right we see another apparatus used by the same investigator in which the Observer viewed panels in the apparatus from directly above and the perceived lightness of the panels could be varied by adjusting their slant our ability to perceive the overall spectral reflectance of an object as its color is most effective in daylight the illumination that our color vision evolved under and tends to perceive as a chromatic or white light under illumination with a strongly biased or spiky spectral distribution objects can exhibit different colors that may be less representative of the object's over all spectral reflectance having said that our visual system does exhibit a degree of color constancy under spectrally bias that is colored illumination this results partly from adaptation by which we might perceive the scene on the right to be less strongly reddish than it would appear otherwise and partly from perceptual layering by which we might attribute the remaining reddish appearance of the scene to the illumin mination so that we might perceive through the reddish illumination some gray and white object colors and other object colors with a degree of constancy needless to say our perceptions of spectral reflectant are not based on instrumental measurements but are shaped by the workings of the human visual system first and importance is its dependence on the relative responses of three receptor types so that all that matters is the spectral reflectance at the level of its long middle and short wavelength components the spectral reflectances that are physically different but similar at this level called metamers may be indistinguishable under some illuminations as shown in the middle diagram here and what is important for the Hue and chroma of the color is the overall direction and amount of imbalance at the of the spectral reflectance at this level also important is the Luminous efficiency function which means that reflectance near the middle of the spectrum has more influence on lightness perceptions than reflectance at the two ends I apologize if I seem to anyone to be laboring the point here and in my papers but I've done so because a surprising number of my colleagues profess to believe that we don't know what colors are so it seemed worthwhile to me to attempt a careful statement of what colors and their attributes can be said to be perceptions of under certain conditions to sum up when we can freely examine an object in daylight the lightness of the object is the way in which we perceive the object's total reflectance of light that is the object that the object reflects as detected by the human visual system the Hue of the object is the way in which we perceive the overall direction of bias of the object spectral reflectance at the level of its long middle and short human visual system and the chroma of the object is the way in which we perceive the amount of this bias now if we can't examine an object freely in daylight the Hue lightness and chroma we perceive May bear no relationship to the object spectral reflectance and there are some who would argue therefore that color attributes should be considered purely as perceptions and that correlating them with spectral properties as I've done here is a naive error or even for one person scientism but in everyday life we often notice that the color we perceive an object as having varies under colored or artificial lighting and so on and in such cases it is precisely the color we perceive when we freely examine the object in daylight that we think of as it's true true or seemingly inherent color or in short what we mean by the color of the object as we've seen color is a perception and the concept of a color actually inherent in an object is elcer but in communicating about color in many contexts it would be taking intellectual Purity to the point of uselessness to try to prohibit speaking of the color of an object such as a paint and its connection to spectral properties I want to briefly refer back to something I talked about at the 2018 CSA conference in Melbourne because sometimes people have the idea that it's been shown that our visual system doesn't really detect spectral properties based on demonstrations like this one believe it or not the two trapezoidal gray areas here match physically as you can see if you block out all the rest of the image the creators of the demonstration perves and Lotto say in their book that this shows that what we see deviates from physical measurements of objects and conditions in the real world and that's fine as far as it goes it's acknowledged in a note to the cie definition of color that color perceptions depend on the Observer and all sorts of things besides spectral properties but pves and Lotto claim that their demonstrations are evidence that we need a radical new theory of visual perception I think it's sometimes debatable exactly what p and Lotto are claiming but some things they say create the impression that our perceptions have nothing to do with spectal properties and this idea has gained some traction with the general public but as we just saw when we can freely examine an object in daylight its color is normally a very good guide to its overall spectral reflectance what perves and Lotto demonstrations actually show is that in images of illuminated objects what we see can deviate dramatically from physical measurements of the image surface so why is our perception of the spectral properties of this one class of objects so unreliable significantly we don't actually have to block off the remainder of the image to see that the areas match all we need to do is introduce a Target perceived to be under a different illumination and we can immediately see that both areas match the same thing note that there's no suggestion that the brightness of either image area changes when the reference chip is introduced we simply find the relative brightnesses of the two areas very difficult to attend to until the chip is in place what I argued in my presentation which you can find on YouTube is that we find the perceived colors of the virtual objects depicted in these images so visually insistent that it's very difficult to attend to and compare color perceptions relating to the image areas themselves in the context of this presentation the demonstration shows that as soon as we perceive an area as superimposed object in illumination colors it becomes extremely difficult to compare it proximately as a patch of light until we break the representational spell of the image by introducing a Target perceived to be under a different illumination so that's colors of objects what about colors of light rather than spectral reflectance the color of a light relates to its spectral power distribution which is the distribution of power that is energy per time among the wavelengths making up the light the way I've put it is that the color we perceive as belonging to an isolated light is the way in which we perceive the overall balance of a spectral power distribution relative to that of daylight as detected by the human visual system I've shown in the first paper how you can trace this idea back to Newton and forward to the concept of chromaticity in modern cie calorimetry it's found in Newton's concept of the center of gravity of the Rays making up a light which he Illustrated with his famous Hue Circle this shows the idea that the color of a light containing a mixture of wavelengths can be predicted from the overall imbalance or bias of the center of gravity of the wavelength composition compared to that of a chromatic or white light such as daylight of the three different lights on the right the top one is an illuminant representative of daylight meaning a combination of direct sunlight and Skylight the second is a fluorescent light matching daylight and the third is the emission from a white iPad screen also tuned to to match daylight these three very different spectral distributions are said to have the same chromaticity meaning they all have the same overall balance at the level of the long middle and short human visual system and so the three lights all plot at the same point in a chromaticity diagram interestingly it's not a perfectly even spectral distribution that we perceive as being white or lacking Hue such an aluminate actually looks pinkish it's this somewhat uneven spectral distribution of daylight with the peak in blue green that we perceive as being white this is no accident because it's to our advantage to perceive typical daylight as colorless so that we can distinguish objects by their spectral reflectances most easily what actually happens is that throughout our lives our visual system continually attunes itself so that the somewhat uneven spectral power distribution of daylight is perceived as lacking Hue this adjustment occurs very slowly as our lenses slowly turn brown with age and over a period of months when we get new ones I talked about color constancy before and as a lot of you probably know when someone starts talking about color constancy it won't be long before they show you a banana this next diagram is based on a photo that Paul Green Armitage submitted to the color literacy project and I wanted to use it to illustrate perceptual layering using actual objects and lighting one way it's a bit more complicated than the previous diagrams is because there's another layer involved here on the plate and a little bit on the banana there's a layer of specular reflection or highlights classified as luminous color that forms a third perceptual layer but setting that aside for now we see on the left the object colors comprising the light yellow with some darker variants of the banana the white of the plate and the light brown of the wooden tabletop and on the right you see my representation of the illumination colors now today it's possible to generate such a representation using a computer algorithm but this presentation is just my attempt to paint in Photoshop what a white object would look like at any point in the photograph so you can see it's not entirely AC chromatic there's a little bit of reflected yellow light coming off the banana once again we perceive these patterns of object colors and illumination colors superimposed in the same area now here's something I find very interesting if we take the RGB color depicting the Shaded half of the banana and look at it out of context we perceive a mid value olive color under a certain illumination but in the context of the photo we perceive a dimly illuminated light yellow and it's hard to see that these areas match what I think this shows is that like the pves and Lotto demonstration once we perceive an area as superimposed object in illumination colors it becomes difficult to perceive and compare that area proximately as a patch of light here's a similar example from the early days of my website area a and area B are the same RGB color but what you perceive are a dimly illuminated bright red at a and a brightly illuminated darker red at B that is combinations of object color and illumination only if I do something like this this can you see that the light reaching your eyes from the two areas matches the same thing and here's another good one you perceive the left half of the stripe is a dimly illuminated pink again as a combination of an object color and an illumination and it's very hard to see that the light from this area matches that from the circular area yet it does this demonstrates another kind of perceptual layering in which we perceive object colors with a degree of constancy through a translucent layer on the left we see a months or 10 hu Circle under a certain illumination and in the middle I've emulated in Photoshop the effect of adding a translucent bluish layer and we still have a perception of the original object colors seen through the translucent layer but if we remove those rectangular areas from that context without changing them at all we perceive very different colors looking at the middle circle our perception is of red through blue orange through blue yellow through blue colors and so on and it's very difficult to experience colors that relate to the image surface like we see on the right perhaps this is debatable but I think we can discern hints of some of the ideas I've been discussing In this passage from the medieval Arabic writer alhazen including the idea that an object has its own unchanging color despite variations in the light falling on the object and the associated variations in the radiation of color from the object and that the form of the light illumination and the color existing in the colored object object color are perceived mingled together the remainder of the passage jedge the idea that the separation of these perceptions is learned from experience of the world the concepts of discounting the illuminant and unconscious inference are associated with human Von Helm Holts who discussed them briefly in these passages from his Treatise on physiological objects I've sometimes seen the idea of discounting the illuminant interpreted to mean simply adaptation we adapt to the color of the illuminant and thus see the color of the object but in the passage from his physiological Optics he talks about this just after talking about some demonstrations like the one on the left here that involve seeing one color through another color and what he says is that in the author's opinion The Faculty of making such a separation depends on this circumstance that we need to be able to do this to separate colors of Illumination from colors of object objects so again while it's possible to interpret it other ways I think we could say that he's talking about perceptual layering separation of object and illumination color perceptions is treated explicitly among the gastal psychologists like adamar Gelb the russian-born but German trained researcher I mentioned earlier in connection with the Gelb staircase in this passage G is clearly expressing the idea that perception of Illumination and perception of object colors are two results of the same process skipping ahead to 1978 Barrow and Tenon Bal coined the term intrinsic images in the context of their interest in computer vision they talked about superimposed perceptions of not only reflectance and incident illumination but other things as well like depth specular Reflections and so forth This research has gone on in Leaps and Bounds since then and these are just a few examples from a library of images used to test different computer algorithms for how successfully they separate an image into object colors and illumination around the time of Barrow and Tenon bom's paper other researchers started talking about how humans might do the same computations Alan Gilchrist paper suggested our visual system distinguishes illumination boundaries and reflectance boundaries using criteria such as that illumination boundaries tend to be gradational and reflectance boundaries tend to be sharper and this allows us to build up superimposed images of reflectance and illumination This research has also gone ahead in Leaps and Bounds and I'll just recommend to you one very helpful paper by Fred Kingdom that includes an overview of the concept of perceptual layering and the criteria available to our visual system to distinguish reflectance and illumination boundaries I've discussed in the second Jake paper how color can play a role in this in the image on the left I think we tend to perceive uniformly colored Stripes Under varying illumination and that's partly because of the edge properties which are sharp between what we perceive to be reflectance boundaries and soft at what we perceive to be changes in illumination but color is also helping us here each stripe has a uniform chromaticity and chromaticity you'll recall is the overall balance of long middle and short wavelengths from the point of view of the human visual system now in the processing of information from the retina one line of processing cone opponency compares the responses of different cone classes and gives us a perception of the overall balance of the spectral composition this would allow us to identify patches of the visual field that have the same chromaticity and are therefore likely to be made of the same stuff and therefore any change in the perceived intensity of Light Within these areas is likely to be due to a change in illumination so if you get a number of these changes of Illumination arranged consistently with each other it helps the visual system to Guess that a change of Illumination is occurring but if it's not consistent then it doesn't work you see they're exactly the same rectangles but they're just turned around so that the gradients are not consistently arranged and so they don't create a perception of consistent illumination I'd like to finish by sharing something I've noticed about the reception of these ideas with different audiences I'm privileged to be able to discuss these ideas with people ranging from those who are just beginning to think about color to various kinds of color experts even within my online color course as well as in online and in-person discussions and I've also sought feedback from the other experienced color educators of the color literacy project and from some World authorities on the science of color appearance it seems to me that people fall into three fairly distinct groups correlated with what they understand by the color of an object for the color novice the concept of an object color as defined by the cie presents no problem bananas are light yellow with maybe a little bit of green and black this light yellow color can be described as a certain Hue lightness and chroma and is closely correlated with the banana spectral reflectance and equally the concept of color constancy is unpr problematic bananas are light yellow whether we look at them indoor or outdoors in sunlight beginner painters tend to paint objects in this object color ignoring or reducing variations in appearance due to light and shade this is very noticeable in many children's paintings and it's also characteristic of much ancient painting including Egyptian monan classical Greek and at truscan painting but as we learn to paint we have a light bulb moment where we learn to attend to the complete color appearance of our subject including the influence of light and shade specular Reflections and reflected light from other objects as in this lovely demonstration by James gurnie the same light bulb moment occurred in the evolution of ancient Greek painting between the classical and the helenistic eras it was largely lost sight of in the Middle Ages and rediscovered in the European Renaissance experts in every color discipline go through a similar light bulb moment at an early stage of their education and become aware of the wide range of factors contributing to color appearance as a result many come to think of the color of the object as meaning not simply the object color as described here but the total color of appearance of the object including the color variations of the light reflected from different areas of the object by this view brightness and colorfulness are included as attributes of the color of the object this makes the relationship of this color of the object to spectral properties complex and indirect which may contribute to the confusion about what colors are the color of the object in this expanded sense does not exhibit constancy that at different intensities of the same illumination and so the whole concept of color constancy may be rejected or restricted to the weaker constancy exhibited by objects under spectrally different illumination the color of the object in this expanded sense can be Quantified by the values of the pixels in a photograph of the object and there have been some attempts recently to investigate object color perception by statis iCal analysis of cab values from photos but we should remember that a photograph is a physical artifact created by a photographer using settings chosen according to the purpose of the photograph if the primary aim of the photographer is to accurately depict the colors of an object she will choose a white balance that makes the illumination appear neutral which results in pixels depicting the object exhibiting much the same Hue as the object but usually usually a substantial range of lightness and chroma to depict the object under different levels of the Illumination in addition with the same aim the photographer will tend to choose an exposure such that the lightest pixels in the Hue series match the lightness of the object or are perhaps just slightly darker to allow some head room for specular highlights it seems to me that the results reported from these studies tell us properties of a well exposed photograph rather than properties of color vision what we need to know is how the light from an object is anchored to a particular object color reflectance when we don't have the exposure chosen by the photographer doing that for us returning to our different audiences it can take another light bulb moment to realize that this second Viewpoint has lost sight of the idea usually evident to the color novice that we we perceive objects as having a relatively stable color belonging to them this third Viewpoint recognizes that the total color appearance of an object is layered and consists of superimposed perceptions of at least object color and illumination color this object color is the way in which we perceive the spectral properties of the object its spectral reflectance and this illumination color is the way in which we perceive the spectral properties of the illumination its intensity and spectral composition and it's this object color that we perceive through the illumination that exhibits a high degree of color constancy under different intensities of the same illumination along with generally weaker constancy under spectrally different illumination sometimes if a student tells me in class that they confused I begin my answer by saying don't worry you were probably confused before you just didn't know it I hope that by understanding that we can mean quite different things by such deceptively simple Expressions as the color of the object and color constancy it may help us to negotiate some of the unrecognized confusions that plague our discussions about color I said at the start that as mortal objects the colors we mainly notice are those of other objects and because of this the attributes of object colors are far more familiar than the attributes of colors of light and most color Educators pass on the idea that there are just three attributes of color the solution is to begin color education with perception through eye opening exercises like those of the color literacy project that address how our perception of the world involves colors of light both light reaching our eyes and light falling on objects as well as colors of objects
Bujack — The Geometry of Color in a Non-Riemannian Space
Roxana Bujack (Los Alamos National Laboratory) and colleagues resolve a ~100-year-old gap in Erwin Schrödinger's 1920s theory of color perception: they define the neutral (grayscale) axis purely from the geometry of the color metric itself, and show that hue, saturation, and lightness arise from the intrinsic geometry of color space — not from external cultural or perceptual constructs layered on top.
This is the follow-up to Bujack et al.'s 2022 finding that *perceptual color space is not Riemannian — the standard assumption (going back to Helmholtz, Schrödinger, and used in every ΔE color-difference metric) that color distances behave like a smooth Riemannian manifold is wrong, because of diminishing returns: the perceived difference of a large color jump is less* than the sum of its small steps, which a Riemannian metric cannot represent.
- Lead: Roxana Bujack — Los Alamos National Laboratory
- Co-authors: Emily N. Stark, Terece L. Turton, Jonah M. Miller, David H. Rogers
- Paper: "The Geometry of Color in the Light of a Non-Riemannian Space," *Computer Graphics
Forum* (Eurographics Conference on Visualization / EuroVis), 2025-05-23. DOI: 10.1111/cgf.70136
- 2022 precursor: "The non-Riemannian nature of perceptual color space," PNAS (2022).
- Press: SciTechDaily / Los Alamos National Laboratory, 2026-05-10 —
<https://scitechdaily.com/scientists-solve-100-year-old-schrodinger-mystery-about-color-perception/>
The Core Findings
1. Color space is non-Riemannian (2022)
The classical model treats color difference as a Riemannian metric: total distance along a path = sum of infinitesimal steps. Empirically that overestimates large differences. Human vision shows diminishing returns — a big perceptual gap reads as smaller than the accumulated small steps that span it. A Riemannian geometry can't encode this; you need a more general (non-Riemannian) structure. Consequence: ΔE-style metrics (CIE76, CIE94, CIEDE2000) are built on an assumption that doesn't hold for large differences.
2. The neutral axis falls out of the geometry (2025)
Schrödinger could describe the geometry of color but couldn't formally pin down where the grayscale axis lives from first principles. Bujack et al. derive the black→white neutral line from the color metric alone, then show hue, saturation, and lightness as intrinsic geometric properties of that metric:
"These color qualities don't emerge from additional external constructs … but reflect the
intrinsic properties of the color metric itself." — Roxana Bujack
3. Geodesics explain the Bezold–Brücke effect
Using shortest-path (geodesic) calculations through perceptual color space in the non-Riemannian framework, they account for the Bezold–Brücke effect — perceived hue shifts as light intensity changes (most hues drift toward yellow or blue as they get brighter) — and for the diminishing-returns behavior of color distinction.
Why It Matters
- Foundational, not cosmetic. This challenges the metric assumption under every perceptual
color-difference formula. "Use OKLAB / CIEDE2000 for ΔE" is still the right practical advice, but be aware the underlying geometry is an approximation that breaks down for large jumps.
- Pairs with the empirical work. Sits alongside MacAdam ellipses
(CIE 1931 isn't uniform) and Koenderink's 3D metric field (dense empirical discrimination across RGB) — three converging lines that perceptual color space is lumpier and less well-behaved than the textbook smooth-manifold picture.
- Derivation over convention. Lightness/hue/saturation being derivable from the metric,
rather than imposed, is the same spirit as preferring computed/semantic color decisions over hand-picked literals — the structure should fall out of the constraints.
Links
- Press article: <https://scitechdaily.com/scientists-solve-100-year-old-schrodinger-mystery-about-color-perception/>
- 2025 CGF paper (DOI): <https://doi.org/10.1111/cgf.70136>
- 2022 PNAS paper (DOI): <https://doi.org/10.1073/pnas.2119753119>
CIE 1931 — Standard Observer, XYZ, and Color Matching Functions
Primary Standard Data: CIE 1931 colour-matching functions, 2 degree observer DOI: doi.org/10.25039/CIE.DS.xvudnb9b Background Overview: en.wikipedia.org/wiki/CIE_1931_color_space
What It Is
The foundational colorimetric system behind XYZ, xyY, the standard observer, and nearly every later device-independent color space.
Key Points
- Human color matching is trichromatic. Spectra are projected into three tristimulus values.
- XYZ is device-independent, not perceptually uniform. It is a measurement/reference space, not a design space.
- Y tracks luminance. This is one reason XYZ remains so central.
- The standard observer is an abstraction. It is a model of average human color matching, not a perfect representation of any one human visual system.
- Metamerism is built in. Different spectra can map to the same tristimulus values and therefore match visually under specified conditions.
Why This Matters for the Skill
- Necessary foundation for explaining spectral data, standard illuminants, ICC PCS, Lab, CAMs, and RGB conversion matrices.
- Best starting point when a user asks where XYZ or the chromaticity diagram comes from.
- Helps keep spectral workflows honest: color spaces collapse rich spectra into observer-dependent tristimulus values.
Practical Use
- Use when converting spectral reflectance or SPD data into XYZ.
- Use when explaining standard observer assumptions.
- Use when a user needs the conceptual base layer under modern color libraries.
CIECAM02 — Color Appearance Model
Source: _The CIECAM02 Color Appearance Model_ Authors: Nathan Moroney, Mark D. Fairchild, R. W. G. Hunt, Changjun Li, M. Ronnier Luo, Todd Newman Conference: IS&T/SID Tenth Color Imaging Conference (2002) Repository Record: repository.rit.edu/other/143 PDF Mirror: repository.rit.edu/cgi/viewcontent...
What It Is
The primary CIE paper for CIECAM02, the appearance model that became a major bridge between raw colorimetry and modern perceptual color workflows.
Use the RIT repository links above as the stable citation target. They are preferable to older unofficial mirrors because they preserve the paper metadata and provenance.
Key Points
- Predicts appearance correlates such as lightness, brightness, chroma, colorfulness, and saturation under specified viewing conditions.
- Explicitly models adaptation, luminance level, surround, and white point.
- Useful when a color task is about appearance under conditions, not just distances in a static color space.
- A major predecessor to newer work such as CAM16 and CAM16-UCS.
Why This Matters for the Skill
- Explains why palette analysis tools built on CAM16-UCS are grounded in appearance theory rather than arbitrary geometry.
- Useful when discussing perceptual hue angles, viewing-condition shifts, and appearance-preserving transforms.
- Helps distinguish cases where OKLCH is a practical working space from cases where an appearance model is the right conceptual tool.
Practical Use
- Use for cross-illuminant appearance prediction.
- Use for research-backed explanation of CAM-based tools.
- Use when the user needs the direct source behind CAM02 terminology.
Links Colour Online A collection of about 500 colour-related links on topics comprising Basic Colour Attributes, The Physical Basis of Colour, Colour Vision, Light Mixing Processes, Colorants and Colorant Mixing, Colour Order Systems, Digital Colour Technology, Colour in Art and Design, History of Colour Studies, Colour Education and Further Information . https://sites.google.com/site/djcbriggs/colour-online The Colour Classes (now online!) https://sites.google.com/site/djcbriggs/tmct Index of publicly available works http://www.huevaluechroma.com/1114.php
Related skills
How it compares
Use color-expert for deep color theory and accessibility reasoning; use token-generator tools when you only need to export Figma variables to code.
FAQ
What does color-expert do?
Use when working with color naming, color theory, color spaces, color definitions, or any task involving color knowledge - palettes, ramps, gradients, conversions,.
When should I use color-expert?
User 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 termino
Is color-expert safe to install?
Review the Security Audits panel on this page before installing in production.