#6CACC2 - #8DB2FD | 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 #6CACC2 to #8DB2FD

#6CACC2 #8DB2FD

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

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

0.0%	0.0% #6CACC2	RGB 108 172 194	#6CACC2
16.7%	16.7% #71ADCB	RGB 113 173 203	#71ADCB
33.3%	33.3% #77AED5	RGB 119 174 213	#77AED5
50.0%	50.0% #7CAFDF	RGB 124 175 223	#7CAFDF
66.7%	66.7% #82B0E9	RGB 130 176 233	#82B0E9
83.3%	83.3% #87B1F3	RGB 135 177 243	#87B1F3
100.0%	100.0% #8DB2FD	RGB 141 178 253	#8DB2FD

#6CACC2 #71ADCB #77AED5 #7CAFDF #82B0E9 #87B1F3 #8DB2FD

#6CACC2 - #8DB2FD

HSV Blend

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

0.0%	0.0% #6CACC2	RGB 108 172 194	#6CACC2
16.7%	16.7% #71AECB	RGB 113 174 203	#71AECB
33.3%	33.3% #76B0D5	RGB 118 176 213	#76B0D5
50.0%	50.0% #7CB1DF	RGB 124 177 223	#7CB1DF
66.7%	66.7% #81B2E9	RGB 129 178 233	#81B2E9
83.3%	83.3% #87B2F3	RGB 135 178 243	#87B2F3
100.0%	100.0% #8DB2FD	RGB 141 178 253	#8DB2FD

#6CACC2 #71AECB #76B0D5 #7CB1DF #81B2E9 #87B2F3 #8DB2FD

#6CACC2 - #7CB1DF - #8DB2FD

CSS codes

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

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