#CFD3FF - #6B85D4 | 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 #CFD3FF to #6B85D4

#CFD3FF #6B85D4

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

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

0.0%	0.0% #CFD3FF	RGB 207 211 255	#CFD3FF
16.7%	16.7% #BEC6F7	RGB 190 198 247	#BEC6F7
33.3%	33.3% #ADB9F0	RGB 173 185 240	#ADB9F0
50.0%	50.0% #9DACE9	RGB 157 172 233	#9DACE9
66.7%	66.7% #8C9FE2	RGB 140 159 226	#8C9FE2
83.3%	83.3% #7B92DB	RGB 123 146 219	#7B92DB
100.0%	100.0% #6B85D4	RGB 107 133 212	#6B85D4

#CFD3FF #BEC6F7 #ADB9F0 #9DACE9 #8C9FE2 #7B92DB #6B85D4

#CFD3FF - #6B85D4

HSV Blend

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

0.0%	0.0% #CFD3FF	RGB 207 211 255	#CFD3FF
16.7%	16.7% #BCC3F7	RGB 188 195 247	#BCC3F7
33.3%	33.3% #AAB4F0	RGB 170 180 240	#AAB4F0
50.0%	50.0% #99A6E9	RGB 153 166 233	#99A6E9
66.7%	66.7% #899AE2	RGB 137 154 226	#899AE2
83.3%	83.3% #798FDB	RGB 121 143 219	#798FDB
100.0%	100.0% #6B85D4	RGB 107 133 212	#6B85D4

#CFD3FF #BCC3F7 #AAB4F0 #99A6E9 #899AE2 #798FDB #6B85D4

#CFD3FF - #99A6E9 - #6B85D4

CSS codes

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

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