#0C2D5E - #B9C3D1 | 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 #0C2D5E to #B9C3D1

#0C2D5E #B9C3D1

Calculate the color between two colors, #0C2D5E and #B9C3D1. 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)

#0C2D5E - #B9C3D1 | 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 #0C2D5E as 0% and #B9C3D1 as 100%.

0.0%	0.0% #0C2D5E	RGB 12 45 94	#0C2D5E
16.7%	16.7% #284671	RGB 40 70 113	#284671
33.3%	33.3% #455F84	RGB 69 95 132	#455F84
50.0%	50.0% #627897	RGB 98 120 151	#627897
66.7%	66.7% #7F91AA	RGB 127 145 170	#7F91AA
83.3%	83.3% #9CAABD	RGB 156 170 189	#9CAABD
100.0%	100.0% #B9C3D1	RGB 185 195 209	#B9C3D1

#0C2D5E #284671 #455F84 #627897 #7F91AA #9CAABD #B9C3D1

#0C2D5E - #B9C3D1

HSV Blend

#0C2D5E - #B9C3D1 | 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 #0C2D5E as 0% and #B9C3D1 as 100%.

0.0%	0.0% #0B2C5E	RGB 11 44 94	#0B2C5E
16.7%	16.7% #1C3E71	RGB 28 62 113	#1C3E71
33.3%	33.3% #325384	RGB 50 83 132	#325384
50.0%	50.0% #4C6B97	RGB 76 107 151	#4C6B97
66.7%	66.7% #6B85AA	RGB 107 133 170	#6B85AA
83.3%	83.3% #90A3BD	RGB 144 163 189	#90A3BD
100.0%	100.0% #B9C3D1	RGB 185 195 209	#B9C3D1

#0B2C5E #1C3E71 #325384 #4C6B97 #6B85AA #90A3BD #B9C3D1

#0C2D5E - #4C6B97 - #B9C3D1

CSS codes

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

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