#3C91B6 - #BAD4CD | 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 #3C91B6 to #BAD4CD

#3C91B6 #BAD4CD

Calculate the color between two colors, #3C91B6 and #BAD4CD. 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)

#3C91B6 - #BAD4CD | 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 #3C91B6 as 0% and #BAD4CD as 100%.

0.0%	0.0% #3C91B6	RGB 60 145 182	#3C91B6
16.7%	16.7% #519CB9	RGB 81 156 185	#519CB9
33.3%	33.3% #66A7BD	RGB 102 167 189	#66A7BD
50.0%	50.0% #7BB2C1	RGB 123 178 193	#7BB2C1
66.7%	66.7% #90BDC5	RGB 144 189 197	#90BDC5
83.3%	83.3% #A5C8C9	RGB 165 200 201	#A5C8C9
100.0%	100.0% #BAD4CD	RGB 186 212 205	#BAD4CD

#3C91B6 #519CB9 #66A7BD #7BB2C1 #90BDC5 #A5C8C9 #BAD4CD

#3C91B6 - #BAD4CD

HSV Blend

#3C91B6 - #BAD4CD | 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 #3C91B6 as 0% and #BAD4CD as 100%.

0.0%	0.0% #3C90B6	RGB 60 144 182	#3C90B6
16.7%	16.7% #4EA4BB	RGB 78 164 187	#4EA4BB
33.3%	33.3% #62B5C0	RGB 98 181 192	#62B5C0
50.0%	50.0% #76C3C5	RGB 118 195 197	#76C3C5
66.7%	66.7% #8CCAC5	RGB 140 202 197	#8CCAC5
83.3%	83.3% #A2CFC7	RGB 162 207 199	#A2CFC7
100.0%	100.0% #BAD4CD	RGB 186 212 205	#BAD4CD

#3C90B6 #4EA4BB #62B5C0 #76C3C5 #8CCAC5 #A2CFC7 #BAD4CD

#3C91B6 - #76C3C5 - #BAD4CD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C90B6 0%, #76C3C5 50%, #BAD4CD 100%);
    background: -webkit-linear-gradient(top, #3C90B6 0%, #76C3C5 50%, #BAD4CD 100%);
    background: linear-gradient(to bottom, #3C90B6 0%, #76C3C5 50%, #BAD4CD 100%);
}
</style>