#A8CEFC - #2C7CE5 | 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 #A8CEFC to #2C7CE5

#A8CEFC #2C7CE5

Calculate the color between two colors, #A8CEFC and #2C7CE5. 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)

#A8CEFC - #2C7CE5 | 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 #A8CEFC as 0% and #2C7CE5 as 100%.

0.0%	0.0% #A8CEFC	RGB 168 206 252	#A8CEFC
16.7%	16.7% #93C0F8	RGB 147 192 248	#93C0F8
33.3%	33.3% #7EB2F4	RGB 126 178 244	#7EB2F4
50.0%	50.0% #6AA5F0	RGB 106 165 240	#6AA5F0
66.7%	66.7% #5597EC	RGB 85 151 236	#5597EC
83.3%	83.3% #4089E8	RGB 64 137 232	#4089E8
100.0%	100.0% #2C7CE5	RGB 44 124 229	#2C7CE5

#A8CEFC #93C0F8 #7EB2F4 #6AA5F0 #5597EC #4089E8 #2C7CE5

#A8CEFC - #2C7CE5

HSV Blend

#A8CEFC - #2C7CE5 | 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 #A8CEFC as 0% and #2C7CE5 as 100%.

0.0%	0.0% #A8CEFC	RGB 168 206 252	#A8CEFC
16.7%	16.7% #91BFF8	RGB 145 191 248	#91BFF8
33.3%	33.3% #7CB1F4	RGB 124 177 244	#7CB1F4
50.0%	50.0% #67A3F0	RGB 103 163 240	#67A3F0
66.7%	66.7% #5296EC	RGB 82 150 236	#5296EC
83.3%	83.3% #3F89E8	RGB 63 137 232	#3F89E8
100.0%	100.0% #2C7CE5	RGB 44 124 229	#2C7CE5

#A8CEFC #91BFF8 #7CB1F4 #67A3F0 #5296EC #3F89E8 #2C7CE5

#A8CEFC - #67A3F0 - #2C7CE5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8CEFC 0%, #67A3F0 50%, #2C7CE5 100%);
    background: -webkit-linear-gradient(top, #A8CEFC 0%, #67A3F0 50%, #2C7CE5 100%);
    background: linear-gradient(to bottom, #A8CEFC 0%, #67A3F0 50%, #2C7CE5 100%);
}
</style>