#3E5EC7 - #81ACE8 | 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 #3E5EC7 to #81ACE8

#3E5EC7 #81ACE8

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

#3E5EC7 - #81ACE8 | 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 #3E5EC7 as 0% and #81ACE8 as 100%.

0.0%	0.0% #3E5EC7	RGB 62 94 199	#3E5EC7
16.7%	16.7% #496BCC	RGB 73 107 204	#496BCC
33.3%	33.3% #5478D2	RGB 84 120 210	#5478D2
50.0%	50.0% #5F85D7	RGB 95 133 215	#5F85D7
66.7%	66.7% #6A92DD	RGB 106 146 221	#6A92DD
83.3%	83.3% #759FE2	RGB 117 159 226	#759FE2
100.0%	100.0% #81ACE8	RGB 129 172 232	#81ACE8

#3E5EC7 #496BCC #5478D2 #5F85D7 #6A92DD #759FE2 #81ACE8

#3E5EC7 - #81ACE8

HSV Blend

#3E5EC7 - #81ACE8 | 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 #3E5EC7 as 0% and #81ACE8 as 100%.

0.0%	0.0% #3E5EC7	RGB 62 94 199	#3E5EC7
16.7%	16.7% #486BCC	RGB 72 107 204	#486BCC
33.3%	33.3% #5278D2	RGB 82 120 210	#5278D2
50.0%	50.0% #5D85D7	RGB 93 133 215	#5D85D7
66.7%	66.7% #6892DD	RGB 104 146 221	#6892DD
83.3%	83.3% #749FE2	RGB 116 159 226	#749FE2
100.0%	100.0% #81ACE8	RGB 129 172 232	#81ACE8

#3E5EC7 #486BCC #5278D2 #5D85D7 #6892DD #749FE2 #81ACE8

#3E5EC7 - #5D85D7 - #81ACE8

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3E5EC7 0%, #5D85D7 50%, #81ACE8 100%);
    background: -webkit-linear-gradient(top, #3E5EC7 0%, #5D85D7 50%, #81ACE8 100%);
    background: linear-gradient(to bottom, #3E5EC7 0%, #5D85D7 50%, #81ACE8 100%);
}
</style>