#A8D6F6 - #409DC4 | 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 #A8D6F6 to #409DC4

#A8D6F6 #409DC4

Calculate the color between two colors, #A8D6F6 and #409DC4. 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)

#A8D6F6 - #409DC4 | 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 #A8D6F6 as 0% and #409DC4 as 100%.

0.0%	0.0% #A8D6F6	RGB 168 214 246	#A8D6F6
16.7%	16.7% #96CCED	RGB 150 204 237	#96CCED
33.3%	33.3% #85C3E5	RGB 133 195 229	#85C3E5
50.0%	50.0% #74B9DD	RGB 116 185 221	#74B9DD
66.7%	66.7% #62B0D4	RGB 98 176 212	#62B0D4
83.3%	83.3% #51A6CC	RGB 81 166 204	#51A6CC
100.0%	100.0% #409DC4	RGB 64 157 196	#409DC4

#A8D6F6 #96CCED #85C3E5 #74B9DD #62B0D4 #51A6CC #409DC4

#A8D6F6 - #409DC4

HSV Blend

#A8D6F6 - #409DC4 | 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 #A8D6F6 as 0% and #409DC4 as 100%.

0.0%	0.0% #A8D6F6	RGB 168 214 246	#A8D6F6
16.7%	16.7% #94CAED	RGB 148 202 237	#94CAED
33.3%	33.3% #81C0E5	RGB 129 192 229	#81C0E5
50.0%	50.0% #6FB6DD	RGB 111 182 221	#6FB6DD
66.7%	66.7% #5EADD4	RGB 94 173 212	#5EADD4
83.3%	83.3% #4EA4CC	RGB 78 164 204	#4EA4CC
100.0%	100.0% #409DC4	RGB 64 157 196	#409DC4

#A8D6F6 #94CAED #81C0E5 #6FB6DD #5EADD4 #4EA4CC #409DC4

#A8D6F6 - #6FB6DD - #409DC4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8D6F6 0%, #6FB6DD 50%, #409DC4 100%);
    background: -webkit-linear-gradient(top, #A8D6F6 0%, #6FB6DD 50%, #409DC4 100%);
    background: linear-gradient(to bottom, #A8D6F6 0%, #6FB6DD 50%, #409DC4 100%);
}
</style>