#102439 - #BAC0C6 | 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 #102439 to #BAC0C6

#102439 #BAC0C6

Calculate the color between two colors, #102439 and #BAC0C6. 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)

#102439 - #BAC0C6 | 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 #102439 as 0% and #BAC0C6 as 100%.

0.0%	0.0% #102439	RGB 16 36 57	#102439
16.7%	16.7% #2C3E50	RGB 44 62 80	#2C3E50
33.3%	33.3% #485868	RGB 72 88 104	#485868
50.0%	50.0% #65727F	RGB 101 114 127	#65727F
66.7%	66.7% #818C97	RGB 129 140 151	#818C97
83.3%	83.3% #9DA6AE	RGB 157 166 174	#9DA6AE
100.0%	100.0% #BAC0C6	RGB 186 192 198	#BAC0C6

#102439 #2C3E50 #485868 #65727F #818C97 #9DA6AE #BAC0C6

#102439 - #BAC0C6

HSV Blend

#102439 - #BAC0C6 | 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 #102439 as 0% and #BAC0C6 as 100%.

0.0%	0.0% #102439	RGB 16 36 57	#102439
16.7%	16.7% #1F3750	RGB 31 55 80	#1F3750
33.3%	33.3% #344D68	RGB 52 77 104	#344D68
50.0%	50.0% #4D667F	RGB 77 102 127	#4D667F
66.7%	66.7% #6C8197	RGB 108 129 151	#6C8197
83.3%	83.3% #909FAE	RGB 144 159 174	#909FAE
100.0%	100.0% #BAC0C6	RGB 186 192 198	#BAC0C6

#102439 #1F3750 #344D68 #4D667F #6C8197 #909FAE #BAC0C6

#102439 - #4D667F - #BAC0C6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #102439 0%, #4D667F 50%, #BAC0C6 100%);
    background: -webkit-linear-gradient(top, #102439 0%, #4D667F 50%, #BAC0C6 100%);
    background: linear-gradient(to bottom, #102439 0%, #4D667F 50%, #BAC0C6 100%);
}
</style>