#4FADE2 - #CCE7F6 | 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 #4FADE2 to #CCE7F6

#4FADE2 #CCE7F6

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

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

0.0%	0.0% #4FADE2	RGB 79 173 226	#4FADE2
16.7%	16.7% #63B6E5	RGB 99 182 229	#63B6E5
33.3%	33.3% #78C0E8	RGB 120 192 232	#78C0E8
50.0%	50.0% #8DCAEC	RGB 141 202 236	#8DCAEC
66.7%	66.7% #A2D3EF	RGB 162 211 239	#A2D3EF
83.3%	83.3% #B7DDF2	RGB 183 221 242	#B7DDF2
100.0%	100.0% #CCE7F6	RGB 204 231 246	#CCE7F6

#4FADE2 #63B6E5 #78C0E8 #8DCAEC #A2D3EF #B7DDF2 #CCE7F6

#4FADE2 - #CCE7F6

HSV Blend

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

0.0%	0.0% #4FACE2	RGB 79 172 226	#4FACE2
16.7%	16.7% #62B6E5	RGB 98 182 229	#62B6E5
33.3%	33.3% #76BFE8	RGB 118 191 232	#76BFE8
50.0%	50.0% #8BC9EC	RGB 139 201 236	#8BC9EC
66.7%	66.7% #A0D2EF	RGB 160 210 239	#A0D2EF
83.3%	83.3% #B5DCF2	RGB 181 220 242	#B5DCF2
100.0%	100.0% #CCE7F6	RGB 204 231 246	#CCE7F6

#4FACE2 #62B6E5 #76BFE8 #8BC9EC #A0D2EF #B5DCF2 #CCE7F6

#4FADE2 - #8BC9EC - #CCE7F6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4FACE2 0%, #8BC9EC 50%, #CCE7F6 100%);
    background: -webkit-linear-gradient(top, #4FACE2 0%, #8BC9EC 50%, #CCE7F6 100%);
    background: linear-gradient(to bottom, #4FACE2 0%, #8BC9EC 50%, #CCE7F6 100%);
}
</style>