#8C92C3 - #33457B | 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 #8C92C3 to #33457B

#8C92C3 #33457B

Calculate the color between two colors, #8C92C3 and #33457B. 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)

#8C92C3 - #33457B | 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 #8C92C3 as 0% and #33457B as 100%.

0.0%	0.0% #8C92C3	RGB 140 146 195	#8C92C3
16.7%	16.7% #7D85B7	RGB 125 133 183	#7D85B7
33.3%	33.3% #6E78AB	RGB 110 120 171	#6E78AB
50.0%	50.0% #5F6B9F	RGB 95 107 159	#5F6B9F
66.7%	66.7% #505E93	RGB 80 94 147	#505E93
83.3%	83.3% #415187	RGB 65 81 135	#415187
100.0%	100.0% #33457B	RGB 51 69 123	#33457B

#8C92C3 #7D85B7 #6E78AB #5F6B9F #505E93 #415187 #33457B

#8C92C3 - #33457B

HSV Blend

#8C92C3 - #33457B | 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 #8C92C3 as 0% and #33457B as 100%.

0.0%	0.0% #8C92C3	RGB 140 146 195	#8C92C3
16.7%	16.7% #7A82B7	RGB 122 130 183	#7A82B7
33.3%	33.3% #6973AB	RGB 105 115 171	#6973AB
50.0%	50.0% #5A669F	RGB 90 102 159	#5A669F
66.7%	66.7% #4B5A93	RGB 75 90 147	#4B5A93
83.3%	83.3% #3E4F87	RGB 62 79 135	#3E4F87
100.0%	100.0% #33457B	RGB 51 69 123	#33457B

#8C92C3 #7A82B7 #6973AB #5A669F #4B5A93 #3E4F87 #33457B

#8C92C3 - #5A669F - #33457B

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8C92C3 0%, #5A669F 50%, #33457B 100%);
    background: -webkit-linear-gradient(top, #8C92C3 0%, #5A669F 50%, #33457B 100%);
    background: linear-gradient(to bottom, #8C92C3 0%, #5A669F 50%, #33457B 100%);
}
</style>