#8c443c
#e78c70
#f2a285
#d3e4df
#0ca38b
Maple
#8c443c
#e78c70
#f2a285
#d3e4df
#0ca38b
Actions
Explore the palette in different formats, and actions.
Colors overview
Brown
Green
Orange
Color | HEX | RGB | HSL | OKLAB HDR | OKLCH HDR | P3 HDR | Actions |
---|---|---|---|---|---|---|---|
| #8c443c | rgb(140, 68, 60) | hsl(6 40% 39%) | oklab(48% 0.09 0.05) | oklch(48% 0.1 28) | color(display-p3 0.51 0.28 0.25) | |
| #e78c70 | rgb(231, 140, 112) | hsl(14 71% 67%) | oklab(73% 0.09 0.07) | oklch(73% 0.12 38) | color(display-p3 0.86 0.57 0.46) | |
| #f2a285 | rgb(242, 162, 133) | hsl(16 81% 74%) | oklab(78% 0.08 0.07) | oklch(78% 0.1 41) | color(display-p3 0.9 0.65 0.54) | |
| #d3e4df | rgb(211, 228, 223) | hsl(160 24% 86%) | oklab(90% -0.02 0) | oklch(90% 0.02 180) | color(display-p3 0.84 0.89 0.88) | |
| #0ca38b | rgb(12, 163, 139) | hsl(170 86% 34%) | oklab(64% -0.12 0.01) | oklch(64% 0.12 180) | color(display-p3 0.29 0.63 0.55) |
Click on a color value to copy it to your clipboard.
Contrast ratios checker
Click one color card to view the complete contrast checker tests.
#8c443c
AA - 6.98
#e78c70
AA - 2.5
#f2a285
AA - 2.04
#d3e4df
AA - 1.31
#0ca38b
AA - 3.16
Color blindness
The simulation of color blindness may not be 100% accurate sometimes.
Colors preview as gradient with protanopia
Colors preview as palette with protanopia
UI components preview
Preview the gradient in different UI components.
PWA prompt