#6C7BAF - #CBCCC2 | 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 #6C7BAF to #CBCCC2

#6C7BAF #CBCCC2

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

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

0.0%	0.0% #6C7BAF	RGB 108 123 175	#6C7BAF
16.7%	16.7% #7B88B2	RGB 123 136 178	#7B88B2
33.3%	33.3% #8B96B5	RGB 139 150 181	#8B96B5
50.0%	50.0% #9BA3B8	RGB 155 163 184	#9BA3B8
66.7%	66.7% #ABB1BB	RGB 171 177 187	#ABB1BB
83.3%	83.3% #BBBEBE	RGB 187 190 190	#BBBEBE
100.0%	100.0% #CBCCC2	RGB 203 204 194	#CBCCC2

#6C7BAF #7B88B2 #8B96B5 #9BA3B8 #ABB1BB #BBBEBE #CBCCC2

#6C7BAF - #CBCCC2

HSV Blend

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

0.0%	0.0% #6C7BAF	RGB 108 123 175	#6C7BAF
16.7%	16.7% #78A0B3	RGB 120 160 179	#78A0B3
33.3%	33.3% #86B8B2	RGB 134 184 178	#86B8B2
50.0%	50.0% #94BDA6	RGB 148 189 166	#94BDA6
66.7%	66.7% #A3C2A3	RGB 163 194 163	#A3C2A3
83.3%	83.3% #BBC7B2	RGB 187 199 178	#BBC7B2
100.0%	100.0% #CBCCC2	RGB 203 204 194	#CBCCC2

#6C7BAF #78A0B3 #86B8B2 #94BDA6 #A3C2A3 #BBC7B2 #CBCCC2

#6C7BAF - #94BDA6 - #CBCCC2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6C7BAF 0%, #94BDA6 50%, #CBCCC2 100%);
    background: -webkit-linear-gradient(top, #6C7BAF 0%, #94BDA6 50%, #CBCCC2 100%);
    background: linear-gradient(to bottom, #6C7BAF 0%, #94BDA6 50%, #CBCCC2 100%);
}
</style>