#A8CCEA - #4D7EB7 | 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 #A8CCEA to #4D7EB7

#A8CCEA #4D7EB7

Calculate the color between two colors, #A8CCEA and #4D7EB7. 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)

#A8CCEA - #4D7EB7 | 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 #A8CCEA as 0% and #4D7EB7 as 100%.

0.0%	0.0% #A8CCEA	RGB 168 204 234	#A8CCEA
16.7%	16.7% #98BFE1	RGB 152 191 225	#98BFE1
33.3%	33.3% #89B2D9	RGB 137 178 217	#89B2D9
50.0%	50.0% #7AA5D0	RGB 122 165 208	#7AA5D0
66.7%	66.7% #6B98C8	RGB 107 152 200	#6B98C8
83.3%	83.3% #5C8BBF	RGB 92 139 191	#5C8BBF
100.0%	100.0% #4D7EB7	RGB 77 126 183	#4D7EB7

#A8CCEA #98BFE1 #89B2D9 #7AA5D0 #6B98C8 #5C8BBF #4D7EB7

#A8CCEA - #4D7EB7

HSV Blend

#A8CCEA - #4D7EB7 | 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 #A8CCEA as 0% and #4D7EB7 as 100%.

0.0%	0.0% #A8CCEA	RGB 168 204 234	#A8CCEA
16.7%	16.7% #96BEE1	RGB 150 190 225	#96BEE1
33.3%	33.3% #86B1D9	RGB 134 177 217	#86B1D9
50.0%	50.0% #76A3D0	RGB 118 163 208	#76A3D0
66.7%	66.7% #6797C8	RGB 103 151 200	#6797C8
83.3%	83.3% #5A8ABF	RGB 90 138 191	#5A8ABF
100.0%	100.0% #4D7EB7	RGB 77 126 183	#4D7EB7

#A8CCEA #96BEE1 #86B1D9 #76A3D0 #6797C8 #5A8ABF #4D7EB7

#A8CCEA - #76A3D0 - #4D7EB7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8CCEA 0%, #76A3D0 50%, #4D7EB7 100%);
    background: -webkit-linear-gradient(top, #A8CCEA 0%, #76A3D0 50%, #4D7EB7 100%);
    background: linear-gradient(to bottom, #A8CCEA 0%, #76A3D0 50%, #4D7EB7 100%);
}
</style>