#A8BAE4 - #CADBE1 | 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 #A8BAE4 to #CADBE1

#A8BAE4 #CADBE1

Calculate the color between two colors, #A8BAE4 and #CADBE1. 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)

#A8BAE4 - #CADBE1 | 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 #A8BAE4 as 0% and #CADBE1 as 100%.

0.0%	0.0% #A8BAE4	RGB 168 186 228	#A8BAE4
16.7%	16.7% #ADBFE3	RGB 173 191 227	#ADBFE3
33.3%	33.3% #B3C5E3	RGB 179 197 227	#B3C5E3
50.0%	50.0% #B9CAE2	RGB 185 202 226	#B9CAE2
66.7%	66.7% #BED0E2	RGB 190 208 226	#BED0E2
83.3%	83.3% #C4D5E1	RGB 196 213 225	#C4D5E1
100.0%	100.0% #CADBE1	RGB 202 219 225	#CADBE1

#A8BAE4 #ADBFE3 #B3C5E3 #B9CAE2 #BED0E2 #C4D5E1 #CADBE1

#A8BAE4 - #CADBE1

HSV Blend

#A8BAE4 - #CADBE1 | 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 #A8BAE4 as 0% and #CADBE1 as 100%.

0.0%	0.0% #A8BAE4	RGB 168 186 228	#A8BAE4
16.7%	16.7% #ADC1E3	RGB 173 193 227	#ADC1E3
33.3%	33.3% #B3C8E3	RGB 179 200 227	#B3C8E3
50.0%	50.0% #B9CEE2	RGB 185 206 226	#B9CEE2
66.7%	66.7% #BED3E2	RGB 190 211 226	#BED3E2
83.3%	83.3% #C4D7E1	RGB 196 215 225	#C4D7E1
100.0%	100.0% #CADBE1	RGB 202 219 225	#CADBE1

#A8BAE4 #ADC1E3 #B3C8E3 #B9CEE2 #BED3E2 #C4D7E1 #CADBE1

#A8BAE4 - #B9CEE2 - #CADBE1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A8BAE4 0%, #B9CEE2 50%, #CADBE1 100%);
    background: -webkit-linear-gradient(top, #A8BAE4 0%, #B9CEE2 50%, #CADBE1 100%);
    background: linear-gradient(to bottom, #A8BAE4 0%, #B9CEE2 50%, #CADBE1 100%);
}
</style>