#488C7B - #CADED9 | 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 #488C7B to #CADED9

#488C7B #CADED9

Calculate the color between two colors, #488C7B and #CADED9. 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)

#488C7B - #CADED9 | 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 #488C7B as 0% and #CADED9 as 100%.

0.0%	0.0% #488C7B	RGB 72 140 123	#488C7B
16.7%	16.7% #5D998A	RGB 93 153 138	#5D998A
33.3%	33.3% #73A79A	RGB 115 167 154	#73A79A
50.0%	50.0% #89B5AA	RGB 137 181 170	#89B5AA
66.7%	66.7% #9EC2B9	RGB 158 194 185	#9EC2B9
83.3%	83.3% #B4D0C9	RGB 180 208 201	#B4D0C9
100.0%	100.0% #CADED9	RGB 202 222 217	#CADED9

#488C7B #5D998A #73A79A #89B5AA #9EC2B9 #B4D0C9 #CADED9

#488C7B - #CADED9

HSV Blend

#488C7B - #CADED9 | 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 #488C7B as 0% and #CADED9 as 100%.

0.0%	0.0% #488C7B	RGB 72 140 123	#488C7B
16.7%	16.7% #599989	RGB 89 153 137	#599989
33.3%	33.3% #6CA798	RGB 108 167 152	#6CA798
50.0%	50.0% #80B5A7	RGB 128 181 167	#80B5A7
66.7%	66.7% #97C2B7	RGB 151 194 183	#97C2B7
83.3%	83.3% #AFD0C8	RGB 175 208 200	#AFD0C8
100.0%	100.0% #CADED9	RGB 202 222 217	#CADED9

#488C7B #599989 #6CA798 #80B5A7 #97C2B7 #AFD0C8 #CADED9

#488C7B - #80B5A7 - #CADED9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #488C7B 0%, #80B5A7 50%, #CADED9 100%);
    background: -webkit-linear-gradient(top, #488C7B 0%, #80B5A7 50%, #CADED9 100%);
    background: linear-gradient(to bottom, #488C7B 0%, #80B5A7 50%, #CADED9 100%);
}
</style>