#2D6B5B - #7F77B7 | 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 #2D6B5B to #7F77B7

#2D6B5B #7F77B7

Calculate the color between two colors, #2D6B5B and #7F77B7. 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)

#2D6B5B - #7F77B7 | 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 #2D6B5B as 0% and #7F77B7 as 100%.

0.0%	0.0% #2D6B5B	RGB 45 107 91	#2D6B5B
16.7%	16.7% #3A6D6A	RGB 58 109 106	#3A6D6A
33.3%	33.3% #486F79	RGB 72 111 121	#486F79
50.0%	50.0% #567189	RGB 86 113 137	#567189
66.7%	66.7% #637398	RGB 99 115 152	#637398
83.3%	83.3% #7175A7	RGB 113 117 167	#7175A7
100.0%	100.0% #7F77B7	RGB 127 119 183	#7F77B7

#2D6B5B #3A6D6A #486F79 #567189 #637398 #7175A7 #7F77B7

#2D6B5B - #7F77B7

HSV Blend

#2D6B5B - #7F77B7 | 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 #2D6B5B as 0% and #7F77B7 as 100%.

0.0%	0.0% #2D6B5B	RGB 45 107 91	#2D6B5B
16.7%	16.7% #367775	RGB 54 119 117	#367775
33.3%	33.3% #417684	RGB 65 118 132	#417684
50.0%	50.0% #4D7391	RGB 77 115 145	#4D7391
66.7%	66.7% #5A719D	RGB 90 113 157	#5A719D
83.3%	83.3% #686FAA	RGB 104 111 170	#686FAA
100.0%	100.0% #7F77B7	RGB 127 119 183	#7F77B7

#2D6B5B #367775 #417684 #4D7391 #5A719D #686FAA #7F77B7

#2D6B5B - #4D7391 - #7F77B7

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D6B5B 0%, #4D7391 50%, #7F77B7 100%);
    background: -webkit-linear-gradient(top, #2D6B5B 0%, #4D7391 50%, #7F77B7 100%);
    background: linear-gradient(to bottom, #2D6B5B 0%, #4D7391 50%, #7F77B7 100%);
}
</style>