#1E2D4D - #BEC3CC | 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 #1E2D4D to #BEC3CC

#1E2D4D #BEC3CC

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

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

0.0%	0.0% #1E2D4D	RGB 30 45 77	#1E2D4D
16.7%	16.7% #384662	RGB 56 70 98	#384662
33.3%	33.3% #535F77	RGB 83 95 119	#535F77
50.0%	50.0% #6E788C	RGB 110 120 140	#6E788C
66.7%	66.7% #8891A1	RGB 136 145 161	#8891A1
83.3%	83.3% #A3AAB6	RGB 163 170 182	#A3AAB6
100.0%	100.0% #BEC3CC	RGB 190 195 204	#BEC3CC

#1E2D4D #384662 #535F77 #6E788C #8891A1 #A3AAB6 #BEC3CC

#1E2D4D - #BEC3CC

HSV Blend

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

0.0%	0.0% #1E2C4D	RGB 30 44 77	#1E2C4D
16.7%	16.7% #2F3F62	RGB 47 63 98	#2F3F62
33.3%	33.3% #445577	RGB 68 85 119	#445577
50.0%	50.0% #5C6C8C	RGB 92 108 140	#5C6C8C
66.7%	66.7% #7987A1	RGB 121 135 161	#7987A1
83.3%	83.3% #99A3B6	RGB 153 163 182	#99A3B6
100.0%	100.0% #BEC3CC	RGB 190 195 204	#BEC3CC

#1E2C4D #2F3F62 #445577 #5C6C8C #7987A1 #99A3B6 #BEC3CC

#1E2D4D - #5C6C8C - #BEC3CC

CSS codes

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

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