#3D3DA1 - #7687CD | 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 #3D3DA1 to #7687CD

#3D3DA1 #7687CD

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

#3D3DA1 - #7687CD | 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 #3D3DA1 as 0% and #7687CD as 100%.

0.0%	0.0% #3D3DA1	RGB 61 61 161	#3D3DA1
16.7%	16.7% #4649A8	RGB 70 73 168	#4649A8
33.3%	33.3% #5055AF	RGB 80 85 175	#5055AF
50.0%	50.0% #5962B7	RGB 89 98 183	#5962B7
66.7%	66.7% #636EBE	RGB 99 110 190	#636EBE
83.3%	83.3% #6C7AC5	RGB 108 122 197	#6C7AC5
100.0%	100.0% #7687CD	RGB 118 135 205	#7687CD

#3D3DA1 #4649A8 #5055AF #5962B7 #636EBE #6C7AC5 #7687CD

#3D3DA1 - #7687CD

HSV Blend

#3D3DA1 - #7687CD | 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 #3D3DA1 as 0% and #7687CD as 100%.

0.0%	0.0% #3D3DA1	RGB 61 61 161	#3D3DA1
16.7%	16.7% #4548A8	RGB 69 72 168	#4548A8
33.3%	33.3% #4E54AF	RGB 78 84 175	#4E54AF
50.0%	50.0% #5760B7	RGB 87 96 183	#5760B7
66.7%	66.7% #616DBE	RGB 97 109 190	#616DBE
83.3%	83.3% #6B7AC5	RGB 107 122 197	#6B7AC5
100.0%	100.0% #7687CD	RGB 118 135 205	#7687CD

#3D3DA1 #4548A8 #4E54AF #5760B7 #616DBE #6B7AC5 #7687CD

#3D3DA1 - #5760B7 - #7687CD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3D3DA1 0%, #5760B7 50%, #7687CD 100%);
    background: -webkit-linear-gradient(top, #3D3DA1 0%, #5760B7 50%, #7687CD 100%);
    background: linear-gradient(to bottom, #3D3DA1 0%, #5760B7 50%, #7687CD 100%);
}
</style>