#36AFE3 - #C5E8F7 | 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 #36AFE3 to #C5E8F7

#36AFE3 #C5E8F7

Calculate the color between two colors, #36AFE3 and #C5E8F7. 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)

#36AFE3 - #C5E8F7 | 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 #36AFE3 as 0% and #C5E8F7 as 100%.

0.0%	0.0% #36AFE3	RGB 54 175 227	#36AFE3
16.7%	16.7% #4DB8E6	RGB 77 184 230	#4DB8E6
33.3%	33.3% #65C2E9	RGB 101 194 233	#65C2E9
50.0%	50.0% #7DCBED	RGB 125 203 237	#7DCBED
66.7%	66.7% #95D5F0	RGB 149 213 240	#95D5F0
83.3%	83.3% #ADDEF3	RGB 173 222 243	#ADDEF3
100.0%	100.0% #C5E8F7	RGB 197 232 247	#C5E8F7

#36AFE3 #4DB8E6 #65C2E9 #7DCBED #95D5F0 #ADDEF3 #C5E8F7

#36AFE3 - #C5E8F7

HSV Blend

#36AFE3 - #C5E8F7 | 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 #36AFE3 as 0% and #C5E8F7 as 100%.

0.0%	0.0% #36AFE3	RGB 54 175 227	#36AFE3
16.7%	16.7% #4CB8E6	RGB 76 184 230	#4CB8E6
33.3%	33.3% #63C1E9	RGB 99 193 233	#63C1E9
50.0%	50.0% #7ACAED	RGB 122 202 237	#7ACAED
66.7%	66.7% #92D4F0	RGB 146 212 240	#92D4F0
83.3%	83.3% #ABDEF3	RGB 171 222 243	#ABDEF3
100.0%	100.0% #C5E8F7	RGB 197 232 247	#C5E8F7

#36AFE3 #4CB8E6 #63C1E9 #7ACAED #92D4F0 #ABDEF3 #C5E8F7

#36AFE3 - #7ACAED - #C5E8F7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #36AFE3 0%, #7ACAED 50%, #C5E8F7 100%);
    background: -webkit-linear-gradient(top, #36AFE3 0%, #7ACAED 50%, #C5E8F7 100%);
    background: linear-gradient(to bottom, #36AFE3 0%, #7ACAED 50%, #C5E8F7 100%);
}
</style>