Orange
Web code
Get CSS, SCSS, & Tailwind code for development
App tokens
Get Android, Flutter, Swift, & MAUI tokens
HDR gradient
Switch to HDR to enhance the gradient
Quick view
Inspect colors in multiple color spaces
Colors overview
Orange
Color | HEX | RGB | HSL | HWB | LCH | LAB | CMYK | Color schemes |
---|---|---|---|---|---|---|---|---|
| #caac6a | rgb(202, 172, 106) | hsl(41 48% 60%) | hwb(41 42% 21%) | lch(72 38.4 82.6) | lab(72 4.97 38) | cmyk 0%, 15%, 48%, 21% | |
| #d48d1c | rgb(212, 141, 28) | hsl(37 77% 47%) | hwb(37 11% 17%) | lch(64.8 68 71.3) | lab(64.8 21.8 64.4) | cmyk 0%, 33%, 87%, 17% | |
| #d05f1e | rgb(208, 95, 30) | hsl(22 75% 47%) | hwb(22 12% 18%) | lch(54.4 70.5 52.2) | lab(54.4 43.2 55.7) | cmyk 0%, 54%, 86%, 18% |
Click a color format to copy to your clipboard.
Contrast ratios checker
Click one color card to view the complete contrast checker tests.
#caac6a
AA - 2.18
#d48d1c
AA - 2.75
#d05f1e
AA - 3.93
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.
32°
CPU
48°
GPU
100%
Usage
11°
Rain
70%
Storage
PWA prompt