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

#6988AC #283E5E

Calculate the color between two colors, #6988AC 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)

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

0.0%	0.0% #6988AC	RGB 105 136 172	#6988AC
16.7%	16.7% #5E7B9F	RGB 94 123 159	#5E7B9F
33.3%	33.3% #536F92	RGB 83 111 146	#536F92
50.0%	50.0% #486385	RGB 72 99 133	#486385
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

#6988AC #5E7B9F #536F92 #486385 #3D5678 #324A6B #283E5E

#6988AC - #283E5E

HSV Blend

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

0.0%	0.0% #6988AC	RGB 105 136 172	#6988AC
16.7%	16.7% #5C7A9F	RGB 92 122 159	#5C7A9F
33.3%	33.3% #506D92	RGB 80 109 146	#506D92
50.0%	50.0% #446085	RGB 68 96 133	#446085
66.7%	66.7% #3A5478	RGB 58 84 120	#3A5478
83.3%	83.3% #30496B	RGB 48 73 107	#30496B
100.0%	100.0% #283E5E	RGB 40 62 94	#283E5E

#6988AC #5C7A9F #506D92 #446085 #3A5478 #30496B #283E5E

#6988AC - #446085 - #283E5E

CSS codes

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

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