#BBCED5 - #697F99 | 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 #BBCED5 to #697F99

#BBCED5 #697F99

Calculate the color between two colors, #BBCED5 and #697F99. 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)

#BBCED5 - #697F99 | 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 #BBCED5 as 0% and #697F99 as 100%.

0.0%	0.0% #BBCED5	RGB 187 206 213	#BBCED5
16.7%	16.7% #ADC0CB	RGB 173 192 203	#ADC0CB
33.3%	33.3% #9FB3C1	RGB 159 179 193	#9FB3C1
50.0%	50.0% #92A6B7	RGB 146 166 183	#92A6B7
66.7%	66.7% #8499AD	RGB 132 153 173	#8499AD
83.3%	83.3% #768CA3	RGB 118 140 163	#768CA3
100.0%	100.0% #697F99	RGB 105 127 153	#697F99

#BBCED5 #ADC0CB #9FB3C1 #92A6B7 #8499AD #768CA3 #697F99

#BBCED5 - #697F99

HSV Blend

#BBCED5 - #697F99 | 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 #BBCED5 as 0% and #697F99 as 100%.

0.0%	0.0% #BBCED5	RGB 187 206 213	#BBCED5
16.7%	16.7% #ABC1CB	RGB 171 193 203	#ABC1CB
33.3%	33.3% #9DB4C1	RGB 157 180 193	#9DB4C1
50.0%	50.0% #8FA6B7	RGB 143 166 183	#8FA6B7
66.7%	66.7% #8199AD	RGB 129 153 173	#8199AD
83.3%	83.3% #758CA3	RGB 117 140 163	#758CA3
100.0%	100.0% #697F99	RGB 105 127 153	#697F99

#BBCED5 #ABC1CB #9DB4C1 #8FA6B7 #8199AD #758CA3 #697F99

#BBCED5 - #8FA6B7 - #697F99

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BBCED5 0%, #8FA6B7 50%, #697F99 100%);
    background: -webkit-linear-gradient(top, #BBCED5 0%, #8FA6B7 50%, #697F99 100%);
    background: linear-gradient(to bottom, #BBCED5 0%, #8FA6B7 50%, #697F99 100%);
}
</style>