#3886A2 - #1D3E4F | 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 #3886A2 to #1D3E4F

#3886A2 #1D3E4F

Calculate the color between two colors, #3886A2 and #1D3E4F. 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)

#3886A2 - #1D3E4F | 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 #3886A2 as 0% and #1D3E4F as 100%.

0.0%	0.0% #3886A2	RGB 56 134 162	#3886A2
16.7%	16.7% #337A94	RGB 51 122 148	#337A94
33.3%	33.3% #2F6E86	RGB 47 110 134	#2F6E86
50.0%	50.0% #2A6278	RGB 42 98 120	#2A6278
66.7%	66.7% #26566A	RGB 38 86 106	#26566A
83.3%	83.3% #214A5C	RGB 33 74 92	#214A5C
100.0%	100.0% #1D3E4F	RGB 29 62 79	#1D3E4F

#3886A2 #337A94 #2F6E86 #2A6278 #26566A #214A5C #1D3E4F

#3886A2 - #1D3E4F

HSV Blend

#3886A2 - #1D3E4F | 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 #3886A2 as 0% and #1D3E4F as 100%.

0.0%	0.0% #3885A2	RGB 56 133 162	#3885A2
16.7%	16.7% #337994	RGB 51 121 148	#337994
33.3%	33.3% #2F6D86	RGB 47 109 134	#2F6D86
50.0%	50.0% #2A6178	RGB 42 97 120	#2A6178
66.7%	66.7% #26556A	RGB 38 85 106	#26556A
83.3%	83.3% #21495C	RGB 33 73 92	#21495C
100.0%	100.0% #1D3E4F	RGB 29 62 79	#1D3E4F

#3885A2 #337994 #2F6D86 #2A6178 #26556A #21495C #1D3E4F

#3886A2 - #2A6178 - #1D3E4F

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3885A2 0%, #2A6178 50%, #1D3E4F 100%);
    background: -webkit-linear-gradient(top, #3885A2 0%, #2A6178 50%, #1D3E4F 100%);
    background: linear-gradient(to bottom, #3885A2 0%, #2A6178 50%, #1D3E4F 100%);
}
</style>