#6BCDDD - #8CBEFD | 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 #6BCDDD to #8CBEFD

#6BCDDD #8CBEFD

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

#6BCDDD - #8CBEFD | 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 #6BCDDD as 0% and #8CBEFD as 100%.

0.0%	0.0% #6BCDDD	RGB 107 205 221	#6BCDDD
16.7%	16.7% #70CAE2	RGB 112 202 226	#70CAE2
33.3%	33.3% #76C8E7	RGB 118 200 231	#76C8E7
50.0%	50.0% #7BC5ED	RGB 123 197 237	#7BC5ED
66.7%	66.7% #81C3F2	RGB 129 195 242	#81C3F2
83.3%	83.3% #86C0F7	RGB 134 192 247	#86C0F7
100.0%	100.0% #8CBEFD	RGB 140 190 253	#8CBEFD

#6BCDDD #70CAE2 #76C8E7 #7BC5ED #81C3F2 #86C0F7 #8CBEFD

#6BCDDD - #8CBEFD

HSV Blend

#6BCDDD - #8CBEFD | 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 #6BCDDD as 0% and #8CBEFD as 100%.

0.0%	0.0% #6BCDDD	RGB 107 205 221	#6BCDDD
16.7%	16.7% #70CAE2	RGB 112 202 226	#70CAE2
33.3%	33.3% #75C7E7	RGB 117 199 231	#75C7E7
50.0%	50.0% #7AC5ED	RGB 122 197 237	#7AC5ED
66.7%	66.7% #80C2F2	RGB 128 194 242	#80C2F2
83.3%	83.3% #86C0F7	RGB 134 192 247	#86C0F7
100.0%	100.0% #8CBEFD	RGB 140 190 253	#8CBEFD

#6BCDDD #70CAE2 #75C7E7 #7AC5ED #80C2F2 #86C0F7 #8CBEFD

#6BCDDD - #7AC5ED - #8CBEFD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6BCDDD 0%, #7AC5ED 50%, #8CBEFD 100%);
    background: -webkit-linear-gradient(top, #6BCDDD 0%, #7AC5ED 50%, #8CBEFD 100%);
    background: linear-gradient(to bottom, #6BCDDD 0%, #7AC5ED 50%, #8CBEFD 100%);
}
</style>