#F8FAFF - #AFB5EC | 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 #F8FAFF to #AFB5EC

#F8FAFF #AFB5EC

Calculate the color between two colors, #F8FAFF and #AFB5EC. 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)

#F8FAFF - #AFB5EC | 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 #F8FAFF as 0% and #AFB5EC as 100%.

0.0%	0.0% #F8FAFF	RGB 248 250 255	#F8FAFF
16.7%	16.7% #EBEEFB	RGB 235 238 251	#EBEEFB
33.3%	33.3% #DFE3F8	RGB 223 227 248	#DFE3F8
50.0%	50.0% #D3D7F5	RGB 211 215 245	#D3D7F5
66.7%	66.7% #C7CCF2	RGB 199 204 242	#C7CCF2
83.3%	83.3% #BBC0EF	RGB 187 192 239	#BBC0EF
100.0%	100.0% #AFB5EC	RGB 175 181 236	#AFB5EC

#F8FAFF #EBEEFB #DFE3F8 #D3D7F5 #C7CCF2 #BBC0EF #AFB5EC

#F8FAFF - #AFB5EC

HSV Blend

#F8FAFF - #AFB5EC | 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 #F8FAFF as 0% and #AFB5EC as 100%.

0.0%	0.0% #F8FAFF	RGB 248 250 255	#F8FAFF
16.7%	16.7% #EBEFFB	RGB 235 239 251	#EBEFFB
33.3%	33.3% #DEE4F8	RGB 222 228 248	#DEE4F8
50.0%	50.0% #D2D9F5	RGB 210 217 245	#D2D9F5
66.7%	66.7% #C6CDF2	RGB 198 205 242	#C6CDF2
83.3%	83.3% #BAC1EF	RGB 186 193 239	#BAC1EF
100.0%	100.0% #AFB5EC	RGB 175 181 236	#AFB5EC

#F8FAFF #EBEFFB #DEE4F8 #D2D9F5 #C6CDF2 #BAC1EF #AFB5EC

#F8FAFF - #D2D9F5 - #AFB5EC

CSS codes

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

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