#1A3043 - #BDC3C9 | 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 #1A3043 to #BDC3C9

#1A3043 #BDC3C9

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

#1A3043 - #BDC3C9 | 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 #1A3043 as 0% and #BDC3C9 as 100%.

0.0%	0.0% #1A3043	RGB 26 48 67	#1A3043
16.7%	16.7% #354859	RGB 53 72 89	#354859
33.3%	33.3% #50616F	RGB 80 97 111	#50616F
50.0%	50.0% #6B7986	RGB 107 121 134	#6B7986
66.7%	66.7% #86929C	RGB 134 146 156	#86929C
83.3%	83.3% #A1AAB2	RGB 161 170 178	#A1AAB2
100.0%	100.0% #BDC3C9	RGB 189 195 201	#BDC3C9

#1A3043 #354859 #50616F #6B7986 #86929C #A1AAB2 #BDC3C9

#1A3043 - #BDC3C9

HSV Blend

#1A3043 - #BDC3C9 | 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 #1A3043 as 0% and #BDC3C9 as 100%.

0.0%	0.0% #1A3043	RGB 26 48 67	#1A3043
16.7%	16.7% #2A4359	RGB 42 67 89	#2A4359
33.3%	33.3% #3F586F	RGB 63 88 111	#3F586F
50.0%	50.0% #597086	RGB 89 112 134	#597086
66.7%	66.7% #76899C	RGB 118 137 156	#76899C
83.3%	83.3% #97A5B2	RGB 151 165 178	#97A5B2
100.0%	100.0% #BDC3C9	RGB 189 195 201	#BDC3C9

#1A3043 #2A4359 #3F586F #597086 #76899C #97A5B2 #BDC3C9

#1A3043 - #597086 - #BDC3C9

CSS codes

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

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