#CDDCFF - #679CD4 | 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 #CDDCFF to #679CD4

#CDDCFF #679CD4

Calculate the color between two colors, #CDDCFF and #679CD4. 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)

#CDDCFF - #679CD4 | 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 #CDDCFF as 0% and #679CD4 as 100%.

0.0%	0.0% #CDDCFF	RGB 205 220 255	#CDDCFF
16.7%	16.7% #BCD1F7	RGB 188 209 247	#BCD1F7
33.3%	33.3% #ABC6F0	RGB 171 198 240	#ABC6F0
50.0%	50.0% #9ABCE9	RGB 154 188 233	#9ABCE9
66.7%	66.7% #89B1E2	RGB 137 177 226	#89B1E2
83.3%	83.3% #78A6DB	RGB 120 166 219	#78A6DB
100.0%	100.0% #679CD4	RGB 103 156 212	#679CD4

#CDDCFF #BCD1F7 #ABC6F0 #9ABCE9 #89B1E2 #78A6DB #679CD4

#CDDCFF - #679CD4

HSV Blend

#CDDCFF - #679CD4 | 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 #CDDCFF as 0% and #679CD4 as 100%.

0.0%	0.0% #CDDCFF	RGB 205 220 255	#CDDCFF
16.7%	16.7% #BACEF7	RGB 186 206 247	#BACEF7
33.3%	33.3% #A7C2F0	RGB 167 194 240	#A7C2F0
50.0%	50.0% #96B7E9	RGB 150 183 233	#96B7E9
66.7%	66.7% #85ADE2	RGB 133 173 226	#85ADE2
83.3%	83.3% #76A4DB	RGB 118 164 219	#76A4DB
100.0%	100.0% #679CD4	RGB 103 156 212	#679CD4

#CDDCFF #BACEF7 #A7C2F0 #96B7E9 #85ADE2 #76A4DB #679CD4

#CDDCFF - #96B7E9 - #679CD4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CDDCFF 0%, #96B7E9 50%, #679CD4 100%);
    background: -webkit-linear-gradient(top, #CDDCFF 0%, #96B7E9 50%, #679CD4 100%);
    background: linear-gradient(to bottom, #CDDCFF 0%, #96B7E9 50%, #679CD4 100%);
}
</style>