#1B417C - #8CCCBF | 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 #1B417C to #8CCCBF

#1B417C #8CCCBF

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

#1B417C - #8CCCBF | 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 #1B417C as 0% and #8CCCBF as 100%.

0.0%	0.0% #1B417C	RGB 27 65 124	#1B417C
16.7%	16.7% #2D5887	RGB 45 88 135	#2D5887
33.3%	33.3% #406F92	RGB 64 111 146	#406F92
50.0%	50.0% #53869D	RGB 83 134 157	#53869D
66.7%	66.7% #669DA8	RGB 102 157 168	#669DA8
83.3%	83.3% #79B4B3	RGB 121 180 179	#79B4B3
100.0%	100.0% #8CCCBF	RGB 140 204 191	#8CCCBF

#1B417C #2D5887 #406F92 #53869D #669DA8 #79B4B3 #8CCCBF

#1B417C - #8CCCBF

HSV Blend

#1B417C - #8CCCBF | 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 #1B417C as 0% and #8CCCBF as 100%.

0.0%	0.0% #1B417C	RGB 27 65 124	#1B417C
16.7%	16.7% #285B89	RGB 40 91 137	#285B89
33.3%	33.3% #387696	RGB 56 118 150	#387696
50.0%	50.0% #4A91A4	RGB 74 145 164	#4A91A4
66.7%	66.7% #5EABB1	RGB 94 171 177	#5EABB1
83.3%	83.3% #73BEB9	RGB 115 190 185	#73BEB9
100.0%	100.0% #8CCCBF	RGB 140 204 191	#8CCCBF

#1B417C #285B89 #387696 #4A91A4 #5EABB1 #73BEB9 #8CCCBF

#1B417C - #4A91A4 - #8CCCBF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1B417C 0%, #4A91A4 50%, #8CCCBF 100%);
    background: -webkit-linear-gradient(top, #1B417C 0%, #4A91A4 50%, #8CCCBF 100%);
    background: linear-gradient(to bottom, #1B417C 0%, #4A91A4 50%, #8CCCBF 100%);
}
</style>