#BAC2FF - #546CD5 | 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 #BAC2FF to #546CD5

#BAC2FF #546CD5

Calculate the color between two colors, #BAC2FF and #546CD5. 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)

#BAC2FF - #546CD5 | 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 #BAC2FF as 0% and #546CD5 as 100%.

0.0%	0.0% #BAC2FF	RGB 186 194 255	#BAC2FF
16.7%	16.7% #A9B3F8	RGB 169 179 248	#A9B3F8
33.3%	33.3% #98A5F1	RGB 152 165 241	#98A5F1
50.0%	50.0% #8797EA	RGB 135 151 234	#8797EA
66.7%	66.7% #7688E3	RGB 118 136 227	#7688E3
83.3%	83.3% #657ADC	RGB 101 122 220	#657ADC
100.0%	100.0% #546CD5	RGB 84 108 213	#546CD5

#BAC2FF #A9B3F8 #98A5F1 #8797EA #7688E3 #657ADC #546CD5

#BAC2FF - #546CD5

HSV Blend

#BAC2FF - #546CD5 | 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 #BAC2FF as 0% and #546CD5 as 100%.

0.0%	0.0% #BAC2FF	RGB 186 194 255	#BAC2FF
16.7%	16.7% #A7B1F8	RGB 167 177 248	#A7B1F8
33.3%	33.3% #94A1F1	RGB 148 161 241	#94A1F1
50.0%	50.0% #8392EA	RGB 131 146 234	#8392EA
66.7%	66.7% #7285E3	RGB 114 133 227	#7285E3
83.3%	83.3% #6378DC	RGB 99 120 220	#6378DC
100.0%	100.0% #546CD5	RGB 84 108 213	#546CD5

#BAC2FF #A7B1F8 #94A1F1 #8392EA #7285E3 #6378DC #546CD5

#BAC2FF - #8392EA - #546CD5

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BAC2FF 0%, #8392EA 50%, #546CD5 100%);
    background: -webkit-linear-gradient(top, #BAC2FF 0%, #8392EA 50%, #546CD5 100%);
    background: linear-gradient(to bottom, #BAC2FF 0%, #8392EA 50%, #546CD5 100%);
}
</style>