#97dbad
#c3e5ad
#edd987
#f1e1a5
#f4bbbc
Color Palette
Melon
by Colorffy Team
About
Red
Red
Main Actions
#97dbad
#c3e5ad
#edd987
#f1e1a5
#f4bbbc
Quick actions
Explore the palette in different formats, and quick actions.
Colors overview
Comprehensive color information and conversions.
| Color | HEX | RGB | HWB | OKLAB | OKLCH | P3 | Actions |
|---|---|---|---|---|---|---|---|
| | #97dbad | rgb(59.2% 85.9% 67.8%) | hwb(140 59% 14%) | oklab(83.4% -0.085 0.041) | oklch(83.4% 0.094 154) | color(display-p3 0.65 0.852 0.692) | |
| | #c3e5ad | rgb(76.5% 89.8% 67.8%) | hwb(96 68% 10%) | oklab(88.3% -0.057 0.06) | oklch(88.3% 0.083 133) | color(display-p3 0.791 0.894 0.699) | |
| | #edd987 | rgb(92.9% 85.1% 52.9%) | hwb(48 53% 7.1%) | oklab(88.4% -0.011 0.104) | oklch(88.4% 0.105 96.1) | color(display-p3 0.916 0.854 0.571) | |
| | #f1e1a5 | rgb(94.5% 88.2% 64.7%) | hwb(47 65% 5.5%) | oklab(90.9% -0.007 0.079) | oklch(90.9% 0.079 95) | color(display-p3 0.934 0.885 0.674) | |
| | #f4bbbc | rgb(95.7% 73.3% 73.7%) | hwb(360 73% 4.3%) | oklab(84.4% 0.063 0.02) | oklch(84.4% 0.066 17.4) | color(display-p3 0.922 0.742 0.741) |
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.
Contrast Checker Explanations
Live APCA (WCAG 3 draft) and WCAG 2.1 contrast calculations comparing selected text color against surface colors.
Body Pass
Lc ≥ 60 · ≥ 4.5:1
Large Pass
Lc ≥ 45 · ≥ 3.0:1
Fail
Below thresholds
#97dbad
Fail - 1.6
Lc -31
#c3e5ad
Fail - 1.38
Lc -22
#edd987
Fail - 1.41
Lc -23
#f1e1a5
Fail - 1.3
Lc -18
#f4bbbc
Fail - 1.65
Lc -33
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 palette in different UI components.
PWA Prompt