#3CAAB9 - #C7E7EB | 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 #3CAAB9 to #C7E7EB

#3CAAB9 #C7E7EB

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

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

0.0%	0.0% #3CAAB9	RGB 60 170 185	#3CAAB9
16.7%	16.7% #53B4C1	RGB 83 180 193	#53B4C1
33.3%	33.3% #6ABEC9	RGB 106 190 201	#6ABEC9
50.0%	50.0% #81C8D2	RGB 129 200 210	#81C8D2
66.7%	66.7% #98D2DA	RGB 152 210 218	#98D2DA
83.3%	83.3% #AFDCE2	RGB 175 220 226	#AFDCE2
100.0%	100.0% #C7E7EB	RGB 199 231 235	#C7E7EB

#3CAAB9 #53B4C1 #6ABEC9 #81C8D2 #98D2DA #AFDCE2 #C7E7EB

#3CAAB9 - #C7E7EB

HSV Blend

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

0.0%	0.0% #3CAAB9	RGB 60 170 185	#3CAAB9
16.7%	16.7% #4FB3C1	RGB 79 179 193	#4FB3C1
33.3%	33.3% #64BDC9	RGB 100 189 201	#64BDC9
50.0%	50.0% #7AC7D2	RGB 122 199 210	#7AC7D2
66.7%	66.7% #92D2DA	RGB 146 210 218	#92D2DA
83.3%	83.3% #ACDCE2	RGB 172 220 226	#ACDCE2
100.0%	100.0% #C7E7EB	RGB 199 231 235	#C7E7EB

#3CAAB9 #4FB3C1 #64BDC9 #7AC7D2 #92D2DA #ACDCE2 #C7E7EB

#3CAAB9 - #7AC7D2 - #C7E7EB

CSS codes

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

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