Sensor Render color palette

Sensor Render is a 4-color palette drawing on blues, teals and cyans and neutrals. In OKLCH its lightness runs from 22% (#121A33, very dark) to 95% (#E6EDFF, very light), and its most saturated color, #4DA3FF, is vivid. 3 of its 3 chromatic colors sit on the cool side of the hue wheel. 3 of its 6 color pairs reach the WCAG AA ratio of 4.5:1 for body text. It is tagged tech, blue and cold.

TechBlueCold

Color codes

ColorHEXRGBHSLOKLCH
Rich Black #121A33 rgb(18, 26, 51) hsl(225, 48%, 14%) oklch(22.5% 0.05 268.8)
Chefchaouen Blue #4DA3FF rgb(77, 163, 255) hsl(211, 100%, 65%) oklch(70.5% 0.159 252.4)
Diamond #8AF3FF rgb(138, 243, 255) hsl(186, 100%, 77%) oklch(90.5% 0.099 205.1)
Gainsboro #E6EDFF rgb(230, 237, 255) hsl(223, 100%, 95%) oklch(94.6% 0.025 268.8)

Accessibility

The best text and background pairs in Sensor Render, by WCAG 2 contrast ratio, with the APCA lightness contrast (Lc) of the text on its background.

PairWCAG 2LevelAPCA Lc
#E6EDFF on #121A33 14.67:1 AAA Lc -94.5
#8AF3FF on #121A33 13.38:1 AAA Lc -88.3
#121A33 on #4DA3FF 6.55:1 AA Lc 51.1

Color vision

1 pair of colors come within ΔE 0.06 of each other under at least one simulation.

  • Protanopia

  • Deuteranopia

  • Tritanopia

  • Achromatopsia

Use it in code

Install these colors as Tailwind CSS v4 theme colors with shadcn: npx shadcn@latest add https://getcolors.so/r/palette/121a33-4da3ff-8af3ff-e6edff.json.

Make it your own

Edit the colors, build a full light and dark color system from them, or see them on real UI.

Gradients from these colors