#6A8BA5 - #CCC7BC | 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 #6A8BA5 to #CCC7BC

#6A8BA5 #CCC7BC

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

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

0.0%	0.0% #6A8BA5	RGB 106 139 165	#6A8BA5
16.7%	16.7% #7A95A8	RGB 122 149 168	#7A95A8
33.3%	33.3% #8A9FAC	RGB 138 159 172	#8A9FAC
50.0%	50.0% #9BA9B0	RGB 155 169 176	#9BA9B0
66.7%	66.7% #ABB3B4	RGB 171 179 180	#ABB3B4
83.3%	83.3% #BBBDB8	RGB 187 189 184	#BBBDB8
100.0%	100.0% #CCC7BC	RGB 204 199 188	#CCC7BC

#6A8BA5 #7A95A8 #8A9FAC #9BA9B0 #ABB3B4 #BBBDB8 #CCC7BC

#6A8BA5 - #CCC7BC

HSV Blend

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

0.0%	0.0% #6A8BA5	RGB 106 139 165	#6A8BA5
16.7%	16.7% #76ABAA	RGB 118 171 170	#76ABAA
33.3%	33.3% #82B29B	RGB 130 178 155	#82B29B
50.0%	50.0% #90B892	RGB 144 184 146	#90B892
66.7%	66.7% #ABBF9E	RGB 171 191 158	#ABBF9E
83.3%	83.3% #C1C5AC	RGB 193 197 172	#C1C5AC
100.0%	100.0% #CCC7BC	RGB 204 199 188	#CCC7BC

#6A8BA5 #76ABAA #82B29B #90B892 #ABBF9E #C1C5AC #CCC7BC

#6A8BA5 - #90B892 - #CCC7BC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6A8BA5 0%, #90B892 50%, #CCC7BC 100%);
    background: -webkit-linear-gradient(top, #6A8BA5 0%, #90B892 50%, #CCC7BC 100%);
    background: linear-gradient(to bottom, #6A8BA5 0%, #90B892 50%, #CCC7BC 100%);
}
</style>