Technical Formats

Professional color models, one click away.

Explore advanced color space representations and professional color models used in video production, photography, scientific applications, and color management systems.

Choose a color

Pick a color, or type any code (HEX, rgb(), hsl() or a color name). Everything below updates instantly.

Web & screen models

The everyday ways to describe color on a screen.

CIE color spaces

Device-independent models defined by the International Commission on Illumination. They describe color the way a standard observer sees it.

Modern perceptual spaces

Spaces designed so that equal numeric steps look like equal steps to the eye.

Video & broadcast

Luma and chroma models used in video, television and image compression.

Wide-gamut & linear RGB

Larger color ranges used by modern displays, photography and film.

Technical Formats

Explore advanced color space representations and professional color models used in video production, photography, scientific applications, and color management systems. These technical formats provide precise color specifications for specialized industries and applications.

Why Use Technical Formats

Different color spaces are optimized for specific purposes - from accurate color reproduction to efficient data compression.

Industry Standards

Professional workflows require specific color formats for consistency across devices and media.

How to use this tool (step by step)

Small steps, each with the reason behind it. Perfect for beginners, and a handy checklist for experts.

  1. Choose your color

    • Press the color square or type a code in the box at the top.
    • You can type HEX, rgb(), hsl() or a color name like coral.
    • Watch the large swatch change.

    Why we do this: All the technical values below describe this one color, so you must start by choosing it.

  2. Find the format you need

    • Scroll through the groups: Web, CIE, Perceptual, Video and Wide-gamut.
    • Each card shows the name, the value and what it is used for.
    • Use the short description to decide which one fits your job.

    Why we do this: Every industry speaks a different color language, and picking the right one avoids wrong colors.

  3. Copy the value

    • Press the copy icon on the card.
    • A message in the corner confirms what was copied.
    • Paste it into your software, spreadsheet or code.

    Why we do this: A copied value can be pasted exactly, with no typing mistakes.

  4. Understand the limits

    • Values are calculated from sRGB (the standard web color space) with the D65 daylight white point.
    • Colors are shown with sensible rounding.
    • For critical print or film work, always confirm with your own color-managed software.

    Why we do this: Knowing the starting assumptions helps you trust the numbers and use them correctly.

Questions people ask

Quick answers.

What is a color space?

A color space is a system for describing colors with numbers. RGB uses amounts of red, green and blue light. CIE Lab uses lightness plus two color axes. The same color has different numbers in each space.

Why are there two Lab values?

Lab depends on a reference white. D65 is average daylight and is used on screens. D50 is the standard for printing and color management (ICC profiles).

What is Oklab and why do designers like it?

Oklab is a modern space where lightness, chroma and hue stay more consistent to the eye, so gradients and color scales look smoother. CSS supports oklab() and oklch().

Will Display P3 values look different from sRGB?

The numbers are the same color, written for a wider range of colors. On a P3 screen CSS color(display-p3 ...) can show the same color; very vivid colors outside sRGB are not part of this input.