#1F97A8 - #BFE1E6 | 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 #1F97A8 to #BFE1E6

#1F97A8 #BFE1E6

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

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

0.0%	0.0% #1F97A8	RGB 31 151 168	#1F97A8
16.7%	16.7% #39A3B2	RGB 57 163 178	#39A3B2
33.3%	33.3% #54AFBC	RGB 84 175 188	#54AFBC
50.0%	50.0% #6FBCC7	RGB 111 188 199	#6FBCC7
66.7%	66.7% #89C8D1	RGB 137 200 209	#89C8D1
83.3%	83.3% #A4D4DB	RGB 164 212 219	#A4D4DB
100.0%	100.0% #BFE1E6	RGB 191 225 230	#BFE1E6

#1F97A8 #39A3B2 #54AFBC #6FBCC7 #89C8D1 #A4D4DB #BFE1E6

#1F97A8 - #BFE1E6

HSV Blend

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

0.0%	0.0% #1F97A8	RGB 31 151 168	#1F97A8
16.7%	16.7% #34A2B2	RGB 52 162 178	#34A2B2
33.3%	33.3% #4BAEBC	RGB 75 174 188	#4BAEBC
50.0%	50.0% #64BAC7	RGB 100 186 199	#64BAC7
66.7%	66.7% #80C7D1	RGB 128 199 209	#80C7D1
83.3%	83.3% #9ED3DB	RGB 158 211 219	#9ED3DB
100.0%	100.0% #BFE1E6	RGB 191 225 230	#BFE1E6

#1F97A8 #34A2B2 #4BAEBC #64BAC7 #80C7D1 #9ED3DB #BFE1E6

#1F97A8 - #64BAC7 - #BFE1E6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1F97A8 0%, #64BAC7 50%, #BFE1E6 100%);
    background: -webkit-linear-gradient(top, #1F97A8 0%, #64BAC7 50%, #BFE1E6 100%);
    background: linear-gradient(to bottom, #1F97A8 0%, #64BAC7 50%, #BFE1E6 100%);
}
</style>