#2e2c1d

#b49f74

#c4c8b1

#e9e6d3

#3f695f

Ocean Cliff

#2e2c1d

#b49f74

#c4c8b1

#e9e6d3

#3f695f



Web code

Get CSS, SCSS, & Tailwind code for development



App tokens

Get Android, Flutter, Swift, & MAUI tokens



Quick view

Inspect colors in multiple color spaces

Colors overview

Brown

Grey

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#2e2c1d	rgb(46, 44, 29)	hsl(53 23% 15%)	hwb(53 11% 82%)	lch(17.9 10.2 97.1)	lab(17.9 -1.27 10.1)	cmyk 0%, 4%, 37%, 82%
	#b49f74	rgb(180, 159, 116)	hsl(40 30% 58%)	hwb(40 45% 29%)	lch(66.6 25.7 82.6)	lab(66.6 3.29 25.5)	cmyk 0%, 12%, 36%, 29%
	#c4c8b1	rgb(196, 200, 177)	hsl(70 17% 74%)	hwb(70 69% 22%)	lch(79.8 11.9 112)	lab(79.8 -4.44 11.1)	cmyk 2%, 0%, 12%, 22%
	#e9e6d3	rgb(233, 230, 211)	hsl(52 33% 87%)	hwb(52 83% 8.6%)	lch(91.1 9.77 97.9)	lab(91.1 -1.35 9.67)	cmyk 0%, 1%, 9%, 9%
	#3f695f	rgb(63, 105, 95)	hsl(170 25% 33%)	hwb(170 25% 59%)	lch(41.1 17.3 177)	lab(41.1 -17.3 0.767)	cmyk 40%, 0%, 10%, 59%

 Click a color format to copy to your clipboard.

Contrast ratios checker

Click one color card to view the complete contrast checker tests.

#2e2c1d

AAA - 14.05



#b49f74

AA - 2.57



#c4c8b1

AA - 1.71



#e9e6d3

AA - 1.25



#3f695f

AA - 6.18



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.

HDR color space

HDR oklab colors



background: linear-gradient(45deg, oklab(29.1% -0.005 0.025), oklab(71% 0.006 0.063), oklab(82.3% -0.013 0.029), oklab(92.2% -0.004 0.025), oklab(48.7% -0.05 0.002))

Fallback colors



background: linear-gradient(45deg, #2e2c1d, #b49f74, #c4c8b1, #e9e6d3, #3f695f)

Colors



<!-- Primary Colors -->
<color name="ocean_cliff_color_10">#2e2c1d</color>
<color name="ocean_cliff_color_20">#b49f74</color>
<color name="ocean_cliff_color_30">#c4c8b1</color>
<color name="ocean_cliff_color_40">#e9e6d3</color>
<color name="ocean_cliff_color_50">#3f695f</color>

PWA prompt