#3C8CAA - #1C4359 | 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 #3C8CAA to #1C4359

#3C8CAA #1C4359

Calculate the color between two colors, #3C8CAA and #1C4359. 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)

#3C8CAA - #1C4359 | 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 #3C8CAA as 0% and #1C4359 as 100%.

0.0%	0.0% #3C8CAA	RGB 60 140 170	#3C8CAA
16.7%	16.7% #367F9C	RGB 54 127 156	#367F9C
33.3%	33.3% #31738F	RGB 49 115 143	#31738F
50.0%	50.0% #2C6781	RGB 44 103 129	#2C6781
66.7%	66.7% #265B74	RGB 38 91 116	#265B74
83.3%	83.3% #214F66	RGB 33 79 102	#214F66
100.0%	100.0% #1C4359	RGB 28 67 89	#1C4359

#3C8CAA #367F9C #31738F #2C6781 #265B74 #214F66 #1C4359

#3C8CAA - #1C4359

HSV Blend

#3C8CAA - #1C4359 | 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 #3C8CAA as 0% and #1C4359 as 100%.

0.0%	0.0% #3C8BAA	RGB 60 139 170	#3C8BAA
16.7%	16.7% #367F9C	RGB 54 127 156	#367F9C
33.3%	33.3% #30728F	RGB 48 114 143	#30728F
50.0%	50.0% #2B6681	RGB 43 102 129	#2B6681
66.7%	66.7% #255A74	RGB 37 90 116	#255A74
83.3%	83.3% #204E66	RGB 32 78 102	#204E66
100.0%	100.0% #1C4359	RGB 28 67 89	#1C4359

#3C8BAA #367F9C #30728F #2B6681 #255A74 #204E66 #1C4359

#3C8CAA - #2B6681 - #1C4359

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C8BAA 0%, #2B6681 50%, #1C4359 100%);
    background: -webkit-linear-gradient(top, #3C8BAA 0%, #2B6681 50%, #1C4359 100%);
    background: linear-gradient(to bottom, #3C8BAA 0%, #2B6681 50%, #1C4359 100%);
}
</style>