#5DB2D1 - #D5DED4 | 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 #5DB2D1 to #D5DED4

#5DB2D1 #D5DED4

Calculate the color between two colors, #5DB2D1 and #D5DED4. 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)

#5DB2D1 - #D5DED4 | 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 #5DB2D1 as 0% and #D5DED4 as 100%.

0.0%	0.0% #5DB2D1	RGB 93 178 209	#5DB2D1
16.7%	16.7% #71B9D1	RGB 113 185 209	#71B9D1
33.3%	33.3% #85C0D2	RGB 133 192 210	#85C0D2
50.0%	50.0% #99C8D2	RGB 153 200 210	#99C8D2
66.7%	66.7% #ADCFD3	RGB 173 207 211	#ADCFD3
83.3%	83.3% #C1D6D3	RGB 193 214 211	#C1D6D3
100.0%	100.0% #D5DED4	RGB 213 222 212	#D5DED4

#5DB2D1 #71B9D1 #85C0D2 #99C8D2 #ADCFD3 #C1D6D3 #D5DED4

#5DB2D1 - #D5DED4

HSV Blend

#5DB2D1 - #D5DED4 | 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 #5DB2D1 as 0% and #D5DED4 as 100%.

0.0%	0.0% #5DB2D1	RGB 93 178 209	#5DB2D1
16.7%	16.7% #6FCFD3	RGB 111 207 211	#6FCFD3
33.3%	33.3% #83D5C5	RGB 131 213 197	#83D5C5
50.0%	50.0% #96D7BC	RGB 150 215 188	#96D7BC
66.7%	66.7% #AAD9BB	RGB 170 217 187	#AAD9BB
83.3%	83.3% #BFDBC2	RGB 191 219 194	#BFDBC2
100.0%	100.0% #D5DED4	RGB 213 222 212	#D5DED4

#5DB2D1 #6FCFD3 #83D5C5 #96D7BC #AAD9BB #BFDBC2 #D5DED4

#5DB2D1 - #96D7BC - #D5DED4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5DB2D1 0%, #96D7BC 50%, #D5DED4 100%);
    background: -webkit-linear-gradient(top, #5DB2D1 0%, #96D7BC 50%, #D5DED4 100%);
    background: linear-gradient(to bottom, #5DB2D1 0%, #96D7BC 50%, #D5DED4 100%);
}
</style>