#0B7396 - #8ECDC9 | 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 #0B7396 to #8ECDC9

#0B7396 #8ECDC9

Calculate the color between two colors, #0B7396 and #8ECDC9. 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)

#0B7396 - #8ECDC9 | 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 #0B7396 as 0% and #8ECDC9 as 100%.

0.0%	0.0% #0B7396	RGB 11 115 150	#0B7396
16.7%	16.7% #20829E	RGB 32 130 158	#20829E
33.3%	33.3% #3691A7	RGB 54 145 167	#3691A7
50.0%	50.0% #4CA0AF	RGB 76 160 175	#4CA0AF
66.7%	66.7% #62AFB8	RGB 98 175 184	#62AFB8
83.3%	83.3% #78BEC0	RGB 120 190 192	#78BEC0
100.0%	100.0% #8ECDC9	RGB 142 205 201	#8ECDC9

#0B7396 #20829E #3691A7 #4CA0AF #62AFB8 #78BEC0 #8ECDC9

#0B7396 - #8ECDC9

HSV Blend

#0B7396 - #8ECDC9 | 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 #0B7396 as 0% and #8ECDC9 as 100%.

0.0%	0.0% #0A7296	RGB 10 114 150	#0A7296
16.7%	16.7% #1C859F	RGB 28 133 159	#1C859F
33.3%	33.3% #2F96A8	RGB 47 150 168	#2F96A8
50.0%	50.0% #43A7B1	RGB 67 167 177	#43A7B1
66.7%	66.7% #5AB6BA	RGB 90 182 186	#5AB6BA
83.3%	83.3% #73C3C2	RGB 115 195 194	#73C3C2
100.0%	100.0% #8ECDC9	RGB 142 205 201	#8ECDC9

#0A7296 #1C859F #2F96A8 #43A7B1 #5AB6BA #73C3C2 #8ECDC9

#0B7396 - #43A7B1 - #8ECDC9

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0A7296 0%, #43A7B1 50%, #8ECDC9 100%);
    background: -webkit-linear-gradient(top, #0A7296 0%, #43A7B1 50%, #8ECDC9 100%);
    background: linear-gradient(to bottom, #0A7296 0%, #43A7B1 50%, #8ECDC9 100%);
}
</style>