#A8D4F7 - #4D83CF | 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 #A8D4F7 to #4D83CF

#A8D4F7 #4D83CF

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

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

0.0%	0.0% #A8D4F7	RGB 168 212 247	#A8D4F7
16.7%	16.7% #98C6F0	RGB 152 198 240	#98C6F0
33.3%	33.3% #89B9E9	RGB 137 185 233	#89B9E9
50.0%	50.0% #7AABE3	RGB 122 171 227	#7AABE3
66.7%	66.7% #6B9EDC	RGB 107 158 220	#6B9EDC
83.3%	83.3% #5C90D5	RGB 92 144 213	#5C90D5
100.0%	100.0% #4D83CF	RGB 77 131 207	#4D83CF

#A8D4F7 #98C6F0 #89B9E9 #7AABE3 #6B9EDC #5C90D5 #4D83CF

#A8D4F7 - #4D83CF

HSV Blend

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

0.0%	0.0% #A8D4F7	RGB 168 212 247	#A8D4F7
16.7%	16.7% #97C6F0	RGB 151 198 240	#97C6F0
33.3%	33.3% #86B9E9	RGB 134 185 233	#86B9E9
50.0%	50.0% #77ABE3	RGB 119 171 227	#77ABE3
66.7%	66.7% #689EDC	RGB 104 158 220	#689EDC
83.3%	83.3% #5A90D5	RGB 90 144 213	#5A90D5
100.0%	100.0% #4D83CF	RGB 77 131 207	#4D83CF

#A8D4F7 #97C6F0 #86B9E9 #77ABE3 #689EDC #5A90D5 #4D83CF

#A8D4F7 - #77ABE3 - #4D83CF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8D4F7 0%, #77ABE3 50%, #4D83CF 100%);
    background: -webkit-linear-gradient(top, #A8D4F7 0%, #77ABE3 50%, #4D83CF 100%);
    background: linear-gradient(to bottom, #A8D4F7 0%, #77ABE3 50%, #4D83CF 100%);
}
</style>