#CAE2FD - #6D9AD3 | 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 #CAE2FD to #6D9AD3

#CAE2FD #6D9AD3

Calculate the color between two colors, #CAE2FD and #6D9AD3. 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)

#CAE2FD - #6D9AD3 | 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 #CAE2FD as 0% and #6D9AD3 as 100%.

0.0%	0.0% #CAE2FD	RGB 202 226 253	#CAE2FD
16.7%	16.7% #BAD6F6	RGB 186 214 246	#BAD6F6
33.3%	33.3% #ABCAEF	RGB 171 202 239	#ABCAEF
50.0%	50.0% #9BBEE8	RGB 155 190 232	#9BBEE8
66.7%	66.7% #8CB2E1	RGB 140 178 225	#8CB2E1
83.3%	83.3% #7CA6DA	RGB 124 166 218	#7CA6DA
100.0%	100.0% #6D9AD3	RGB 109 154 211	#6D9AD3

#CAE2FD #BAD6F6 #ABCAEF #9BBEE8 #8CB2E1 #7CA6DA #6D9AD3

#CAE2FD - #6D9AD3

HSV Blend

#CAE2FD - #6D9AD3 | 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 #CAE2FD as 0% and #6D9AD3 as 100%.

0.0%	0.0% #CAE2FD	RGB 202 226 253	#CAE2FD
16.7%	16.7% #B8D5F6	RGB 184 213 246	#B8D5F6
33.3%	33.3% #A8C8EF	RGB 168 200 239	#A8C8EF
50.0%	50.0% #98BCE8	RGB 152 188 232	#98BCE8
66.7%	66.7% #89B0E1	RGB 137 176 225	#89B0E1
83.3%	83.3% #7AA5DA	RGB 122 165 218	#7AA5DA
100.0%	100.0% #6D9AD3	RGB 109 154 211	#6D9AD3

#CAE2FD #B8D5F6 #A8C8EF #98BCE8 #89B0E1 #7AA5DA #6D9AD3

#CAE2FD - #98BCE8 - #6D9AD3

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CAE2FD 0%, #98BCE8 50%, #6D9AD3 100%);
    background: -webkit-linear-gradient(top, #CAE2FD 0%, #98BCE8 50%, #6D9AD3 100%);
    background: linear-gradient(to bottom, #CAE2FD 0%, #98BCE8 50%, #6D9AD3 100%);
}
</style>