#4D9AA5 - #CCE2E5 | 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 #4D9AA5 to #CCE2E5

#4D9AA5 #CCE2E5

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

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

0.0%	0.0% #4D9AA5	RGB 77 154 165	#4D9AA5
16.7%	16.7% #62A6AF	RGB 98 166 175	#62A6AF
33.3%	33.3% #77B2BA	RGB 119 178 186	#77B2BA
50.0%	50.0% #8CBEC5	RGB 140 190 197	#8CBEC5
66.7%	66.7% #A1CACF	RGB 161 202 207	#A1CACF
83.3%	83.3% #B6D6DA	RGB 182 214 218	#B6D6DA
100.0%	100.0% #CCE2E5	RGB 204 226 229	#CCE2E5

#4D9AA5 #62A6AF #77B2BA #8CBEC5 #A1CACF #B6D6DA #CCE2E5

#4D9AA5 - #CCE2E5

HSV Blend

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

0.0%	0.0% #4D9AA5	RGB 77 154 165	#4D9AA5
16.7%	16.7% #5EA5AF	RGB 94 165 175	#5EA5AF
33.3%	33.3% #71B1BA	RGB 113 177 186	#71B1BA
50.0%	50.0% #85BDC5	RGB 133 189 197	#85BDC5
66.7%	66.7% #9BC9CF	RGB 155 201 207	#9BC9CF
83.3%	83.3% #B3D5DA	RGB 179 213 218	#B3D5DA
100.0%	100.0% #CCE2E5	RGB 204 226 229	#CCE2E5

#4D9AA5 #5EA5AF #71B1BA #85BDC5 #9BC9CF #B3D5DA #CCE2E5

#4D9AA5 - #85BDC5 - #CCE2E5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D9AA5 0%, #85BDC5 50%, #CCE2E5 100%);
    background: -webkit-linear-gradient(top, #4D9AA5 0%, #85BDC5 50%, #CCE2E5 100%);
    background: linear-gradient(to bottom, #4D9AA5 0%, #85BDC5 50%, #CCE2E5 100%);
}
</style>