#2F3A8C - #6E84BD | 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 #2F3A8C to #6E84BD

#2F3A8C #6E84BD

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

#2F3A8C - #6E84BD | 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 #2F3A8C as 0% and #6E84BD as 100%.

0.0%	0.0% #2F3A8C	RGB 47 58 140	#2F3A8C
16.7%	16.7% #394694	RGB 57 70 148	#394694
33.3%	33.3% #44529C	RGB 68 82 156	#44529C
50.0%	50.0% #4E5FA4	RGB 78 95 164	#4E5FA4
66.7%	66.7% #596BAC	RGB 89 107 172	#596BAC
83.3%	83.3% #6377B4	RGB 99 119 180	#6377B4
100.0%	100.0% #6E84BD	RGB 110 132 189	#6E84BD

#2F3A8C #394694 #44529C #4E5FA4 #596BAC #6377B4 #6E84BD

#2F3A8C - #6E84BD

HSV Blend

#2F3A8C - #6E84BD | 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 #2F3A8C as 0% and #6E84BD as 100%.

0.0%	0.0% #2F3A8C	RGB 47 58 140	#2F3A8C
16.7%	16.7% #374594	RGB 55 69 148	#374594
33.3%	33.3% #41509C	RGB 65 80 156	#41509C
50.0%	50.0% #4B5DA4	RGB 75 93 164	#4B5DA4
66.7%	66.7% #5669AC	RGB 86 105 172	#5669AC
83.3%	83.3% #6176B4	RGB 97 118 180	#6176B4
100.0%	100.0% #6E84BD	RGB 110 132 189	#6E84BD

#2F3A8C #374594 #41509C #4B5DA4 #5669AC #6176B4 #6E84BD

#2F3A8C - #4B5DA4 - #6E84BD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2F3A8C 0%, #4B5DA4 50%, #6E84BD 100%);
    background: -webkit-linear-gradient(top, #2F3A8C 0%, #4B5DA4 50%, #6E84BD 100%);
    background: linear-gradient(to bottom, #2F3A8C 0%, #4B5DA4 50%, #6E84BD 100%);
}
</style>