#3C9CB2 - #1B5165 | 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 #3C9CB2 to #1B5165

#3C9CB2 #1B5165

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

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

0.0%	0.0% #3C9CB2	RGB 60 156 178	#3C9CB2
16.7%	16.7% #368FA5	RGB 54 143 165	#368FA5
33.3%	33.3% #318398	RGB 49 131 152	#318398
50.0%	50.0% #2B768B	RGB 43 118 139	#2B768B
66.7%	66.7% #266A7E	RGB 38 106 126	#266A7E
83.3%	83.3% #205D71	RGB 32 93 113	#205D71
100.0%	100.0% #1B5165	RGB 27 81 101	#1B5165

#3C9CB2 #368FA5 #318398 #2B768B #266A7E #205D71 #1B5165

#3C9CB2 - #1B5165

HSV Blend

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

0.0%	0.0% #3C9CB2	RGB 60 156 178	#3C9CB2
16.7%	16.7% #358EA5	RGB 53 142 165	#358EA5
33.3%	33.3% #2F8198	RGB 47 129 152	#2F8198
50.0%	50.0% #2A758B	RGB 42 117 139	#2A758B
66.7%	66.7% #24687E	RGB 36 104 126	#24687E
83.3%	83.3% #1F5C71	RGB 31 92 113	#1F5C71
100.0%	100.0% #1B5165	RGB 27 81 101	#1B5165

#3C9CB2 #358EA5 #2F8198 #2A758B #24687E #1F5C71 #1B5165

#3C9CB2 - #2A758B - #1B5165

CSS codes

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

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