Pretzel Counter color palette

Pretzel Counter is a 5-color palette drawing on reds, browns, oranges and yellows. In OKLCH its lightness runs from 26% (#431015, dark) to 94% (#F2EFC4, very light), and its most saturated color, #B1725C, is moderately saturated. 5 of its 5 chromatic colors sit on the warm side of the hue wheel. 3 of its 10 color pairs reach the WCAG AA ratio of 4.5:1 for body text. It is tagged food, warm, red, yellow, earth tone and colorblind-friendly.

FoodWarmRedYellowEarth toneColorblind-friendly

Color codes

ColorHEXRGBHSLOKLCH
Jet #431015 rgb(67, 16, 21) hsl(354, 61%, 16%) oklch(26.3% 0.078 18.8)
Dark Moss Green #654B12 rgb(101, 75, 18) hsl(41, 70%, 23%) oklch(43% 0.079 82.6)
Tiger's Eye #B1725C rgb(177, 114, 92) hsl(16, 35%, 53%) oklch(61.4% 0.087 40)
Ash Gray #D4B296 rgb(212, 178, 150) hsl(27, 42%, 71%) oklch(78.6% 0.055 61.4)
Champagne #F2EFC4 rgb(242, 239, 196) hsl(56, 64%, 86%) oklch(94.4% 0.056 104.1)

Accessibility

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

PairWCAG 2LevelAPCA Lc
#F2EFC4 on #431015 13.54:1 AAA Lc -93.1
#431015 on #D4B296 8.01:1 AAA Lc 61.9
#F2EFC4 on #654B12 6.98:1 AA Lc -81.0

Color vision

No pair of colors comes within ΔE 0.06 of another under protanopia, deuteranopia, tritanopia or achromatopsia. It is tagged colorblind-friendly: every pair stays at least ΔE 0.14 apart.

  • 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/431015-654b12-b1725c-d4b296-f2efc4.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