#00ABD3 - #154A70 | 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 #00ABD3 to #154A70

#00ABD3 #154A70

Calculate the color between two colors, #00ABD3 and #154A70. 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)

#00ABD3 - #154A70 | 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 #00ABD3 as 0% and #154A70 as 100%.

0.0%	0.0% #00ABD3	RGB 0 171 211	#00ABD3
16.7%	16.7% #039AC2	RGB 3 154 194	#039AC2
33.3%	33.3% #078AB2	RGB 7 138 178	#078AB2
50.0%	50.0% #0A7AA1	RGB 10 122 161	#0A7AA1
66.7%	66.7% #0E6A91	RGB 14 106 145	#0E6A91
83.3%	83.3% #115A80	RGB 17 90 128	#115A80
100.0%	100.0% #154A70	RGB 21 74 112	#154A70

#00ABD3 #039AC2 #078AB2 #0A7AA1 #0E6A91 #115A80 #154A70

#00ABD3 - #154A70

HSV Blend

#00ABD3 - #154A70 | 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 #00ABD3 as 0% and #154A70 as 100%.

0.0%	0.0% #00ABD3	RGB 0 171 211	#00ABD3
16.7%	16.7% #0697C2	RGB 6 151 194	#0697C2
33.3%	33.3% #0B85B2	RGB 11 133 178	#0B85B2
50.0%	50.0% #0F75A1	RGB 15 117 161	#0F75A1
66.7%	66.7% #126591	RGB 18 101 145	#126591
83.3%	83.3% #145780	RGB 20 87 128	#145780
100.0%	100.0% #154A70	RGB 21 74 112	#154A70

#00ABD3 #0697C2 #0B85B2 #0F75A1 #126591 #145780 #154A70

#00ABD3 - #0F75A1 - #154A70

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #00ABD3 0%, #0F75A1 50%, #154A70 100%);
    background: -webkit-linear-gradient(top, #00ABD3 0%, #0F75A1 50%, #154A70 100%);
    background: linear-gradient(to bottom, #00ABD3 0%, #0F75A1 50%, #154A70 100%);
}
</style>