#1F6DA8 - #BFD5E6 | 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 #1F6DA8 to #BFD5E6

#1F6DA8 #BFD5E6

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

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

0.0%	0.0% #1F6DA8	RGB 31 109 168	#1F6DA8
16.7%	16.7% #397EB2	RGB 57 126 178	#397EB2
33.3%	33.3% #548FBC	RGB 84 143 188	#548FBC
50.0%	50.0% #6FA1C7	RGB 111 161 199	#6FA1C7
66.7%	66.7% #89B2D1	RGB 137 178 209	#89B2D1
83.3%	83.3% #A4C3DB	RGB 164 195 219	#A4C3DB
100.0%	100.0% #BFD5E6	RGB 191 213 230	#BFD5E6

#1F6DA8 #397EB2 #548FBC #6FA1C7 #89B2D1 #A4C3DB #BFD5E6

#1F6DA8 - #BFD5E6

HSV Blend

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

0.0%	0.0% #1F6DA8	RGB 31 109 168	#1F6DA8
16.7%	16.7% #347BB2	RGB 52 123 178	#347BB2
33.3%	33.3% #4B8BBC	RGB 75 139 188	#4B8BBC
50.0%	50.0% #649CC7	RGB 100 156 199	#649CC7
66.7%	66.7% #80AED1	RGB 128 174 209	#80AED1
83.3%	83.3% #9EC1DB	RGB 158 193 219	#9EC1DB
100.0%	100.0% #BFD5E6	RGB 191 213 230	#BFD5E6

#1F6DA8 #347BB2 #4B8BBC #649CC7 #80AED1 #9EC1DB #BFD5E6

#1F6DA8 - #649CC7 - #BFD5E6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1F6DA8 0%, #649CC7 50%, #BFD5E6 100%);
    background: -webkit-linear-gradient(top, #1F6DA8 0%, #649CC7 50%, #BFD5E6 100%);
    background: linear-gradient(to bottom, #1F6DA8 0%, #649CC7 50%, #BFD5E6 100%);
}
</style>