#BAD5E4 - #6389AE | 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 #BAD5E4 to #6389AE

#BAD5E4 #6389AE

Calculate the color between two colors, #BAD5E4 and #6389AE. 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)

#BAD5E4 - #6389AE | 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 #BAD5E4 as 0% and #6389AE as 100%.

0.0%	0.0% #BAD5E4	RGB 186 213 228	#BAD5E4
16.7%	16.7% #ABC8DB	RGB 171 200 219	#ABC8DB
33.3%	33.3% #9DBBD2	RGB 157 187 210	#9DBBD2
50.0%	50.0% #8EAFC9	RGB 142 175 201	#8EAFC9
66.7%	66.7% #80A2C0	RGB 128 162 192	#80A2C0
83.3%	83.3% #7195B7	RGB 113 149 183	#7195B7
100.0%	100.0% #6389AE	RGB 99 137 174	#6389AE

#BAD5E4 #ABC8DB #9DBBD2 #8EAFC9 #80A2C0 #7195B7 #6389AE

#BAD5E4 - #6389AE

HSV Blend

#BAD5E4 - #6389AE | 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 #BAD5E4 as 0% and #6389AE as 100%.

0.0%	0.0% #BAD5E4	RGB 186 213 228	#BAD5E4
16.7%	16.7% #A9C8DB	RGB 169 200 219	#A9C8DB
33.3%	33.3% #9ABBD2	RGB 154 187 210	#9ABBD2
50.0%	50.0% #8BAEC9	RGB 139 174 201	#8BAEC9
66.7%	66.7% #7DA2C0	RGB 125 162 192	#7DA2C0
83.3%	83.3% #6F95B7	RGB 111 149 183	#6F95B7
100.0%	100.0% #6389AE	RGB 99 137 174	#6389AE

#BAD5E4 #A9C8DB #9ABBD2 #8BAEC9 #7DA2C0 #6F95B7 #6389AE

#BAD5E4 - #8BAEC9 - #6389AE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BAD5E4 0%, #8BAEC9 50%, #6389AE 100%);
    background: -webkit-linear-gradient(top, #BAD5E4 0%, #8BAEC9 50%, #6389AE 100%);
    background: linear-gradient(to bottom, #BAD5E4 0%, #8BAEC9 50%, #6389AE 100%);
}
</style>