#4D9FA5 - #CCE3E5 | 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 #4D9FA5 to #CCE3E5

#4D9FA5 #CCE3E5

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

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

0.0%	0.0% #4D9FA5	RGB 77 159 165	#4D9FA5
16.7%	16.7% #62AAAF	RGB 98 170 175	#62AAAF
33.3%	33.3% #77B5BA	RGB 119 181 186	#77B5BA
50.0%	50.0% #8CC1C5	RGB 140 193 197	#8CC1C5
66.7%	66.7% #A1CCCF	RGB 161 204 207	#A1CCCF
83.3%	83.3% #B6D7DA	RGB 182 215 218	#B6D7DA
100.0%	100.0% #CCE3E5	RGB 204 227 229	#CCE3E5

#4D9FA5 #62AAAF #77B5BA #8CC1C5 #A1CCCF #B6D7DA #CCE3E5

#4D9FA5 - #CCE3E5

HSV Blend

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

0.0%	0.0% #4D9FA5	RGB 77 159 165	#4D9FA5
16.7%	16.7% #5EA9AF	RGB 94 169 175	#5EA9AF
33.3%	33.3% #71B5BA	RGB 113 181 186	#71B5BA
50.0%	50.0% #85C0C5	RGB 133 192 197	#85C0C5
66.7%	66.7% #9BCBCF	RGB 155 203 207	#9BCBCF
83.3%	83.3% #B3D7DA	RGB 179 215 218	#B3D7DA
100.0%	100.0% #CCE3E5	RGB 204 227 229	#CCE3E5

#4D9FA5 #5EA9AF #71B5BA #85C0C5 #9BCBCF #B3D7DA #CCE3E5

#4D9FA5 - #85C0C5 - #CCE3E5

CSS codes

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

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