#CCE4FA - #78ACEB | 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 #CCE4FA to #78ACEB

#CCE4FA #78ACEB

Calculate the color between two colors, #CCE4FA and #78ACEB. 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)

#CCE4FA - #78ACEB | 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 #CCE4FA as 0% and #78ACEB as 100%.

0.0%	0.0% #CCE4FA	RGB 204 228 250	#CCE4FA
16.7%	16.7% #BEDAF7	RGB 190 218 247	#BEDAF7
33.3%	33.3% #B0D1F5	RGB 176 209 245	#B0D1F5
50.0%	50.0% #A2C8F2	RGB 162 200 242	#A2C8F2
66.7%	66.7% #94BEF0	RGB 148 190 240	#94BEF0
83.3%	83.3% #86B5ED	RGB 134 181 237	#86B5ED
100.0%	100.0% #78ACEB	RGB 120 172 235	#78ACEB

#CCE4FA #BEDAF7 #B0D1F5 #A2C8F2 #94BEF0 #86B5ED #78ACEB

#CCE4FA - #78ACEB

HSV Blend

#CCE4FA - #78ACEB | 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 #CCE4FA as 0% and #78ACEB as 100%.

0.0%	0.0% #CCE4FA	RGB 204 228 250	#CCE4FA
16.7%	16.7% #BDDBF7	RGB 189 219 247	#BDDBF7
33.3%	33.3% #AED1F5	RGB 174 209 245	#AED1F5
50.0%	50.0% #A0C8F2	RGB 160 200 242	#A0C8F2
66.7%	66.7% #92BFF0	RGB 146 191 240	#92BFF0
83.3%	83.3% #85B5ED	RGB 133 181 237	#85B5ED
100.0%	100.0% #78ACEB	RGB 120 172 235	#78ACEB

#CCE4FA #BDDBF7 #AED1F5 #A0C8F2 #92BFF0 #85B5ED #78ACEB

#CCE4FA - #A0C8F2 - #78ACEB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #CCE4FA 0%, #A0C8F2 50%, #78ACEB 100%);
    background: -webkit-linear-gradient(top, #CCE4FA 0%, #A0C8F2 50%, #78ACEB 100%);
    background: linear-gradient(to bottom, #CCE4FA 0%, #A0C8F2 50%, #78ACEB 100%);
}
</style>