#6AC3E5 - #D4EDF7 | 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 #6AC3E5 to #D4EDF7

#6AC3E5 #D4EDF7

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

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

0.0%	0.0% #6AC3E5	RGB 106 195 229	#6AC3E5
16.7%	16.7% #7BCAE8	RGB 123 202 232	#7BCAE8
33.3%	33.3% #8DD1EB	RGB 141 209 235	#8DD1EB
50.0%	50.0% #9FD8EE	RGB 159 216 238	#9FD8EE
66.7%	66.7% #B0DFF1	RGB 176 223 241	#B0DFF1
83.3%	83.3% #C2E6F4	RGB 194 230 244	#C2E6F4
100.0%	100.0% #D4EDF7	RGB 212 237 247	#D4EDF7

#6AC3E5 #7BCAE8 #8DD1EB #9FD8EE #B0DFF1 #C2E6F4 #D4EDF7

#6AC3E5 - #D4EDF7

HSV Blend

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

0.0%	0.0% #6AC3E5	RGB 106 195 229	#6AC3E5
16.7%	16.7% #7AC9E8	RGB 122 201 232	#7AC9E8
33.3%	33.3% #8BD0EB	RGB 139 208 235	#8BD0EB
50.0%	50.0% #9DD7EE	RGB 157 215 238	#9DD7EE
66.7%	66.7% #AFDEF1	RGB 175 222 241	#AFDEF1
83.3%	83.3% #C1E5F4	RGB 193 229 244	#C1E5F4
100.0%	100.0% #D4EDF7	RGB 212 237 247	#D4EDF7

#6AC3E5 #7AC9E8 #8BD0EB #9DD7EE #AFDEF1 #C1E5F4 #D4EDF7

#6AC3E5 - #9DD7EE - #D4EDF7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6AC3E5 0%, #9DD7EE 50%, #D4EDF7 100%);
    background: -webkit-linear-gradient(top, #6AC3E5 0%, #9DD7EE 50%, #D4EDF7 100%);
    background: linear-gradient(to bottom, #6AC3E5 0%, #9DD7EE 50%, #D4EDF7 100%);
}
</style>