#3CA3A8 - #1D565D | 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 #3CA3A8 to #1D565D

#3CA3A8 #1D565D

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

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

0.0%	0.0% #3CA3A8	RGB 60 163 168	#3CA3A8
16.7%	16.7% #36969B	RGB 54 150 155	#36969B
33.3%	33.3% #31898F	RGB 49 137 143	#31898F
50.0%	50.0% #2C7C82	RGB 44 124 130	#2C7C82
66.7%	66.7% #276F76	RGB 39 111 118	#276F76
83.3%	83.3% #226269	RGB 34 98 105	#226269
100.0%	100.0% #1D565D	RGB 29 86 93	#1D565D

#3CA3A8 #36969B #31898F #2C7C82 #276F76 #226269 #1D565D

#3CA3A8 - #1D565D

HSV Blend

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

0.0%	0.0% #3CA3A8	RGB 60 163 168	#3CA3A8
16.7%	16.7% #36959B	RGB 54 149 155	#36959B
33.3%	33.3% #30888F	RGB 48 136 143	#30888F
50.0%	50.0% #2B7B82	RGB 43 123 130	#2B7B82
66.7%	66.7% #266E76	RGB 38 110 118	#266E76
83.3%	83.3% #216269	RGB 33 98 105	#216269
100.0%	100.0% #1D565D	RGB 29 86 93	#1D565D

#3CA3A8 #36959B #30888F #2B7B82 #266E76 #216269 #1D565D

#3CA3A8 - #2B7B82 - #1D565D

CSS codes

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

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