#0170B0 - #74CDDF | 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 #0170B0 to #74CDDF

#0170B0 #74CDDF

Calculate the color between two colors, #0170B0 and #74CDDF. 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)

#0170B0 - #74CDDF | 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 #0170B0 as 0% and #74CDDF as 100%.

0.0%	0.0% #0170B0	RGB 1 112 176	#0170B0
16.7%	16.7% #147FB7	RGB 20 127 183	#147FB7
33.3%	33.3% #278FBF	RGB 39 143 191	#278FBF
50.0%	50.0% #3A9EC7	RGB 58 158 199	#3A9EC7
66.7%	66.7% #4DAECF	RGB 77 174 207	#4DAECF
83.3%	83.3% #60BDD7	RGB 96 189 215	#60BDD7
100.0%	100.0% #74CDDF	RGB 116 205 223	#74CDDF

#0170B0 #147FB7 #278FBF #3A9EC7 #4DAECF #60BDD7 #74CDDF

#0170B0 - #74CDDF

HSV Blend

#0170B0 - #74CDDF | 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 #0170B0 as 0% and #74CDDF as 100%.

0.0%	0.0% #0070B0	RGB 0 112 176	#0070B0
16.7%	16.7% #1080B7	RGB 16 128 183	#1080B7
33.3%	33.3% #2190BF	RGB 33 144 191	#2190BF
50.0%	50.0% #34A0C7	RGB 52 160 199	#34A0C7
66.7%	66.7% #48AFCF	RGB 72 175 207	#48AFCF
83.3%	83.3% #5DBED7	RGB 93 190 215	#5DBED7
100.0%	100.0% #74CDDF	RGB 116 205 223	#74CDDF

#0070B0 #1080B7 #2190BF #34A0C7 #48AFCF #5DBED7 #74CDDF

#0170B0 - #34A0C7 - #74CDDF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0070B0 0%, #34A0C7 50%, #74CDDF 100%);
    background: -webkit-linear-gradient(top, #0070B0 0%, #34A0C7 50%, #74CDDF 100%);
    background: linear-gradient(to bottom, #0070B0 0%, #34A0C7 50%, #74CDDF 100%);
}
</style>