#AFB8FF - #485FD4 | 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 #AFB8FF to #485FD4

#AFB8FF #485FD4

Calculate the color between two colors, #AFB8FF and #485FD4. 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)

#AFB8FF - #485FD4 | 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 #AFB8FF as 0% and #485FD4 as 100%.

0.0%	0.0% #AFB8FF	RGB 175 184 255	#AFB8FF
16.7%	16.7% #9DA9F7	RGB 157 169 247	#9DA9F7
33.3%	33.3% #8C9AF0	RGB 140 154 240	#8C9AF0
50.0%	50.0% #7B8BE9	RGB 123 139 233	#7B8BE9
66.7%	66.7% #6A7CE2	RGB 106 124 226	#6A7CE2
83.3%	83.3% #596DDB	RGB 89 109 219	#596DDB
100.0%	100.0% #485FD4	RGB 72 95 212	#485FD4

#AFB8FF #9DA9F7 #8C9AF0 #7B8BE9 #6A7CE2 #596DDB #485FD4

#AFB8FF - #485FD4

HSV Blend

#AFB8FF - #485FD4 | 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 #AFB8FF as 0% and #485FD4 as 100%.

0.0%	0.0% #AFB8FF	RGB 175 184 255	#AFB8FF
16.7%	16.7% #9BA6F7	RGB 155 166 247	#9BA6F7
33.3%	33.3% #8996F0	RGB 137 150 240	#8996F0
50.0%	50.0% #7787E9	RGB 119 135 233	#7787E9
66.7%	66.7% #6779E2	RGB 103 121 226	#6779E2
83.3%	83.3% #576BDB	RGB 87 107 219	#576BDB
100.0%	100.0% #485FD4	RGB 72 95 212	#485FD4

#AFB8FF #9BA6F7 #8996F0 #7787E9 #6779E2 #576BDB #485FD4

#AFB8FF - #7787E9 - #485FD4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #AFB8FF 0%, #7787E9 50%, #485FD4 100%);
    background: -webkit-linear-gradient(top, #AFB8FF 0%, #7787E9 50%, #485FD4 100%);
    background: linear-gradient(to bottom, #AFB8FF 0%, #7787E9 50%, #485FD4 100%);
}
</style>