#AFB5DA - #4F659D | 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 #AFB5DA to #4F659D

#AFB5DA #4F659D

Calculate the color between two colors, #AFB5DA and #4F659D. 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)

#AFB5DA - #4F659D | 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 #AFB5DA as 0% and #4F659D as 100%.

0.0%	0.0% #AFB5DA	RGB 175 181 218	#AFB5DA
16.7%	16.7% #9FA7CF	RGB 159 167 207	#9FA7CF
33.3%	33.3% #8F9AC5	RGB 143 154 197	#8F9AC5
50.0%	50.0% #7F8DBB	RGB 127 141 187	#7F8DBB
66.7%	66.7% #6F7FB1	RGB 111 127 177	#6F7FB1
83.3%	83.3% #5F72A7	RGB 95 114 167	#5F72A7
100.0%	100.0% #4F659D	RGB 79 101 157	#4F659D

#AFB5DA #9FA7CF #8F9AC5 #7F8DBB #6F7FB1 #5F72A7 #4F659D

#AFB5DA - #4F659D

HSV Blend

#AFB5DA - #4F659D | 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 #AFB5DA as 0% and #4F659D as 100%.

0.0%	0.0% #AFB5DA	RGB 175 181 218	#AFB5DA
16.7%	16.7% #9CA4CF	RGB 156 164 207	#9CA4CF
33.3%	33.3% #8A95C5	RGB 138 149 197	#8A95C5
50.0%	50.0% #7A88BB	RGB 122 136 187	#7A88BB
66.7%	66.7% #6A7BB1	RGB 106 123 177	#6A7BB1
83.3%	83.3% #5C6FA7	RGB 92 111 167	#5C6FA7
100.0%	100.0% #4F659D	RGB 79 101 157	#4F659D

#AFB5DA #9CA4CF #8A95C5 #7A88BB #6A7BB1 #5C6FA7 #4F659D

#AFB5DA - #7A88BB - #4F659D

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFB5DA 0%, #7A88BB 50%, #4F659D 100%);
    background: -webkit-linear-gradient(top, #AFB5DA 0%, #7A88BB 50%, #4F659D 100%);
    background: linear-gradient(to bottom, #AFB5DA 0%, #7A88BB 50%, #4F659D 100%);
}
</style>