#4EBECE - #CCECF1 | 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 #4EBECE to #CCECF1

#4EBECE #CCECF1

Calculate the color between two colors, #4EBECE and #CCECF1. 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)

#4EBECE - #CCECF1 | 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 #4EBECE as 0% and #CCECF1 as 100%.

0.0%	0.0% #4EBECE	RGB 78 190 206	#4EBECE
16.7%	16.7% #63C5D3	RGB 99 197 211	#63C5D3
33.3%	33.3% #78CDD9	RGB 120 205 217	#78CDD9
50.0%	50.0% #8DD5DF	RGB 141 213 223	#8DD5DF
66.7%	66.7% #A2DCE5	RGB 162 220 229	#A2DCE5
83.3%	83.3% #B7E4EB	RGB 183 228 235	#B7E4EB
100.0%	100.0% #CCECF1	RGB 204 236 241	#CCECF1

#4EBECE #63C5D3 #78CDD9 #8DD5DF #A2DCE5 #B7E4EB #CCECF1

#4EBECE - #CCECF1

HSV Blend

#4EBECE - #CCECF1 | 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 #4EBECE as 0% and #CCECF1 as 100%.

0.0%	0.0% #4EBDCE	RGB 78 189 206	#4EBDCE
16.7%	16.7% #60C5D3	RGB 96 197 211	#60C5D3
33.3%	33.3% #74CCD9	RGB 116 204 217	#74CCD9
50.0%	50.0% #88D4DF	RGB 136 212 223	#88D4DF
66.7%	66.7% #9EDBE5	RGB 158 219 229	#9EDBE5
83.3%	83.3% #B4E3EB	RGB 180 227 235	#B4E3EB
100.0%	100.0% #CCECF1	RGB 204 236 241	#CCECF1

#4EBDCE #60C5D3 #74CCD9 #88D4DF #9EDBE5 #B4E3EB #CCECF1

#4EBECE - #88D4DF - #CCECF1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4EBDCE 0%, #88D4DF 50%, #CCECF1 100%);
    background: -webkit-linear-gradient(top, #4EBDCE 0%, #88D4DF 50%, #CCECF1 100%);
    background: linear-gradient(to bottom, #4EBDCE 0%, #88D4DF 50%, #CCECF1 100%);
}
</style>