#3C9CC0 - #C0DBD1 | 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 #3C9CC0 to #C0DBD1

#3C9CC0 #C0DBD1

Calculate the color between two colors, #3C9CC0 and #C0DBD1. 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)

#3C9CC0 - #C0DBD1 | 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 #3C9CC0 as 0% and #C0DBD1 as 100%.

0.0%	0.0% #3C9CC0	RGB 60 156 192	#3C9CC0
16.7%	16.7% #52A6C2	RGB 82 166 194	#52A6C2
33.3%	33.3% #68B1C5	RGB 104 177 197	#68B1C5
50.0%	50.0% #7EBBC8	RGB 126 187 200	#7EBBC8
66.7%	66.7% #94C6CB	RGB 148 198 203	#94C6CB
83.3%	83.3% #AAD0CE	RGB 170 208 206	#AAD0CE
100.0%	100.0% #C0DBD1	RGB 192 219 209	#C0DBD1

#3C9CC0 #52A6C2 #68B1C5 #7EBBC8 #94C6CB #AAD0CE #C0DBD1

#3C9CC0 - #C0DBD1

HSV Blend

#3C9CC0 - #C0DBD1 | 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 #3C9CC0 as 0% and #C0DBD1 as 100%.

0.0%	0.0% #3C9CC0	RGB 60 156 192	#3C9CC0
16.7%	16.7% #4FB1C4	RGB 79 177 196	#4FB1C4
33.3%	33.3% #64C3C9	RGB 100 195 201	#64C3C9
50.0%	50.0% #7ACDC9	RGB 122 205 201	#7ACDC9
66.7%	66.7% #90D2C7	RGB 144 210 199	#90D2C7
83.3%	83.3% #A7D6CA	RGB 167 214 202	#A7D6CA
100.0%	100.0% #C0DBD1	RGB 192 219 209	#C0DBD1

#3C9CC0 #4FB1C4 #64C3C9 #7ACDC9 #90D2C7 #A7D6CA #C0DBD1

#3C9CC0 - #7ACDC9 - #C0DBD1

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C9CC0 0%, #7ACDC9 50%, #C0DBD1 100%);
    background: -webkit-linear-gradient(top, #3C9CC0 0%, #7ACDC9 50%, #C0DBD1 100%);
    background: linear-gradient(to bottom, #3C9CC0 0%, #7ACDC9 50%, #C0DBD1 100%);
}
</style>