#ACD5E4 - #5689AF | 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 #ACD5E4 to #5689AF

#ACD5E4 #5689AF

Calculate the color between two colors, #ACD5E4 and #5689AF. 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)

#ACD5E4 - #5689AF | 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 #ACD5E4 as 0% and #5689AF as 100%.

0.0%	0.0% #ACD5E4	RGB 172 213 228	#ACD5E4
16.7%	16.7% #9DC8DB	RGB 157 200 219	#9DC8DB
33.3%	33.3% #8FBBD2	RGB 143 187 210	#8FBBD2
50.0%	50.0% #81AFC9	RGB 129 175 201	#81AFC9
66.7%	66.7% #72A2C0	RGB 114 162 192	#72A2C0
83.3%	83.3% #6495B7	RGB 100 149 183	#6495B7
100.0%	100.0% #5689AF	RGB 86 137 175	#5689AF

#ACD5E4 #9DC8DB #8FBBD2 #81AFC9 #72A2C0 #6495B7 #5689AF

#ACD5E4 - #5689AF

HSV Blend

#ACD5E4 - #5689AF | 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 #ACD5E4 as 0% and #5689AF as 100%.

0.0%	0.0% #ACD5E4	RGB 172 213 228	#ACD5E4
16.7%	16.7% #9BC8DB	RGB 155 200 219	#9BC8DB
33.3%	33.3% #8CBBD2	RGB 140 187 210	#8CBBD2
50.0%	50.0% #7DAFC9	RGB 125 175 201	#7DAFC9
66.7%	66.7% #6FA2C0	RGB 111 162 192	#6FA2C0
83.3%	83.3% #6295B7	RGB 98 149 183	#6295B7
100.0%	100.0% #5689AF	RGB 86 137 175	#5689AF

#ACD5E4 #9BC8DB #8CBBD2 #7DAFC9 #6FA2C0 #6295B7 #5689AF

#ACD5E4 - #7DAFC9 - #5689AF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #ACD5E4 0%, #7DAFC9 50%, #5689AF 100%);
    background: -webkit-linear-gradient(top, #ACD5E4 0%, #7DAFC9 50%, #5689AF 100%);
    background: linear-gradient(to bottom, #ACD5E4 0%, #7DAFC9 50%, #5689AF 100%);
}
</style>