#686cf2
#9496ff
#dbdbf4
#f0f1ff
#f2b408
Cornflower
#686cf2
#9496ff
#dbdbf4
#f0f1ff
#f2b408
Actions
Explore the palette in different formats, and actions.
Colors overview
Blue
Yellow
Color | HEX | RGB | HSL | OKLAB HDR | OKLCH HDR | P3 HDR | Actions |
---|---|---|---|---|---|---|---|
| #686cf2 | rgb(104, 108, 242) | hsl(240 84% 68%) | oklab(60% 0.03 -0.2) | oklch(60% 0.2 280) | color(display-p3 0.41 0.42 0.92) | |
| #9496ff | rgb(148, 150, 255) | hsl(240 100% 79%) | oklab(72% 0.03 -0.15) | oklch(72% 0.15 280) | color(display-p3 0.58 0.59 0.97) | |
| #dbdbf4 | rgb(219, 219, 244) | hsl(240 53% 91%) | oklab(90% 0.01 -0.03) | oklch(90% 0.03 290) | color(display-p3 0.86 0.86 0.95) | |
| #f0f1ff | rgb(240, 241, 255) | hsl(240 100% 97%) | oklab(96% 0 -0.02) | oklch(96% 0.02 280) | color(display-p3 0.94 0.94 1) | |
| #f2b408 | rgb(242, 180, 8) | hsl(44 94% 49%) | oklab(81% 0.02 0.16) | oklch(81% 0.16 83) | color(display-p3 0.91 0.72 0.25) |
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.
#686cf2
AA - 4.18
#9496ff
AA - 2.6
#dbdbf4
AA - 1.35
#f0f1ff
AA - 1.12
#f2b408
AA - 1.85
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