#3E70AD - #ABE2B8 | 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 #3E70AD to #ABE2B8

#3E70AD #ABE2B8

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

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

0.0%	0.0% #3E70AD	RGB 62 112 173	#3E70AD
16.7%	16.7% #5083AE	RGB 80 131 174	#5083AE
33.3%	33.3% #6296B0	RGB 98 150 176	#6296B0
50.0%	50.0% #74A9B2	RGB 116 169 178	#74A9B2
66.7%	66.7% #86BCB4	RGB 134 188 180	#86BCB4
83.3%	83.3% #98CFB6	RGB 152 207 182	#98CFB6
100.0%	100.0% #ABE2B8	RGB 171 226 184	#ABE2B8

#3E70AD #5083AE #6296B0 #74A9B2 #86BCB4 #98CFB6 #ABE2B8

#3E70AD - #ABE2B8

HSV Blend

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

0.0%	0.0% #3E70AD	RGB 62 112 173	#3E70AD
16.7%	16.7% #4D93B5	RGB 77 147 181	#4D93B5
33.3%	33.3% #5DB3BE	RGB 93 179 190	#5DB3BE
50.0%	50.0% #6FC7BE	RGB 111 199 190	#6FC7BE
66.7%	66.7% #81D0B6	RGB 129 208 182	#81D0B6
83.3%	83.3% #95D9B4	RGB 149 217 180	#95D9B4
100.0%	100.0% #ABE2B8	RGB 171 226 184	#ABE2B8

#3E70AD #4D93B5 #5DB3BE #6FC7BE #81D0B6 #95D9B4 #ABE2B8

#3E70AD - #6FC7BE - #ABE2B8

CSS codes

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

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