#A8DEF0 - #4F96C2 | 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 #A8DEF0 to #4F96C2

#A8DEF0 #4F96C2

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

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

0.0%	0.0% #A8DEF0	RGB 168 222 240	#A8DEF0
16.7%	16.7% #99D2E8	RGB 153 210 232	#99D2E8
33.3%	33.3% #8AC6E0	RGB 138 198 224	#8AC6E0
50.0%	50.0% #7BBAD9	RGB 123 186 217	#7BBAD9
66.7%	66.7% #6CAED1	RGB 108 174 209	#6CAED1
83.3%	83.3% #5DA2C9	RGB 93 162 201	#5DA2C9
100.0%	100.0% #4F96C2	RGB 79 150 194	#4F96C2

#A8DEF0 #99D2E8 #8AC6E0 #7BBAD9 #6CAED1 #5DA2C9 #4F96C2

#A8DEF0 - #4F96C2

HSV Blend

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

0.0%	0.0% #A8DEF0	RGB 168 222 240	#A8DEF0
16.7%	16.7% #97D2E8	RGB 151 210 232	#97D2E8
33.3%	33.3% #87C6E0	RGB 135 198 224	#87C6E0
50.0%	50.0% #78BAD9	RGB 120 186 217	#78BAD9
66.7%	66.7% #69AED1	RGB 105 174 209	#69AED1
83.3%	83.3% #5BA2C9	RGB 91 162 201	#5BA2C9
100.0%	100.0% #4F96C2	RGB 79 150 194	#4F96C2

#A8DEF0 #97D2E8 #87C6E0 #78BAD9 #69AED1 #5BA2C9 #4F96C2

#A8DEF0 - #78BAD9 - #4F96C2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8DEF0 0%, #78BAD9 50%, #4F96C2 100%);
    background: -webkit-linear-gradient(top, #A8DEF0 0%, #78BAD9 50%, #4F96C2 100%);
    background: linear-gradient(to bottom, #A8DEF0 0%, #78BAD9 50%, #4F96C2 100%);
}
</style>