#45A8C7 - #185C80 | 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 #45A8C7 to #185C80

#45A8C7 #185C80

Calculate the color between two colors, #45A8C7 and #185C80. 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)

#45A8C7 - #185C80 | 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 #45A8C7 as 0% and #185C80 as 100%.

0.0%	0.0% #45A8C7	RGB 69 168 199	#45A8C7
16.7%	16.7% #3D9BBB	RGB 61 155 187	#3D9BBB
33.3%	33.3% #368EAF	RGB 54 142 175	#368EAF
50.0%	50.0% #2E82A3	RGB 46 130 163	#2E82A3
66.7%	66.7% #277597	RGB 39 117 151	#277597
83.3%	83.3% #1F688B	RGB 31 104 139	#1F688B
100.0%	100.0% #185C80	RGB 24 92 128	#185C80

#45A8C7 #3D9BBB #368EAF #2E82A3 #277597 #1F688B #185C80

#45A8C7 - #185C80

HSV Blend

#45A8C7 - #185C80 | 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 #45A8C7 as 0% and #185C80 as 100%.

0.0%	0.0% #44A8C7	RGB 68 168 199	#44A8C7
16.7%	16.7% #3B9ABB	RGB 59 154 187	#3B9ABB
33.3%	33.3% #338DAF	RGB 51 141 175	#338DAF
50.0%	50.0% #2B80A3	RGB 43 128 163	#2B80A3
66.7%	66.7% #247397	RGB 36 115 151	#247397
83.3%	83.3% #1D678B	RGB 29 103 139	#1D678B
100.0%	100.0% #185C80	RGB 24 92 128	#185C80

#44A8C7 #3B9ABB #338DAF #2B80A3 #247397 #1D678B #185C80

#45A8C7 - #2B80A3 - #185C80

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #44A8C7 0%, #2B80A3 50%, #185C80 100%);
    background: -webkit-linear-gradient(top, #44A8C7 0%, #2B80A3 50%, #185C80 100%);
    background: linear-gradient(to bottom, #44A8C7 0%, #2B80A3 50%, #185C80 100%);
}
</style>