#8BD5E2 - #398BAF | 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 #8BD5E2 to #398BAF

#8BD5E2 #398BAF

Calculate the color between two colors, #8BD5E2 and #398BAF. 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)

#8BD5E2 - #398BAF | 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 #8BD5E2 as 0% and #398BAF as 100%.

0.0%	0.0% #8BD5E2	RGB 139 213 226	#8BD5E2
16.7%	16.7% #7DC8D9	RGB 125 200 217	#7DC8D9
33.3%	33.3% #6FBCD1	RGB 111 188 209	#6FBCD1
50.0%	50.0% #62B0C8	RGB 98 176 200	#62B0C8
66.7%	66.7% #54A3C0	RGB 84 163 192	#54A3C0
83.3%	83.3% #4697B7	RGB 70 151 183	#4697B7
100.0%	100.0% #398BAF	RGB 57 139 175	#398BAF

#8BD5E2 #7DC8D9 #6FBCD1 #62B0C8 #54A3C0 #4697B7 #398BAF

#8BD5E2 - #398BAF

HSV Blend

#8BD5E2 - #398BAF | 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 #8BD5E2 as 0% and #398BAF as 100%.

0.0%	0.0% #8BD5E2	RGB 139 213 226	#8BD5E2
16.7%	16.7% #7BC8D9	RGB 123 200 217	#7BC8D9
33.3%	33.3% #6CBCD1	RGB 108 188 209	#6CBCD1
50.0%	50.0% #5EB0C8	RGB 94 176 200	#5EB0C8
66.7%	66.7% #51A3C0	RGB 81 163 192	#51A3C0
83.3%	83.3% #4497B7	RGB 68 151 183	#4497B7
100.0%	100.0% #398BAF	RGB 57 139 175	#398BAF

#8BD5E2 #7BC8D9 #6CBCD1 #5EB0C8 #51A3C0 #4497B7 #398BAF

#8BD5E2 - #5EB0C8 - #398BAF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #8BD5E2 0%, #5EB0C8 50%, #398BAF 100%);
    background: -webkit-linear-gradient(top, #8BD5E2 0%, #5EB0C8 50%, #398BAF 100%);
    background: linear-gradient(to bottom, #8BD5E2 0%, #5EB0C8 50%, #398BAF 100%);
}
</style>