#A2DFDF - #31B4B5 | 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 #A2DFDF to #31B4B5

#A2DFDF #31B4B5

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

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

0.0%	0.0% #A2DFDF	RGB 162 223 223	#A2DFDF
16.7%	16.7% #8FD7D8	RGB 143 215 216	#8FD7D8
33.3%	33.3% #7CD0D1	RGB 124 208 209	#7CD0D1
50.0%	50.0% #69C9CA	RGB 105 201 202	#69C9CA
66.7%	66.7% #56C2C3	RGB 86 194 195	#56C2C3
83.3%	83.3% #43BBBC	RGB 67 187 188	#43BBBC
100.0%	100.0% #31B4B5	RGB 49 180 181	#31B4B5

#A2DFDF #8FD7D8 #7CD0D1 #69C9CA #56C2C3 #43BBBC #31B4B5

#A2DFDF - #31B4B5

HSV Blend

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

0.0%	0.0% #A2DFDF	RGB 162 223 223	#A2DFDF
16.7%	16.7% #8CD7D8	RGB 140 215 216	#8CD7D8
33.3%	33.3% #78D0D1	RGB 120 208 209	#78D0D1
50.0%	50.0% #64C9CA	RGB 100 201 202	#64C9CA
66.7%	66.7% #52C2C3	RGB 82 194 195	#52C2C3
83.3%	83.3% #41BBBC	RGB 65 187 188	#41BBBC
100.0%	100.0% #31B4B5	RGB 49 180 181	#31B4B5

#A2DFDF #8CD7D8 #78D0D1 #64C9CA #52C2C3 #41BBBC #31B4B5

#A2DFDF - #64C9CA - #31B4B5

CSS codes

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

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