#8BA3E7 - #314EAC | 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 #8BA3E7 to #314EAC

#8BA3E7 #314EAC

Calculate the color between two colors, #8BA3E7 and #314EAC. 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)

#8BA3E7 - #314EAC | 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 #8BA3E7 as 0% and #314EAC as 100%.

0.0%	0.0% #8BA3E7	RGB 139 163 231	#8BA3E7
16.7%	16.7% #7C94DD	RGB 124 148 221	#7C94DD
33.3%	33.3% #6D86D3	RGB 109 134 211	#6D86D3
50.0%	50.0% #5E78C9	RGB 94 120 201	#5E78C9
66.7%	66.7% #4F6ABF	RGB 79 106 191	#4F6ABF
83.3%	83.3% #405CB5	RGB 64 92 181	#405CB5
100.0%	100.0% #314EAC	RGB 49 78 172	#314EAC

#8BA3E7 #7C94DD #6D86D3 #5E78C9 #4F6ABF #405CB5 #314EAC

#8BA3E7 - #314EAC

HSV Blend

#8BA3E7 - #314EAC | 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 #8BA3E7 as 0% and #314EAC as 100%.

0.0%	0.0% #8BA2E7	RGB 139 162 231	#8BA2E7
16.7%	16.7% #7993DD	RGB 121 147 221	#7993DD
33.3%	33.3% #6883D3	RGB 104 131 211	#6883D3
50.0%	50.0% #5975C9	RGB 89 117 201	#5975C9
66.7%	66.7% #4A67BF	RGB 74 103 191	#4A67BF
83.3%	83.3% #3D5AB5	RGB 61 90 181	#3D5AB5
100.0%	100.0% #314EAC	RGB 49 78 172	#314EAC

#8BA2E7 #7993DD #6883D3 #5975C9 #4A67BF #3D5AB5 #314EAC

#8BA3E7 - #5975C9 - #314EAC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8BA2E7 0%, #5975C9 50%, #314EAC 100%);
    background: -webkit-linear-gradient(top, #8BA2E7 0%, #5975C9 50%, #314EAC 100%);
    background: linear-gradient(to bottom, #8BA2E7 0%, #5975C9 50%, #314EAC 100%);
}
</style>