#6DA3E3 - #BFD4E2 | 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 #6DA3E3 to #BFD4E2

#6DA3E3 #BFD4E2

Calculate the color between two colors, #6DA3E3 and #BFD4E2. 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)

#6DA3E3 - #BFD4E2 | 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 #6DA3E3 as 0% and #BFD4E2 as 100%.

0.0%	0.0% #6DA3E3	RGB 109 163 227	#6DA3E3
16.7%	16.7% #7AABE2	RGB 122 171 226	#7AABE2
33.3%	33.3% #88B3E2	RGB 136 179 226	#88B3E2
50.0%	50.0% #96BBE2	RGB 150 187 226	#96BBE2
66.7%	66.7% #A3C3E2	RGB 163 195 226	#A3C3E2
83.3%	83.3% #B1CBE2	RGB 177 203 226	#B1CBE2
100.0%	100.0% #BFD4E2	RGB 191 212 226	#BFD4E2

#6DA3E3 #7AABE2 #88B3E2 #96BBE2 #A3C3E2 #B1CBE2 #BFD4E2

#6DA3E3 - #BFD4E2

HSV Blend

#6DA3E3 - #BFD4E2 | 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 #6DA3E3 as 0% and #BFD4E2 as 100%.

0.0%	0.0% #6DA2E3	RGB 109 162 227	#6DA2E3
16.7%	16.7% #7AACE2	RGB 122 172 226	#7AACE2
33.3%	33.3% #88B5E2	RGB 136 181 226	#88B5E2
50.0%	50.0% #96BEE2	RGB 150 190 226	#96BEE2
66.7%	66.7% #A3C6E2	RGB 163 198 226	#A3C6E2
83.3%	83.3% #B1CDE2	RGB 177 205 226	#B1CDE2
100.0%	100.0% #BFD4E2	RGB 191 212 226	#BFD4E2

#6DA2E3 #7AACE2 #88B5E2 #96BEE2 #A3C6E2 #B1CDE2 #BFD4E2

#6DA3E3 - #96BEE2 - #BFD4E2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6DA2E3 0%, #96BEE2 50%, #BFD4E2 100%);
    background: -webkit-linear-gradient(top, #6DA2E3 0%, #96BEE2 50%, #BFD4E2 100%);
    background: linear-gradient(to bottom, #6DA2E3 0%, #96BEE2 50%, #BFD4E2 100%);
}
</style>