#3A8CB1 - #1A435F | 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 #3A8CB1 to #1A435F

#3A8CB1 #1A435F

Calculate the color between two colors, #3A8CB1 and #1A435F. 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)

#3A8CB1 - #1A435F | 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 #3A8CB1 as 0% and #1A435F as 100%.

0.0%	0.0% #3A8CB1	RGB 58 140 177	#3A8CB1
16.7%	16.7% #347FA3	RGB 52 127 163	#347FA3
33.3%	33.3% #2F7395	RGB 47 115 149	#2F7395
50.0%	50.0% #2A6788	RGB 42 103 136	#2A6788
66.7%	66.7% #245B7A	RGB 36 91 122	#245B7A
83.3%	83.3% #1F4F6C	RGB 31 79 108	#1F4F6C
100.0%	100.0% #1A435F	RGB 26 67 95	#1A435F

#3A8CB1 #347FA3 #2F7395 #2A6788 #245B7A #1F4F6C #1A435F

#3A8CB1 - #1A435F

HSV Blend

#3A8CB1 - #1A435F | 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 #3A8CB1 as 0% and #1A435F as 100%.

0.0%	0.0% #3A8CB1	RGB 58 140 177	#3A8CB1
16.7%	16.7% #347EA3	RGB 52 126 163	#347EA3
33.3%	33.3% #2E7295	RGB 46 114 149	#2E7295
50.0%	50.0% #286588	RGB 40 101 136	#286588
66.7%	66.7% #23597A	RGB 35 89 122	#23597A
83.3%	83.3% #1E4E6C	RGB 30 78 108	#1E4E6C
100.0%	100.0% #1A435F	RGB 26 67 95	#1A435F

#3A8CB1 #347EA3 #2E7295 #286588 #23597A #1E4E6C #1A435F

#3A8CB1 - #286588 - #1A435F

CSS codes

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

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