#CAD3E5 - #6F88AE | 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 #CAD3E5 to #6F88AE

#CAD3E5 #6F88AE

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

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

0.0%	0.0% #CAD3E5	RGB 202 211 229	#CAD3E5
16.7%	16.7% #BAC6DB	RGB 186 198 219	#BAC6DB
33.3%	33.3% #ABBAD2	RGB 171 186 210	#ABBAD2
50.0%	50.0% #9CADC9	RGB 156 173 201	#9CADC9
66.7%	66.7% #8DA1C0	RGB 141 161 192	#8DA1C0
83.3%	83.3% #7E94B7	RGB 126 148 183	#7E94B7
100.0%	100.0% #6F88AE	RGB 111 136 174	#6F88AE

#CAD3E5 #BAC6DB #ABBAD2 #9CADC9 #8DA1C0 #7E94B7 #6F88AE

#CAD3E5 - #6F88AE

HSV Blend

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

0.0%	0.0% #CAD3E5	RGB 202 211 229	#CAD3E5
16.7%	16.7% #B8C4DB	RGB 184 196 219	#B8C4DB
33.3%	33.3% #A8B7D2	RGB 168 183 210	#A8B7D2
50.0%	50.0% #99AAC9	RGB 153 170 201	#99AAC9
66.7%	66.7% #8A9EC0	RGB 138 158 192	#8A9EC0
83.3%	83.3% #7C93B7	RGB 124 147 183	#7C93B7
100.0%	100.0% #6F88AE	RGB 111 136 174	#6F88AE

#CAD3E5 #B8C4DB #A8B7D2 #99AAC9 #8A9EC0 #7C93B7 #6F88AE

#CAD3E5 - #99AAC9 - #6F88AE

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CAD3E5 0%, #99AAC9 50%, #6F88AE 100%);
    background: -webkit-linear-gradient(top, #CAD3E5 0%, #99AAC9 50%, #6F88AE 100%);
    background: linear-gradient(to bottom, #CAD3E5 0%, #99AAC9 50%, #6F88AE 100%);
}
</style>