#A3C2FF - #416DD6 | 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 #A3C2FF to #416DD6

#A3C2FF #416DD6

Calculate the color between two colors, #A3C2FF and #416DD6. 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)

#A3C2FF - #416DD6 | 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 #A3C2FF as 0% and #416DD6 as 100%.

0.0%	0.0% #A3C2FF	RGB 163 194 255	#A3C2FF
16.7%	16.7% #92B3F8	RGB 146 179 248	#92B3F8
33.3%	33.3% #82A5F1	RGB 130 165 241	#82A5F1
50.0%	50.0% #7297EA	RGB 114 151 234	#7297EA
66.7%	66.7% #6189E3	RGB 97 137 227	#6189E3
83.3%	83.3% #517BDC	RGB 81 123 220	#517BDC
100.0%	100.0% #416DD6	RGB 65 109 214	#416DD6

#A3C2FF #92B3F8 #82A5F1 #7297EA #6189E3 #517BDC #416DD6

#A3C2FF - #416DD6

HSV Blend

#A3C2FF - #416DD6 | 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 #A3C2FF as 0% and #416DD6 as 100%.

0.0%	0.0% #A3C2FF	RGB 163 194 255	#A3C2FF
16.7%	16.7% #90B2F8	RGB 144 178 248	#90B2F8
33.3%	33.3% #7FA4F1	RGB 127 164 241	#7FA4F1
50.0%	50.0% #6E95EA	RGB 110 149 234	#6E95EA
66.7%	66.7% #5E87E3	RGB 94 135 227	#5E87E3
83.3%	83.3% #4F7ADC	RGB 79 122 220	#4F7ADC
100.0%	100.0% #416DD6	RGB 65 109 214	#416DD6

#A3C2FF #90B2F8 #7FA4F1 #6E95EA #5E87E3 #4F7ADC #416DD6

#A3C2FF - #6E95EA - #416DD6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #A3C2FF 0%, #6E95EA 50%, #416DD6 100%);
    background: -webkit-linear-gradient(top, #A3C2FF 0%, #6E95EA 50%, #416DD6 100%);
    background: linear-gradient(to bottom, #A3C2FF 0%, #6E95EA 50%, #416DD6 100%);
}
</style>