#C0ECFF - #52A5E2 | 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 #C0ECFF to #52A5E2

#C0ECFF #52A5E2

Calculate the color between two colors, #C0ECFF and #52A5E2. 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)

#C0ECFF - #52A5E2 | 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 #C0ECFF as 0% and #52A5E2 as 100%.

0.0%	0.0% #C0ECFF	RGB 192 236 255	#C0ECFF
16.7%	16.7% #ADE0FA	RGB 173 224 250	#ADE0FA
33.3%	33.3% #9BD4F5	RGB 155 212 245	#9BD4F5
50.0%	50.0% #89C8F0	RGB 137 200 240	#89C8F0
66.7%	66.7% #76BCEB	RGB 118 188 235	#76BCEB
83.3%	83.3% #64B0E6	RGB 100 176 230	#64B0E6
100.0%	100.0% #52A5E2	RGB 82 165 226	#52A5E2

#C0ECFF #ADE0FA #9BD4F5 #89C8F0 #76BCEB #64B0E6 #52A5E2

#C0ECFF - #52A5E2

HSV Blend

#C0ECFF - #52A5E2 | 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 #C0ECFF as 0% and #52A5E2 as 100%.

0.0%	0.0% #C0ECFF	RGB 192 236 255	#C0ECFF
16.7%	16.7% #ACE1FA	RGB 172 225 250	#ACE1FA
33.3%	33.3% #98D5F5	RGB 152 213 245	#98D5F5
50.0%	50.0% #86C9F0	RGB 134 201 240	#86C9F0
66.7%	66.7% #74BDEB	RGB 116 189 235	#74BDEB
83.3%	83.3% #62B1E6	RGB 98 177 230	#62B1E6
100.0%	100.0% #52A5E2	RGB 82 165 226	#52A5E2

#C0ECFF #ACE1FA #98D5F5 #86C9F0 #74BDEB #62B1E6 #52A5E2

#C0ECFF - #86C9F0 - #52A5E2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #C0ECFF 0%, #86C9F0 50%, #52A5E2 100%);
    background: -webkit-linear-gradient(top, #C0ECFF 0%, #86C9F0 50%, #52A5E2 100%);
    background: linear-gradient(to bottom, #C0ECFF 0%, #86C9F0 50%, #52A5E2 100%);
}
</style>