#00B4D1 - #036A8D | 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 #00B4D1 to #036A8D

#00B4D1 #036A8D

Calculate the color between two colors, #00B4D1 and #036A8D. 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)

#00B4D1 - #036A8D | 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 #00B4D1 as 0% and #036A8D as 100%.

0.0%	0.0% #00B4D1	RGB 0 180 209	#00B4D1
16.7%	16.7% #00A7C5	RGB 0 167 197	#00A7C5
33.3%	33.3% #019BBA	RGB 1 155 186	#019BBA
50.0%	50.0% #018FAF	RGB 1 143 175	#018FAF
66.7%	66.7% #0282A3	RGB 2 130 163	#0282A3
83.3%	83.3% #027698	RGB 2 118 152	#027698
100.0%	100.0% #036A8D	RGB 3 106 141	#036A8D

#00B4D1 #00A7C5 #019BBA #018FAF #0282A3 #027698 #036A8D

#00B4D1 - #036A8D

HSV Blend

#00B4D1 - #036A8D | 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 #00B4D1 as 0% and #036A8D as 100%.

0.0%	0.0% #00B4D1	RGB 0 180 209	#00B4D1
16.7%	16.7% #00A6C5	RGB 0 166 197	#00A6C5
33.3%	33.3% #0199BA	RGB 1 153 186	#0199BA
50.0%	50.0% #018DAF	RGB 1 141 175	#018DAF
66.7%	66.7% #0280A3	RGB 2 128 163	#0280A3
83.3%	83.3% #027598	RGB 2 117 152	#027598
100.0%	100.0% #036A8D	RGB 3 106 141	#036A8D

#00B4D1 #00A6C5 #0199BA #018DAF #0280A3 #027598 #036A8D

#00B4D1 - #018DAF - #036A8D

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00B4D1 0%, #018DAF 50%, #036A8D 100%);
    background: -webkit-linear-gradient(top, #00B4D1 0%, #018DAF 50%, #036A8D 100%);
    background: linear-gradient(to bottom, #00B4D1 0%, #018DAF 50%, #036A8D 100%);
}
</style>