Interactive color workshop

Mix between the names.

Begin with the eight family anchors, choose Light, Core, or Dark, and watch the continuous color space appear between them. Compare three mixing methods and see where the result lands in the familiar 27-swatch map.

Screen-color mixer—not a simulation of physical paint or pigment.
The mixer

Choose two anchors.

The familiar set uses the curated palette. The matched set holds each role at the same OKLCH lightness across families, making hue comparisons more controlled.

Starting set
Mixing path

Color A

Orange
Amount of Color B 50%

Color B

Blue

Mixed color result

Viewing background
Result
Best text color:

Why three answers?

A mix depends on the path.

sRGB

Directly averages the stored screen values. It is familiar and common, but middle colors can look darker or duller than expected.

Linear light

Converts the screen values back to light intensity before mixing. This is the appropriate path when the goal is additive light.

OKLCH

Moves through a perceptual color space using the shorter hue path. It often preserves a more even visual progression.