Night
A serene and deep gradient that suggests a tranquil night sky.
by Colorffy Team
About
Main Actions
Quick actions
Explore the gradient in different formats, and quick actions.
Colors overview
Comprehensive color information and conversions.
| Color | HEX | RGB | HWB | OKLAB | OKLCH | P3 | Actions |
|---|---|---|---|---|---|---|---|
| | #0d0821 | rgb(5.1% 3.14% 12.9%) | hwb(250 3.1% 87%) | oklab(15.9% 0.016 -0.048) | oklch(15.9% 0.051 289) | color(display-p3 0.048 0.032 0.124) | |
| | #161a30 | rgb(8.63% 10.2% 18.8%) | hwb(230 8.6% 81%) | oklab(22.6% 0.003 -0.043) | oklch(22.6% 0.043 275) | color(display-p3 0.089 0.101 0.182) | |
| | #172a47 | rgb(9.02% 16.5% 27.8%) | hwb(220 9% 72%) | oklab(28.5% -0.012 -0.058) | oklch(28.5% 0.059 259) | color(display-p3 0.107 0.163 0.27) | |
| | #1f3a5b | rgb(12.2% 22.7% 35.7%) | hwb(210 12% 64%) | oklab(34.4% -0.018 -0.065) | oklch(34.4% 0.067 254) | color(display-p3 0.146 0.225 0.347) | |
| | #3f5c7f | rgb(24.7% 36.1% 49.8%) | hwb(210 25% 50%) | oklab(46.7% -0.019 -0.064) | oklch(46.7% 0.067 254) | color(display-p3 0.271 0.358 0.487) |
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
Large Pass
Fail
#0D0821
AAA - 19.55
Lc -108
#161A30
AAA - 17.14
Lc -106
#172A47
AAA - 14.39
Lc -104
#1F3A5B
AAA - 11.57
Lc -100
#3F5C7F
AA - 6.88
Lc -89
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.