#3C9FAD - #B3E3AB | 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 #3C9FAD to #B3E3AB

#3C9FAD #B3E3AB

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

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

0.0%	0.0% #3C9FAD	RGB 60 159 173	#3C9FAD
16.7%	16.7% #4FAAAC	RGB 79 170 172	#4FAAAC
33.3%	33.3% #63B5AC	RGB 99 181 172	#63B5AC
50.0%	50.0% #77C1AC	RGB 119 193 172	#77C1AC
66.7%	66.7% #8BCCAB	RGB 139 204 171	#8BCCAB
83.3%	83.3% #9FD7AB	RGB 159 215 171	#9FD7AB
100.0%	100.0% #B3E3AB	RGB 179 227 171	#B3E3AB

#3C9FAD #4FAAAC #63B5AC #77C1AC #8BCCAB #9FD7AB #B3E3AB

#3C9FAD - #B3E3AB

HSV Blend

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

0.0%	0.0% #3C9FAD	RGB 60 159 173	#3C9FAD
16.7%	16.7% #4BB6AC	RGB 75 182 172	#4BB6AC
33.3%	33.3% #5CBFA1	RGB 92 191 161	#5CBFA1
50.0%	50.0% #6EC89A	RGB 110 200 154	#6EC89A
66.7%	66.7% #81D197	RGB 129 209 151	#81D197
83.3%	83.3% #95DA9A	RGB 149 218 154	#95DA9A
100.0%	100.0% #B3E3AB	RGB 179 227 171	#B3E3AB

#3C9FAD #4BB6AC #5CBFA1 #6EC89A #81D197 #95DA9A #B3E3AB

#3C9FAD - #6EC89A - #B3E3AB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C9FAD 0%, #6EC89A 50%, #B3E3AB 100%);
    background: -webkit-linear-gradient(top, #3C9FAD 0%, #6EC89A 50%, #B3E3AB 100%);
    background: linear-gradient(to bottom, #3C9FAD 0%, #6EC89A 50%, #B3E3AB 100%);
}
</style>