Village Color Palette

#314974

#69985E

#E2A350

#F4C14A

#FEF6F3

#314974

#69985E

#E2A350

#F4C14A

#FEF6F3

Colors overview

Blue

Green

Yellow

Orange

White

Color	HEX	RGB	HSL	HWB	LCH	LAB	CMYK
	#314974	rgb(49, 73, 116)	hsl(220 41% 32%)	hwb(220 19% 55%)	lch(30.7 28 273)	lab(30.7 1.26 -28)	cmyk 58%, 37%, 0%, 55%
	#69985e	rgb(105, 152, 94)	hsl(110 24% 48%)	hwb(110 37% 40%)	lch(58.3 35.7 135)	lab(58.3 -25.2 25.3)	cmyk 31%, 0%, 38%, 40%
	#e2a350	rgb(226, 163, 80)	hsl(34 72% 60%)	hwb(34 31% 11%)	lch(72 54.7 70.7)	lab(72 18.1 51.6)	cmyk 0%, 28%, 65%, 11%
	#f4c14a	rgb(244, 193, 74)	hsl(42 89% 62%)	hwb(42 29% 4.3%)	lch(81.2 65.2 80.9)	lab(81.2 10.3 64.4)	cmyk 0%, 21%, 70%, 4%
	#fef6f3	rgb(254, 246, 243)	hsl(16 85% 97%)	hwb(16 95% 0.39%)	lch(97.5 3.42 45.7)	lab(97.5 2.38 2.45)	cmyk 0%, 3%, 4%, 0%

 Click a color format to copy to your clipboard.

Contrast ratios checker

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

#314974

AAA - 8.99



#69985E

AA - 3.35



#E2A350

AA - 2.19



#F4C14A

AA - 1.67



#FEF6F3

AA - 1.06



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 space

HDR oklab colors New



background: linear-gradient(45deg, oklab(40.7% -0.012 -0.078), oklab(63.1% -0.075 0.064), oklab(76% 0.039 0.118), oklab(83.6% 0.012 0.144), oklab(97.9% 0.007 0.006))

Fallback colors New



background: linear-gradient(45deg, #314974, #69985E, #E2A350, #F4C14A, #FEF6F3)

Colors



<resources>
    <color name="village_100">#314974</color>
    <color name="village_200">#69985E</color>
    <color name="village_300">#E2A350</color>
    <color name="village_400">#F4C14A</color>
    <color name="village_500">#FEF6F3</color>
</resources>

PWA prompt