#31A39F - #B5E1A6 | 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 #31A39F to #B5E1A6

#31A39F #B5E1A6

Calculate the color between two colors, #31A39F and #B5E1A6. 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)

#31A39F - #B5E1A6 | 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 #31A39F as 0% and #B5E1A6 as 100%.

0.0%	0.0% #31A39F	RGB 49 163 159	#31A39F
16.7%	16.7% #47ADA0	RGB 71 173 160	#47ADA0
33.3%	33.3% #5DB7A1	RGB 93 183 161	#5DB7A1
50.0%	50.0% #73C2A2	RGB 115 194 162	#73C2A2
66.7%	66.7% #89CCA3	RGB 137 204 163	#89CCA3
83.3%	83.3% #9FD6A4	RGB 159 214 164	#9FD6A4
100.0%	100.0% #B5E1A6	RGB 181 225 166	#B5E1A6

#31A39F #47ADA0 #5DB7A1 #73C2A2 #89CCA3 #9FD6A4 #B5E1A6

#31A39F - #B5E1A6

HSV Blend

#31A39F - #B5E1A6 | 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 #31A39F as 0% and #B5E1A6 as 100%.

0.0%	0.0% #31A39F	RGB 49 163 159	#31A39F
16.7%	16.7% #40AD93	RGB 64 173 147	#40AD93
33.3%	33.3% #51B78A	RGB 81 183 138	#51B78A
50.0%	50.0% #64C285	RGB 100 194 133	#64C285
66.7%	66.7% #78CC85	RGB 120 204 133	#78CC85
83.3%	83.3% #92D68E	RGB 146 214 142	#92D68E
100.0%	100.0% #B5E1A6	RGB 181 225 166	#B5E1A6

#31A39F #40AD93 #51B78A #64C285 #78CC85 #92D68E #B5E1A6

#31A39F - #64C285 - #B5E1A6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #31A39F 0%, #64C285 50%, #B5E1A6 100%);
    background: -webkit-linear-gradient(top, #31A39F 0%, #64C285 50%, #B5E1A6 100%);
    background: linear-gradient(to bottom, #31A39F 0%, #64C285 50%, #B5E1A6 100%);
}
</style>