#CAD8F9 - #D3ECF0 | 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 #CAD8F9 to #D3ECF0

#CAD8F9 #D3ECF0

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

#CAD8F9 - #D3ECF0 | 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 #CAD8F9 as 0% and #D3ECF0 as 100%.

0.0%	0.0% #CAD8F9	RGB 202 216 249	#CAD8F9
16.7%	16.7% #CBDBF7	RGB 203 219 247	#CBDBF7
33.3%	33.3% #CDDEF6	RGB 205 222 246	#CDDEF6
50.0%	50.0% #CEE2F4	RGB 206 226 244	#CEE2F4
66.7%	66.7% #D0E5F3	RGB 208 229 243	#D0E5F3
83.3%	83.3% #D1E8F1	RGB 209 232 241	#D1E8F1
100.0%	100.0% #D3ECF0	RGB 211 236 240	#D3ECF0

#CAD8F9 #CBDBF7 #CDDEF6 #CEE2F4 #D0E5F3 #D1E8F1 #D3ECF0

#CAD8F9 - #D3ECF0

HSV Blend

#CAD8F9 - #D3ECF0 | 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 #CAD8F9 as 0% and #D3ECF0 as 100%.

0.0%	0.0% #CAD8F9	RGB 202 216 249	#CAD8F9
16.7%	16.7% #CBDCF7	RGB 203 220 247	#CBDCF7
33.3%	33.3% #CDE0F6	RGB 205 224 246	#CDE0F6
50.0%	50.0% #CEE4F4	RGB 206 228 244	#CEE4F4
66.7%	66.7% #D0E7F3	RGB 208 231 243	#D0E7F3
83.3%	83.3% #D1EAF1	RGB 209 234 241	#D1EAF1
100.0%	100.0% #D3ECF0	RGB 211 236 240	#D3ECF0

#CAD8F9 #CBDCF7 #CDE0F6 #CEE4F4 #D0E7F3 #D1EAF1 #D3ECF0

#CAD8F9 - #CEE4F4 - #D3ECF0

CSS codes

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

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