#3B5E4C - #6E7AD6 | 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 #3B5E4C to #6E7AD6

#3B5E4C #6E7AD6

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

#3B5E4C - #6E7AD6 | 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 #3B5E4C as 0% and #6E7AD6 as 100%.

0.0%	0.0% #3B5E4C	RGB 59 94 76	#3B5E4C
16.7%	16.7% #436263	RGB 67 98 99	#436263
33.3%	33.3% #4C677A	RGB 76 103 122	#4C677A
50.0%	50.0% #546C91	RGB 84 108 145	#546C91
66.7%	66.7% #5D70A8	RGB 93 112 168	#5D70A8
83.3%	83.3% #6575BF	RGB 101 117 191	#6575BF
100.0%	100.0% #6E7AD6	RGB 110 122 214	#6E7AD6

#3B5E4C #436263 #4C677A #546C91 #5D70A8 #6575BF #6E7AD6

#3B5E4C - #6E7AD6

HSV Blend

#3B5E4C - #6E7AD6 | 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 #3B5E4C as 0% and #6E7AD6 as 100%.

0.0%	0.0% #3B5E4C	RGB 59 94 76	#3B5E4C
16.7%	16.7% #457265	RGB 69 114 101	#457265
33.3%	33.3% #4F8683	RGB 79 134 131	#4F8683
50.0%	50.0% #578D9A	RGB 87 141 154	#578D9A
66.7%	66.7% #608DAE	RGB 96 141 174	#608DAE
83.3%	83.3% #6786C2	RGB 103 134 194	#6786C2
100.0%	100.0% #6E7AD6	RGB 110 122 214	#6E7AD6

#3B5E4C #457265 #4F8683 #578D9A #608DAE #6786C2 #6E7AD6

#3B5E4C - #578D9A - #6E7AD6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3B5E4C 0%, #578D9A 50%, #6E7AD6 100%);
    background: -webkit-linear-gradient(top, #3B5E4C 0%, #578D9A 50%, #6E7AD6 100%);
    background: linear-gradient(to bottom, #3B5E4C 0%, #578D9A 50%, #6E7AD6 100%);
}
</style>