#A8CFED - #4D81BC | 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 #A8CFED to #4D81BC

#A8CFED #4D81BC

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

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

0.0%	0.0% #A8CFED	RGB 168 207 237	#A8CFED
16.7%	16.7% #98C2E4	RGB 152 194 228	#98C2E4
33.3%	33.3% #89B5DC	RGB 137 181 220	#89B5DC
50.0%	50.0% #7AA8D4	RGB 122 168 212	#7AA8D4
66.7%	66.7% #6B9BCC	RGB 107 155 204	#6B9BCC
83.3%	83.3% #5C8EC4	RGB 92 142 196	#5C8EC4
100.0%	100.0% #4D81BC	RGB 77 129 188	#4D81BC

#A8CFED #98C2E4 #89B5DC #7AA8D4 #6B9BCC #5C8EC4 #4D81BC

#A8CFED - #4D81BC

HSV Blend

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

0.0%	0.0% #A8CFED	RGB 168 207 237	#A8CFED
16.7%	16.7% #96C1E4	RGB 150 193 228	#96C1E4
33.3%	33.3% #86B4DC	RGB 134 180 220	#86B4DC
50.0%	50.0% #76A7D4	RGB 118 167 212	#76A7D4
66.7%	66.7% #689ACC	RGB 104 154 204	#689ACC
83.3%	83.3% #5A8DC4	RGB 90 141 196	#5A8DC4
100.0%	100.0% #4D81BC	RGB 77 129 188	#4D81BC

#A8CFED #96C1E4 #86B4DC #76A7D4 #689ACC #5A8DC4 #4D81BC

#A8CFED - #76A7D4 - #4D81BC

CSS codes

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

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