#3C8F9D - #8BC2C5 | 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 #3C8F9D to #8BC2C5

#3C8F9D #8BC2C5

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

#3C8F9D - #8BC2C5 | 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 #3C8F9D as 0% and #8BC2C5 as 100%.

0.0%	0.0% #3C8F9D	RGB 60 143 157	#3C8F9D
16.7%	16.7% #4997A3	RGB 73 151 163	#4997A3
33.3%	33.3% #56A0AA	RGB 86 160 170	#56A0AA
50.0%	50.0% #63A8B1	RGB 99 168 177	#63A8B1
66.7%	66.7% #70B1B7	RGB 112 177 183	#70B1B7
83.3%	83.3% #7DB9BE	RGB 125 185 190	#7DB9BE
100.0%	100.0% #8BC2C5	RGB 139 194 197	#8BC2C5

#3C8F9D #4997A3 #56A0AA #63A8B1 #70B1B7 #7DB9BE #8BC2C5

#3C8F9D - #8BC2C5

HSV Blend

#3C8F9D - #8BC2C5 | 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 #3C8F9D as 0% and #8BC2C5 as 100%.

0.0%	0.0% #3C8E9D	RGB 60 142 157	#3C8E9D
16.7%	16.7% #4797A3	RGB 71 151 163	#4797A3
33.3%	33.3% #53A0AA	RGB 83 160 170	#53A0AA
50.0%	50.0% #60A9B1	RGB 96 169 177	#60A9B1
66.7%	66.7% #6DB1B7	RGB 109 177 183	#6DB1B7
83.3%	83.3% #7CB9BE	RGB 124 185 190	#7CB9BE
100.0%	100.0% #8BC2C5	RGB 139 194 197	#8BC2C5

#3C8E9D #4797A3 #53A0AA #60A9B1 #6DB1B7 #7CB9BE #8BC2C5

#3C8F9D - #60A9B1 - #8BC2C5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C8E9D 0%, #60A9B1 50%, #8BC2C5 100%);
    background: -webkit-linear-gradient(top, #3C8E9D 0%, #60A9B1 50%, #8BC2C5 100%);
    background: linear-gradient(to bottom, #3C8E9D 0%, #60A9B1 50%, #8BC2C5 100%);
}
</style>