#5F5A8C - #8CCAB9 | 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 #5F5A8C to #8CCAB9

#5F5A8C #8CCAB9

Calculate the color between two colors, #5F5A8C and #8CCAB9. 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)

#5F5A8C - #8CCAB9 | 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 #5F5A8C as 0% and #8CCAB9 as 100%.

0.0%	0.0% #5F5A8C	RGB 95 90 140	#5F5A8C
16.7%	16.7% #666C93	RGB 102 108 147	#666C93
33.3%	33.3% #6E7F9B	RGB 110 127 155	#6E7F9B
50.0%	50.0% #7592A2	RGB 117 146 162	#7592A2
66.7%	66.7% #7DA4AA	RGB 125 164 170	#7DA4AA
83.3%	83.3% #84B7B1	RGB 132 183 177	#84B7B1
100.0%	100.0% #8CCAB9	RGB 140 202 185	#8CCAB9

#5F5A8C #666C93 #6E7F9B #7592A2 #7DA4AA #84B7B1 #8CCAB9

#5F5A8C - #8CCAB9

HSV Blend

#5F5A8C - #8CCAB9 | 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 #5F5A8C as 0% and #8CCAB9 as 100%.

0.0%	0.0% #5F5A8C	RGB 95 90 140	#5F5A8C
16.7%	16.7% #616896	RGB 97 104 150	#616896
33.3%	33.3% #697DA0	RGB 105 125 160	#697DA0
50.0%	50.0% #7293AB	RGB 114 147 171	#7293AB
66.7%	66.7% #7AAAB5	RGB 122 170 181	#7AAAB5
83.3%	83.3% #83BFBC	RGB 131 191 188	#83BFBC
100.0%	100.0% #8CCAB9	RGB 140 202 185	#8CCAB9

#5F5A8C #616896 #697DA0 #7293AB #7AAAB5 #83BFBC #8CCAB9

#5F5A8C - #7293AB - #8CCAB9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5F5A8C 0%, #7293AB 50%, #8CCAB9 100%);
    background: -webkit-linear-gradient(top, #5F5A8C 0%, #7293AB 50%, #8CCAB9 100%);
    background: linear-gradient(to bottom, #5F5A8C 0%, #7293AB 50%, #8CCAB9 100%);
}
</style>