#4D8C8F - #CCDEDF | 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 #4D8C8F to #CCDEDF

#4D8C8F #CCDEDF

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

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

0.0%	0.0% #4D8C8F	RGB 77 140 143	#4D8C8F
16.7%	16.7% #62999C	RGB 98 153 156	#62999C
33.3%	33.3% #77A7A9	RGB 119 167 169	#77A7A9
50.0%	50.0% #8CB5B7	RGB 140 181 183	#8CB5B7
66.7%	66.7% #A1C2C4	RGB 161 194 196	#A1C2C4
83.3%	83.3% #B6D0D1	RGB 182 208 209	#B6D0D1
100.0%	100.0% #CCDEDF	RGB 204 222 223	#CCDEDF

#4D8C8F #62999C #77A7A9 #8CB5B7 #A1C2C4 #B6D0D1 #CCDEDF

#4D8C8F - #CCDEDF

HSV Blend

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

0.0%	0.0% #4D8C8F	RGB 77 140 143	#4D8C8F
16.7%	16.7% #5D999C	RGB 93 153 156	#5D999C
33.3%	33.3% #70A6A9	RGB 112 166 169	#70A6A9
50.0%	50.0% #84B4B7	RGB 132 180 183	#84B4B7
66.7%	66.7% #9AC2C4	RGB 154 194 196	#9AC2C4
83.3%	83.3% #B2D0D1	RGB 178 208 209	#B2D0D1
100.0%	100.0% #CCDEDF	RGB 204 222 223	#CCDEDF

#4D8C8F #5D999C #70A6A9 #84B4B7 #9AC2C4 #B2D0D1 #CCDEDF

#4D8C8F - #84B4B7 - #CCDEDF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4D8C8F 0%, #84B4B7 50%, #CCDEDF 100%);
    background: -webkit-linear-gradient(top, #4D8C8F 0%, #84B4B7 50%, #CCDEDF 100%);
    background: linear-gradient(to bottom, #4D8C8F 0%, #84B4B7 50%, #CCDEDF 100%);
}
</style>