#AFDEE2 - #F3E7E2 | colorate

colorate is a color scheme tool for designers and developers. This will help you draw inspiration and serve as a resource for your color work. Make this site better

Blend #AFDEE2 to #F3E7E2

#AFDEE2 #F3E7E2

Calculate the color between two colors, #AFDEE2 and #F3E7E2. In calculation of RGB values, saturation between the dissimilar colors is low. In calculating of HSV values, saturation between the dissimilar colors is not low.

RGB Blend(Linear)

#AFDEE2 - #F3E7E2 | colorate

Calculation of color between two colors based on RGB value. For colors that are distant from each other, the saturation between the two colors decreases. Expand the color between two colors with #AFDEE2 as 0% and #F3E7E2 as 100%.

0.0%	0.0% #AFDEE2	RGB 175 222 226	#AFDEE2
16.7%	16.7% #BADFE2	RGB 186 223 226	#BADFE2
33.3%	33.3% #C5E1E2	RGB 197 225 226	#C5E1E2
50.0%	50.0% #D1E2E2	RGB 209 226 226	#D1E2E2
66.7%	66.7% #DCE4E2	RGB 220 228 226	#DCE4E2
83.3%	83.3% #E7E5E2	RGB 231 229 226	#E7E5E2
100.0%	100.0% #F3E7E2	RGB 243 231 226	#F3E7E2

#AFDEE2 #BADFE2 #C5E1E2 #D1E2E2 #DCE4E2 #E7E5E2 #F3E7E2

#AFDEE2 - #F3E7E2

HSV Blend

#AFDEE2 - #F3E7E2 | colorate

Calculation of color between two colors based on HSV value. Even between distinct colors of color, the saturation between the two colors does not decrease. Expand the color between two colors with #AFDEE2 as 0% and #F3E7E2 as 100%.

0.0%	0.0% #AFDEE2	RGB 175 222 226	#AFDEE2
16.7%	16.7% #B7E4D3	RGB 183 228 211	#B7E4D3
33.3%	33.3% #BFE7C5	RGB 191 231 197	#BFE7C5
50.0%	50.0% #D2EAC7	RGB 210 234 199	#D2EAC7
66.7%	66.7% #E6EDD0	RGB 230 237 208	#E6EDD0
83.3%	83.3% #F0EAD9	RGB 240 234 217	#F0EAD9
100.0%	100.0% #F3E7E2	RGB 243 231 226	#F3E7E2

#AFDEE2 #B7E4D3 #BFE7C5 #D2EAC7 #E6EDD0 #F0EAD9 #F3E7E2

#AFDEE2 - #D2EAC7 - #F3E7E2

CSS codes

<style type="text/css">
/* RGB Gradient */
div {
    background: -moz-linear-gradient(top, #AFDEE2 0%, #F3E7E2 100%);
    background: -webkit-linear-gradient(top, #AFDEE2 0%, #F3E7E2 100%);
    background: linear-gradient(to bottom, #AFDEE2 0%, #F3E7E2 100%);
}

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFDEE2 0%, #D2EAC7 50%, #F3E7E2 100%);
    background: -webkit-linear-gradient(top, #AFDEE2 0%, #D2EAC7 50%, #F3E7E2 100%);
    background: linear-gradient(to bottom, #AFDEE2 0%, #D2EAC7 50%, #F3E7E2 100%);
}
</style>