#535E5E - #7898DA | 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 #535E5E to #7898DA

#535E5E #7898DA

Calculate the color between two colors, #535E5E and #7898DA. 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)

#535E5E - #7898DA | 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 #535E5E as 0% and #7898DA as 100%.

0.0%	0.0% #535E5E	RGB 83 94 94	#535E5E
16.7%	16.7% #596772	RGB 89 103 114	#596772
33.3%	33.3% #5F7187	RGB 95 113 135	#5F7187
50.0%	50.0% #657B9C	RGB 101 123 156	#657B9C
66.7%	66.7% #6B84B0	RGB 107 132 176	#6B84B0
83.3%	83.3% #718EC5	RGB 113 142 197	#718EC5
100.0%	100.0% #7898DA	RGB 120 152 218	#7898DA

#535E5E #596772 #5F7187 #657B9C #6B84B0 #718EC5 #7898DA

#535E5E - #7898DA

HSV Blend

#535E5E - #7898DA | 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 #535E5E as 0% and #7898DA as 100%.

0.0%	0.0% #535E5E	RGB 83 94 94	#535E5E
16.7%	16.7% #5E7072	RGB 94 112 114	#5E7072
33.3%	33.3% #688087	RGB 104 128 135	#688087
50.0%	50.0% #6F8D9C	RGB 111 141 156	#6F8D9C
66.7%	66.7% #7495B0	RGB 116 149 176	#7495B0
83.3%	83.3% #7799C5	RGB 119 153 197	#7799C5
100.0%	100.0% #7898DA	RGB 120 152 218	#7898DA

#535E5E #5E7072 #688087 #6F8D9C #7495B0 #7799C5 #7898DA

#535E5E - #6F8D9C - #7898DA

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #535E5E 0%, #6F8D9C 50%, #7898DA 100%);
    background: -webkit-linear-gradient(top, #535E5E 0%, #6F8D9C 50%, #7898DA 100%);
    background: linear-gradient(to bottom, #535E5E 0%, #6F8D9C 50%, #7898DA 100%);
}
</style>