#9BA88F - #BAB5D4 | 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 #9BA88F to #BAB5D4

#9BA88F #BAB5D4

Calculate the color between two colors, #9BA88F and #BAB5D4. 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)

#9BA88F - #BAB5D4 | 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 #9BA88F as 0% and #BAB5D4 as 100%.

0.0%	0.0% #9BA88F	RGB 155 168 143	#9BA88F
16.7%	16.7% #A0AA9A	RGB 160 170 154	#A0AA9A
33.3%	33.3% #A5ACA6	RGB 165 172 166	#A5ACA6
50.0%	50.0% #AAAEB1	RGB 170 174 177	#AAAEB1
66.7%	66.7% #AFB0BD	RGB 175 176 189	#AFB0BD
83.3%	83.3% #B4B2C8	RGB 180 178 200	#B4B2C8
100.0%	100.0% #BAB5D4	RGB 186 181 212	#BAB5D4

#9BA88F #A0AA9A #A5ACA6 #AAAEB1 #AFB0BD #B4B2C8 #BAB5D4

#9BA88F - #BAB5D4

HSV Blend

#9BA88F - #BAB5D4 | 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 #9BA88F as 0% and #BAB5D4 as 100%.

0.0%	0.0% #9BA88F	RGB 155 168 143	#9BA88F
16.7%	16.7% #96AF95	RGB 150 175 149	#96AF95
33.3%	33.3% #9BB6A6	RGB 155 182 166	#9BB6A6
50.0%	50.0% #A1BEB9	RGB 161 190 185	#A1BEB9
66.7%	66.7% #A8BDC5	RGB 168 189 197	#A8BDC5
83.3%	83.3% #AEB7CC	RGB 174 183 204	#AEB7CC
100.0%	100.0% #BAB5D4	RGB 186 181 212	#BAB5D4

#9BA88F #96AF95 #9BB6A6 #A1BEB9 #A8BDC5 #AEB7CC #BAB5D4

#9BA88F - #A1BEB9 - #BAB5D4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9BA88F 0%, #A1BEB9 50%, #BAB5D4 100%);
    background: -webkit-linear-gradient(top, #9BA88F 0%, #A1BEB9 50%, #BAB5D4 100%);
    background: linear-gradient(to bottom, #9BA88F 0%, #A1BEB9 50%, #BAB5D4 100%);
}
</style>