#4EBBC2 - #CCEBED | 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 #4EBBC2 to #CCEBED

#4EBBC2 #CCEBED

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

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

0.0%	0.0% #4EBBC2	RGB 78 187 194	#4EBBC2
16.7%	16.7% #63C3C9	RGB 99 195 201	#63C3C9
33.3%	33.3% #78CBD0	RGB 120 203 208	#78CBD0
50.0%	50.0% #8DD3D7	RGB 141 211 215	#8DD3D7
66.7%	66.7% #A2DBDE	RGB 162 219 222	#A2DBDE
83.3%	83.3% #B7E3E5	RGB 183 227 229	#B7E3E5
100.0%	100.0% #CCEBED	RGB 204 235 237	#CCEBED

#4EBBC2 #63C3C9 #78CBD0 #8DD3D7 #A2DBDE #B7E3E5 #CCEBED

#4EBBC2 - #CCEBED

HSV Blend

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

0.0%	0.0% #4EBAC2	RGB 78 186 194	#4EBAC2
16.7%	16.7% #60C2C9	RGB 96 194 201	#60C2C9
33.3%	33.3% #73CAD0	RGB 115 202 208	#73CAD0
50.0%	50.0% #88D2D7	RGB 136 210 215	#88D2D7
66.7%	66.7% #9DDADE	RGB 157 218 222	#9DDADE
83.3%	83.3% #B4E2E5	RGB 180 226 229	#B4E2E5
100.0%	100.0% #CCEBED	RGB 204 235 237	#CCEBED

#4EBAC2 #60C2C9 #73CAD0 #88D2D7 #9DDADE #B4E2E5 #CCEBED

#4EBBC2 - #88D2D7 - #CCEBED

CSS codes

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

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