Color glossary

Every color word Tinta uses, explained without jargon. Look for the next to a term on any page for the short version.

Color codes

HEX code: A six-character code for a color, like #82AAF2. Each pair is the amount of red, green and blue, from 00 to FF. It is the most common way to write a color on the web and in design tools. #FFFFFF is white and #000000 is black.
RGB: A color written as three numbers from 0 to 255 for red, green and blue light — rgb(130, 170, 242).
HSL: Hue, saturation, lightness: the color angle on a color wheel (0–360°), how vivid it is, and how light it is.
OKLCH: A modern way to describe color by lightness, chroma (vividness) and hue that matches how people see. Equal steps look equally different. Tinta uses it behind the scenes for shade scales, color groups and smooth gradients.

Contrast ratio: How different two colors are in brightness, from 1:1 (identical) to 21:1 (black on white). Higher is easier to read.
WCAG: The Web Content Accessibility Guidelines — the international rules for making websites usable by everyone, including people with low vision.
AA: The level most websites aim for: normal text needs at least 4.5:1 contrast with its background.
AAA: The strictest level: normal text needs at least 7:1. Comfortable for almost everyone, including older readers.
AA large text (AA18): Big text (about 24px, or 19px bold) is easier to read, so 3:1 is enough for it. Never use 3:1 for small text.

Protanopia: Red-blindness: the red-sensing cones do not work. Reds look dark and brownish, and red and green are hard to tell apart.
Deuteranopia: Green-blindness, the most common kind (about 1 in 16 men). Red, orange, yellow and green can look like the same muddy color.
Tritanopia: Blue-blindness, which is rare. Blue and green look alike, and yellow can look pink or grey.
Monochromacy: Seeing no color at all, only light and dark. A palette still works if its colors differ in lightness.

Color harmony: A rule for choosing colors that look good together, based on where they sit on the color wheel. Tinta builds the rest of a palette from your first color.
Analogous: Neighbours on the color wheel, like blue, teal and green. Calm and natural.
Complementary: Opposites on the color wheel, like blue and orange. Strong contrast — great for one bold accent.
Split complementary: One color plus the two neighbours of its opposite. Lively like complementary, but easier to balance.
Triadic: Three colors evenly spaced around the wheel, like red, yellow and blue. Bright and playful.
Tetradic: Four colors in two opposite pairs. Rich, but let one color lead or it gets busy.
Mono (monochromatic): One hue in different lightnesses, like light, mid and dark blue. Always harmonious.

Gradient: A smooth blend from one color to another. Linear goes in a straight line, radial outward from a center, conic around a point.
Mesh gradient: Several soft color blobs blended together, like a blurry watercolor. Tinta makes them in plain CSS, no images.
Tint and shade scale: Lighter (tint) and darker (shade) versions of one color, numbered 50 (lightest) to 950 (darkest), like Tailwind uses.
Design token: A named color for a job — background, text, primary — instead of a raw code. Change the token once and the whole design follows.