#5F8ACD - #B5E5B7 | 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 #5F8ACD to #B5E5B7

#5F8ACD #B5E5B7

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

#5F8ACD - #B5E5B7 | 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 #5F8ACD as 0% and #B5E5B7 as 100%.

0.0%	0.0% #5F8ACD	RGB 95 138 205	#5F8ACD
16.7%	16.7% #6D99C9	RGB 109 153 201	#6D99C9
33.3%	33.3% #7BA8C5	RGB 123 168 197	#7BA8C5
50.0%	50.0% #8AB7C2	RGB 138 183 194	#8AB7C2
66.7%	66.7% #98C6BE	RGB 152 198 190	#98C6BE
83.3%	83.3% #A6D5BA	RGB 166 213 186	#A6D5BA
100.0%	100.0% #B5E5B7	RGB 181 229 183	#B5E5B7

#5F8ACD #6D99C9 #7BA8C5 #8AB7C2 #98C6BE #A6D5BA #B5E5B7

#5F8ACD - #B5E5B7

HSV Blend

#5F8ACD - #B5E5B7 | 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 #5F8ACD as 0% and #B5E5B7 as 100%.

0.0%	0.0% #5F89CD	RGB 95 137 205	#5F89CD
16.7%	16.7% #6CADD1	RGB 108 173 209	#6CADD1
33.3%	33.3% #79CDD5	RGB 121 205 213	#79CDD5
50.0%	50.0% #88D9CA	RGB 136 217 202	#88D9CA
66.7%	66.7% #96DDBE	RGB 150 221 190	#96DDBE
83.3%	83.3% #A5E1B7	RGB 165 225 183	#A5E1B7
100.0%	100.0% #B5E5B7	RGB 181 229 183	#B5E5B7

#5F89CD #6CADD1 #79CDD5 #88D9CA #96DDBE #A5E1B7 #B5E5B7

#5F8ACD - #88D9CA - #B5E5B7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5F89CD 0%, #88D9CA 50%, #B5E5B7 100%);
    background: -webkit-linear-gradient(top, #5F89CD 0%, #88D9CA 50%, #B5E5B7 100%);
    background: linear-gradient(to bottom, #5F89CD 0%, #88D9CA 50%, #B5E5B7 100%);
}
</style>