Color

Busted

• 60-30-10 ruleA proportion recipe: 60% dominant color, 30% secondary, 10% accent. Stolen from interior design, works fine on screens.
• Accent colorThe one loud color you spend sparingly: buttons, links, the thing you want clicked. Everything else stays quiet so it lands.
• Achromatic paletteA palette with the hue dial turned off: only black, white, and grays, with lightness doing all the separating.
• AnalogousColors pulled from neighboring slices of the wheel. Calm, cohesive, low tension: teal into green into yellow-green.
• Chroma vs saturationChroma is raw colorfulness. Saturation is colorfulness measured against lightness. Same feeling, different yardstick.
• CIELAB / CIELCh(ab)Two views of the same device-independent color space: LAB uses opposing color axes, while LCh turns them into chroma and hue.
• Color harmonyThe rules of thumb for picking colors that look intentional together, mostly based on how far apart their hues sit on the wheel.
• Color interpolation spaceThe color map a gradient uses to find its middle steps, which decides whether the blend stays rich, bends through gray, or changes hue.
• Color palette / color schemeA deliberate, closed set of colors chosen to work together, so every screen pulls from the same short list instead of whatever looked nice that day.
• Color scale (tonal ramp)One color stretched into an ordered ladder of lightness steps (50, 100, 200 ... 900) so the UI has a shade for every job.
• Color temperature (warm / cool)Whether a palette leans orange-red (cozy, human, sunny) or blue-green (calm, clinical, technical). The mood dial of color.
• Color wheelThe ring that arranges hues by angle, so you can find colors that go together by distance: neighbors are calm, opposites fight.
• ColorwayOne named color variant of a design that is otherwise identical: same shoe, same layout, different colors.
• ComplementaryTwo hues sitting straight across the color wheel from each other. Maximum tension, maximum pop: orange and blue, red and green.
• DuotoneA photo's luminance mapped between two ink colors, shadows to highlights, so it lands inside a brand palette with its tones intact.
• Earth tonesThe palette of dirt, clay, and plants: terracotta, ochre, olive, sand, umber. Warm, low-chroma, and grounded.
• Gamut mappingThe rule for pulling impossible colors into a target gamut while preserving the qualities that matter more than raw channel values.
• HDR colorColor that uses an HDR display's brightness above ordinary white, so sunlight, fire, and reflections can look genuinely brighter.
• Hex colorThe #rrggbb code: six hexadecimal digits giving the red, green, and blue amounts of a color, from 00 to ff each.
• HSL / HSV (HSB)Color as three human dials: which hue, how colorful, how light. The sliders behind almost every color picker.
• Hue contrastSeparation made by changing the kind of color while keeping brightness similar, like a red and blue that become the same gray.
• Hue rotation (hue shift)Turning every color the same number of degrees around the color wheel, so the relationships survive and only the mood changes.
• Hue-shifted shadingShading that moves toward cool hues in shadow and warm hues in light, instead of making one base color only darker or lighter.
• Jewel tonesDeep and vivid at the same time: emerald, sapphire, ruby, amethyst. Dark enough to feel rich, saturated enough to still glow.
• Linear-light blendingMixing colors after converting them to real light levels, so a 50% blend, blur, or fade does not come out unexpectedly dark.
• MonochromaticOne hue at many lightness levels. The whole design speaks in a single color's voice, with contrast carried by light versus dark.
• Muted (desaturated) paletteColors with the chroma dialed down so they sit closer to gray: dusty, dry, quietly expensive instead of loud and candy-bright.
• Neon paletteColors cranked so far past normal saturation that they read as light sources instead of surfaces. The highlighter-on-black glow.
• Neutral paletteThe whites, grays, blacks and near-colorless tones that carry most of an interface so the real colors can mean something.
• Off-white / bone / creamA near-white warmed with a trace of beige or yellow, used when pure screen white feels too sharp, cold, or clinical.
• OKLCHA color format with lightness, chroma, and hue dials where the lightness number matches what your eye sees, so steps look evenly spaced.
• Out-of-gamut color / gamut clippingA color the target screen or press cannot make; clipping shoves it onto the gamut boundary and can flatten several distinct colors into one.
• PastelColors with a lot of white in them: high lightness, low chroma. Baby blue, blush, mint. Soft, airy, and almost invisible on white.
• Primary / secondary colorsThe starting colors and the colors made by mixing them in pairs. Which hues count depends on whether you mean paint, light, or ink.
• RGBAdditive color: screens build every color by mixing red, green, and blue light. All three at full blast makes white.
• RYB vs RGB color wheelThe artist's paint wheel and the screen-light wheel order hues differently, so they give different answers for which color is opposite.
• Semantic color rolesNaming a color by the job it does (primary, surface, danger) instead of what it looks like, so themes swap without touching components.
• Sequential / diverging / categorical palettesThree palette jobs for charts: one light-to-dark path for amounts, two paths around a midpoint, or distinct colors for unrelated groups.
• Simultaneous contrastThe same exact color looking lighter, darker, warmer, or cooler because your eye judges it against whatever surrounds it.
• Split-complementaryOne hue plus the two neighbors of its opposite, keeping complementary tension while giving you a gentler and more flexible three-color set.
• sRGBThe default color space of the web: a dependable but limited range that almost every screen, browser, and image tool understands.
• Tetradic (double complementary)Four hues built from two opposite pairs on the color wheel, giving a palette more range without making the choices arbitrary.
• Tint / shade / toneThree ways to vary one hue: add white for a tint, black for a shade, gray for a tone. Lighter, darker, dustier.
• Tinted neutrals (chromatic grays)Grays with a whisper of hue mixed in, so they feel warm or cool instead of flat and dead like default #808080.
• TriadicThree hues spaced evenly around a color wheel, giving a lively palette that feels balanced when one color leads and two support it.
• UndertoneThe quiet warm or cool color hiding inside a neutral, which explains why two perfectly good grays or whites can look wrong together.
• Value contrast (tonal contrast)The lightness gap between elements, hue aside. If the design still reads as a grayscale screenshot, the contrast is real.
• Wide gamut (Display P3)A bigger box of screen colors than sRGB can hold; Display P3 is the common one, and its extra reach shows most in reds, oranges, and greens.

