#A8CBE4 - #4F7DAE | 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 #A8CBE4 to #4F7DAE

#A8CBE4 #4F7DAE

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

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

0.0%	0.0% #A8CBE4	RGB 168 203 228	#A8CBE4
16.7%	16.7% #99BEDB	RGB 153 190 219	#99BEDB
33.3%	33.3% #8AB1D2	RGB 138 177 210	#8AB1D2
50.0%	50.0% #7BA4C9	RGB 123 164 201	#7BA4C9
66.7%	66.7% #6C97C0	RGB 108 151 192	#6C97C0
83.3%	83.3% #5D8AB7	RGB 93 138 183	#5D8AB7
100.0%	100.0% #4F7DAE	RGB 79 125 174	#4F7DAE

#A8CBE4 #99BEDB #8AB1D2 #7BA4C9 #6C97C0 #5D8AB7 #4F7DAE

#A8CBE4 - #4F7DAE

HSV Blend

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

0.0%	0.0% #A8CBE4	RGB 168 203 228	#A8CBE4
16.7%	16.7% #97BDDB	RGB 151 189 219	#97BDDB
33.3%	33.3% #86B0D2	RGB 134 176 210	#86B0D2
50.0%	50.0% #77A3C9	RGB 119 163 201	#77A3C9
66.7%	66.7% #6996C0	RGB 105 150 192	#6996C0
83.3%	83.3% #5B89B7	RGB 91 137 183	#5B89B7
100.0%	100.0% #4F7DAE	RGB 79 125 174	#4F7DAE

#A8CBE4 #97BDDB #86B0D2 #77A3C9 #6996C0 #5B89B7 #4F7DAE

#A8CBE4 - #77A3C9 - #4F7DAE

CSS codes

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

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