#56A8D0 - #1C5A8C | 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 #56A8D0 to #1C5A8C

#56A8D0 #1C5A8C

Calculate the color between two colors, #56A8D0 and #1C5A8C. 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)

#56A8D0 - #1C5A8C | 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 #56A8D0 as 0% and #1C5A8C as 100%.

0.0%	0.0% #56A8D0	RGB 86 168 208	#56A8D0
16.7%	16.7% #4C9BC4	RGB 76 155 196	#4C9BC4
33.3%	33.3% #428EB9	RGB 66 142 185	#428EB9
50.0%	50.0% #3981AE	RGB 57 129 174	#3981AE
66.7%	66.7% #2F74A2	RGB 47 116 162	#2F74A2
83.3%	83.3% #256797	RGB 37 103 151	#256797
100.0%	100.0% #1C5A8C	RGB 28 90 140	#1C5A8C

#56A8D0 #4C9BC4 #428EB9 #3981AE #2F74A2 #256797 #1C5A8C

#56A8D0 - #1C5A8C

HSV Blend

#56A8D0 - #1C5A8C | 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 #56A8D0 as 0% and #1C5A8C as 100%.

0.0%	0.0% #56A8D0	RGB 86 168 208	#56A8D0
16.7%	16.7% #4A9AC4	RGB 74 154 196	#4A9AC4
33.3%	33.3% #3F8CB9	RGB 63 140 185	#3F8CB9
50.0%	50.0% #357FAE	RGB 53 127 174	#357FAE
66.7%	66.7% #2C72A2	RGB 44 114 162	#2C72A2
83.3%	83.3% #236597	RGB 35 101 151	#236597
100.0%	100.0% #1C5A8C	RGB 28 90 140	#1C5A8C

#56A8D0 #4A9AC4 #3F8CB9 #357FAE #2C72A2 #236597 #1C5A8C

#56A8D0 - #357FAE - #1C5A8C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #56A8D0 0%, #357FAE 50%, #1C5A8C 100%);
    background: -webkit-linear-gradient(top, #56A8D0 0%, #357FAE 50%, #1C5A8C 100%);
    background: linear-gradient(to bottom, #56A8D0 0%, #357FAE 50%, #1C5A8C 100%);
}
</style>