#6987AC - #283E5E | 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 #6987AC to #283E5E

#6987AC #283E5E

Calculate the color between two colors, #6987AC and #283E5E. 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)

#6987AC - #283E5E | 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 #6987AC as 0% and #283E5E as 100%.

0.0%	0.0% #6987AC	RGB 105 135 172	#6987AC
16.7%	16.7% #5E7A9F	RGB 94 122 159	#5E7A9F
33.3%	33.3% #536E92	RGB 83 110 146	#536E92
50.0%	50.0% #486285	RGB 72 98 133	#486285
66.7%	66.7% #3D5678	RGB 61 86 120	#3D5678
83.3%	83.3% #324A6B	RGB 50 74 107	#324A6B
100.0%	100.0% #283E5E	RGB 40 62 94	#283E5E

#6987AC #5E7A9F #536E92 #486285 #3D5678 #324A6B #283E5E

#6987AC - #283E5E

HSV Blend

#6987AC - #283E5E | 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 #6987AC as 0% and #283E5E as 100%.

0.0%	0.0% #6986AC	RGB 105 134 172	#6986AC
16.7%	16.7% #5C799F	RGB 92 121 159	#5C799F
33.3%	33.3% #506C92	RGB 80 108 146	#506C92
50.0%	50.0% #446085	RGB 68 96 133	#446085
66.7%	66.7% #3A5478	RGB 58 84 120	#3A5478
83.3%	83.3% #30486B	RGB 48 72 107	#30486B
100.0%	100.0% #283E5E	RGB 40 62 94	#283E5E

#6986AC #5C799F #506C92 #446085 #3A5478 #30486B #283E5E

#6987AC - #446085 - #283E5E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6986AC 0%, #446085 50%, #283E5E 100%);
    background: -webkit-linear-gradient(top, #6986AC 0%, #446085 50%, #283E5E 100%);
    background: linear-gradient(to bottom, #6986AC 0%, #446085 50%, #283E5E 100%);
}
</style>