#3F6383 - #062B5E | 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 #3F6383 to #062B5E

#3F6383 #062B5E

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

#3F6383 - #062B5E | 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 #3F6383 as 0% and #062B5E as 100%.

0.0%	0.0% #3F6383	RGB 63 99 131	#3F6383
16.7%	16.7% #35597C	RGB 53 89 124	#35597C
33.3%	33.3% #2C5076	RGB 44 80 118	#2C5076
50.0%	50.0% #224770	RGB 34 71 112	#224770
66.7%	66.7% #193D6A	RGB 25 61 106	#193D6A
83.3%	83.3% #0F3464	RGB 15 52 100	#0F3464
100.0%	100.0% #062B5E	RGB 6 43 94	#062B5E

#3F6383 #35597C #2C5076 #224770 #193D6A #0F3464 #062B5E

#3F6383 - #062B5E

HSV Blend

#3F6383 - #062B5E | 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 #3F6383 as 0% and #062B5E as 100%.

0.0%	0.0% #3F6383	RGB 63 99 131	#3F6383
16.7%	16.7% #33587C	RGB 51 88 124	#33587C
33.3%	33.3% #284F76	RGB 40 79 118	#284F76
50.0%	50.0% #1E4570	RGB 30 69 112	#1E4570
66.7%	66.7% #153C6A	RGB 21 60 106	#153C6A
83.3%	83.3% #0D3364	RGB 13 51 100	#0D3364
100.0%	100.0% #062B5E	RGB 6 43 94	#062B5E

#3F6383 #33587C #284F76 #1E4570 #153C6A #0D3364 #062B5E

#3F6383 - #1E4570 - #062B5E

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3F6383 0%, #1E4570 50%, #062B5E 100%);
    background: -webkit-linear-gradient(top, #3F6383 0%, #1E4570 50%, #062B5E 100%);
    background: linear-gradient(to bottom, #3F6383 0%, #1E4570 50%, #062B5E 100%);
}
</style>