#3C4C5E - #CA7EA2 | 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 #3C4C5E to #CA7EA2

#3C4C5E #CA7EA2

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

#3C4C5E - #CA7EA2 | 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 #3C4C5E as 0% and #CA7EA2 as 100%.

0.0%	0.0% #3C4C5E	RGB 60 76 94	#3C4C5E
16.7%	16.7% #535469	RGB 83 84 105	#535469
33.3%	33.3% #6B5C74	RGB 107 92 116	#6B5C74
50.0%	50.0% #836580	RGB 131 101 128	#836580
66.7%	66.7% #9A6D8B	RGB 154 109 139	#9A6D8B
83.3%	83.3% #B27596	RGB 178 117 150	#B27596
100.0%	100.0% #CA7EA2	RGB 202 126 162	#CA7EA2

#3C4C5E #535469 #6B5C74 #836580 #9A6D8B #B27596 #CA7EA2

#3C4C5E - #CA7EA2

HSV Blend

#3C4C5E - #CA7EA2 | 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 #3C4C5E as 0% and #CA7EA2 as 100%.

0.0%	0.0% #3C4B5E	RGB 60 75 94	#3C4B5E
16.7%	16.7% #474C70	RGB 71 76 112	#474C70
33.3%	33.3% #5B5282	RGB 91 82 130	#5B5282
50.0%	50.0% #7A5D94	RGB 122 93 148	#7A5D94
66.7%	66.7% #9D68A6	RGB 157 104 166	#9D68A6
83.3%	83.3% #B873AA	RGB 184 115 170	#B873AA
100.0%	100.0% #CA7EA2	RGB 202 126 162	#CA7EA2

#3C4B5E #474C70 #5B5282 #7A5D94 #9D68A6 #B873AA #CA7EA2

#3C4C5E - #7A5D94 - #CA7EA2

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C4B5E 0%, #7A5D94 50%, #CA7EA2 100%);
    background: -webkit-linear-gradient(top, #3C4B5E 0%, #7A5D94 50%, #CA7EA2 100%);
    background: linear-gradient(to bottom, #3C4B5E 0%, #7A5D94 50%, #CA7EA2 100%);
}
</style>