The territory

27 core terms mapped for this field, ranked by how often builders reach for them. Each one is a future entry. Want to bust one? One entry, one file, one pull request.

• Color palette / color schemea deliberate set of colors chosen to work together"my brand colors" · "the set of colors for the site"
• Color scale (tonal ramp)one hue rendered as ordered lightness steps for UI theming"tonal scale" · "the 50 to 900 shades like Tailwind" · "light-to-dark versions of my brand color"
• Semantic color rolesnaming colors by job (primary, surface, danger) not by hue"the primary/secondary/destructive naming" · "colors named by what they do"
• Hex colorsix-digit code specifying an sRGB color, like #1a73e8"the hashtag color code" · "the six-character color"
• RGBadditive red-green-blue model screens use to make color"the red green blue values" · "screen color numbers"
• HSL / HSV (HSB)hue-saturation-lightness dials; intuitive but perceptually uneven"the hue saturation slider thing" · "the color picker dials"
• OKLCHperceptual color space where equal lightness numbers actually look equally bright"the color format where lighter steps look evenly spaced" · "the new CSS color thing"
• Color wheelcircular map of hues showing relationships by angular distance"the circle of colors" · "the color chart designers use"
• Color harmonyprinciples for combining hues into a coherent, intentional scheme"colors that go together" · "which colors match"
• Complementarytwo hues opposite on the wheel; maximum vibration and pop"opposite colors that pop" · "the clashing-on-purpose pair"
• Analogousneighboring hues on the wheel; calm, cohesive, low tension"colors next to each other" · "all in the same family"
• Monochromaticsingle hue varied only by lightness and chroma"all one color, different shades" · "single-color scheme"
• Tint / shade / tonehue plus white, plus black, plus gray respectively"lighter version of the same color" · "dulled-down version"
• Chroma vs saturationchroma is absolute colorfulness; saturation is colorfulness relative to lightness"how intense the color is" · "how far from gray"
• Value contrast (tonal contrast)lightness difference between elements, independent of hue"squint test" · "does it still read in black and white"
• Accent colorsmall-area high-attention hue reserved for actions and highlights"the one pop of color" · "the button color"
• 60-30-10 ruledominant, secondary, accent proportion split across a layout"how much of each color to use" · "the ratio thing"
• Neutral palettewhites, grays, blacks, and low-chroma supporting colors"just grays and beiges" · "the no-color colors"
• Tinted neutrals (chromatic grays)grays pulled slightly toward a hue instead of pure gray"grays that aren't dead gray" · "warm gray, cool gray"
• Color temperature (warm / cool)whether a palette leans toward orange-red or blue-green"cozier colors" · "colder, more clinical colors"
• Muted (desaturated) palettecolors dialed down in chroma for a quiet, expensive feel"dusty colors" · "colors with the volume turned down"
• Pastelhigh-lightness, low-chroma colors; soft and airy"baby colors" · "milky soft colors"
• Jewel tonesdeep, rich, saturated colors: emerald, sapphire, ruby, amethyst"rich luxurious colors" · "dark but vivid"
• Earth tonesmuted browns, ochres, clays, olives, sands"natural organic colors" · "terracotta desert palette"
• Neon paletteextreme-chroma colors that appear to glow against dark backgrounds"fluorescent colors" · "colors that look lit up" · "highlighter colors"
• Hue rotation (hue shift)moving colors around the wheel by degrees, keeping lightness"same palette but shifted toward orange" · "spin the colors"
• Colorwayone named color variant of an otherwise identical design"the same design in different colors" · "color option"

Deeper in the field

• sRGB standard web color space with a comparatively limited gamut
• CIELAB / CIELCh(ab) device-independent spaces underlying most perceptual color math
• Wide gamut (Display P3) color range beyond sRGB; punchier reds and greens on modern screens
• Out-of-gamut color / gamut clipping a color the display or press cannot reproduce, silently flattened
• Gamut mapping rule for pulling impossible colors back into a reproducible range
• Primary / secondary colors base hues and their mixtures within a chosen color model
• RYB vs RGB color wheel artist wheel versus light wheel; they disagree on "opposite"
• Triadic three hues evenly spaced around the wheel; balanced and playful
• Split-complementary one hue plus the two neighbors of its opposite
• Tetradic (double complementary) two complementary pairs forming a rectangle on the wheel
• Hue contrast separation created by differing hues at similar lightness
• Achromatic palette a scheme using only black, white, and grays
• Undertone subtle hue bias affecting how neutrals coordinate
• Off-white / bone / cream warm near-whites that replace harsh pure white
• Simultaneous contrast a color's appearance shifting based on what surrounds it
• Color interpolation space which space a gradient blends through; wrong one creates gray midpoints
• Linear-light blending blending in linear space so mixes and fades don't darken
• Hue-shifted shading shifting shadows toward blue and highlights toward warm instead of just darkening
• Sequential / diverging / categorical palettes the three data-viz palette types for magnitude, deviation, and category
• HDR color colors rendered brighter than paper-white using display headroom