#12485B - #BBCAD0 | 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 #12485B to #BBCAD0

#12485B #BBCAD0

Calculate the color between two colors, #12485B and #BBCAD0. 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)

#12485B - #BBCAD0 | 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 #12485B as 0% and #BBCAD0 as 100%.

0.0%	0.0% #12485B	RGB 18 72 91	#12485B
16.7%	16.7% #2E5D6E	RGB 46 93 110	#2E5D6E
33.3%	33.3% #4A7382	RGB 74 115 130	#4A7382
50.0%	50.0% #668995	RGB 102 137 149	#668995
66.7%	66.7% #829EA9	RGB 130 158 169	#829EA9
83.3%	83.3% #9EB4BC	RGB 158 180 188	#9EB4BC
100.0%	100.0% #BBCAD0	RGB 187 202 208	#BBCAD0

#12485B #2E5D6E #4A7382 #668995 #829EA9 #9EB4BC #BBCAD0

#12485B - #BBCAD0

HSV Blend

#12485B - #BBCAD0 | 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 #12485B as 0% and #BBCAD0 as 100%.

0.0%	0.0% #11475B	RGB 17 71 91	#11475B
16.7%	16.7% #225A6E	RGB 34 90 110	#225A6E
33.3%	33.3% #386E82	RGB 56 110 130	#386E82
50.0%	50.0% #518395	RGB 81 131 149	#518395
66.7%	66.7% #7099A9	RGB 112 153 169	#7099A9
83.3%	83.3% #93B0BC	RGB 147 176 188	#93B0BC
100.0%	100.0% #BBCAD0	RGB 187 202 208	#BBCAD0

#11475B #225A6E #386E82 #518395 #7099A9 #93B0BC #BBCAD0

#12485B - #518395 - #BBCAD0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #11475B 0%, #518395 50%, #BBCAD0 100%);
    background: -webkit-linear-gradient(top, #11475B 0%, #518395 50%, #BBCAD0 100%);
    background: linear-gradient(to bottom, #11475B 0%, #518395 50%, #BBCAD0 100%);
}
</style>