#A8CDEF - #4C7FBE | 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 #A8CDEF to #4C7FBE

#A8CDEF #4C7FBE

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

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

0.0%	0.0% #A8CDEF	RGB 168 205 239	#A8CDEF
16.7%	16.7% #98C0E6	RGB 152 192 230	#98C0E6
33.3%	33.3% #89B3DE	RGB 137 179 222	#89B3DE
50.0%	50.0% #7AA6D6	RGB 122 166 214	#7AA6D6
66.7%	66.7% #6A99CE	RGB 106 153 206	#6A99CE
83.3%	83.3% #5B8CC6	RGB 91 140 198	#5B8CC6
100.0%	100.0% #4C7FBE	RGB 76 127 190	#4C7FBE

#A8CDEF #98C0E6 #89B3DE #7AA6D6 #6A99CE #5B8CC6 #4C7FBE

#A8CDEF - #4C7FBE

HSV Blend

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

0.0%	0.0% #A8CDEF	RGB 168 205 239	#A8CDEF
16.7%	16.7% #96BFE6	RGB 150 191 230	#96BFE6
33.3%	33.3% #86B2DE	RGB 134 178 222	#86B2DE
50.0%	50.0% #76A4D6	RGB 118 164 214	#76A4D6
66.7%	66.7% #6797CE	RGB 103 151 206	#6797CE
83.3%	83.3% #598BC6	RGB 89 139 198	#598BC6
100.0%	100.0% #4C7FBE	RGB 76 127 190	#4C7FBE

#A8CDEF #96BFE6 #86B2DE #76A4D6 #6797CE #598BC6 #4C7FBE

#A8CDEF - #76A4D6 - #4C7FBE

CSS codes

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

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