#2D3E4A - #686B75 | 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 #2D3E4A to #686B75

#2D3E4A #686B75

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

#2D3E4A - #686B75 | 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 #2D3E4A as 0% and #686B75 as 100%.

0.0%	0.0% #2D3E4A	RGB 45 62 74	#2D3E4A
16.7%	16.7% #364551	RGB 54 69 81	#364551
33.3%	33.3% #404D58	RGB 64 77 88	#404D58
50.0%	50.0% #4A545F	RGB 74 84 95	#4A545F
66.7%	66.7% #545C66	RGB 84 92 102	#545C66
83.3%	83.3% #5E636D	RGB 94 99 109	#5E636D
100.0%	100.0% #686B75	RGB 104 107 117	#686B75

#2D3E4A #364551 #404D58 #4A545F #545C66 #5E636D #686B75

#2D3E4A - #686B75

HSV Blend

#2D3E4A - #686B75 | 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 #2D3E4A as 0% and #686B75 as 100%.

0.0%	0.0% #2D3E4A	RGB 45 62 74	#2D3E4A
16.7%	16.7% #354351	RGB 53 67 81	#354351
33.3%	33.3% #3D4A58	RGB 61 74 88	#3D4A58
50.0%	50.0% #47515F	RGB 71 81 95	#47515F
66.7%	66.7% #515866	RGB 81 88 102	#515866
83.3%	83.3% #5C616D	RGB 92 97 109	#5C616D
100.0%	100.0% #686B75	RGB 104 107 117	#686B75

#2D3E4A #354351 #3D4A58 #47515F #515866 #5C616D #686B75

#2D3E4A - #47515F - #686B75

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D3E4A 0%, #47515F 50%, #686B75 100%);
    background: -webkit-linear-gradient(top, #2D3E4A 0%, #47515F 50%, #686B75 100%);
    background: linear-gradient(to bottom, #2D3E4A 0%, #47515F 50%, #686B75 100%);
}
</style>