#B5C2FF - #4F6CD5 | 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 #B5C2FF to #4F6CD5

#B5C2FF #4F6CD5

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

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

0.0%	0.0% #B5C2FF	RGB 181 194 255	#B5C2FF
16.7%	16.7% #A4B3F8	RGB 164 179 248	#A4B3F8
33.3%	33.3% #93A5F1	RGB 147 165 241	#93A5F1
50.0%	50.0% #8297EA	RGB 130 151 234	#8297EA
66.7%	66.7% #7188E3	RGB 113 136 227	#7188E3
83.3%	83.3% #607ADC	RGB 96 122 220	#607ADC
100.0%	100.0% #4F6CD5	RGB 79 108 213	#4F6CD5

#B5C2FF #A4B3F8 #93A5F1 #8297EA #7188E3 #607ADC #4F6CD5

#B5C2FF - #4F6CD5

HSV Blend

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

0.0%	0.0% #B5C2FF	RGB 181 194 255	#B5C2FF
16.7%	16.7% #A2B1F8	RGB 162 177 248	#A2B1F8
33.3%	33.3% #8FA2F1	RGB 143 162 241	#8FA2F1
50.0%	50.0% #7E93EA	RGB 126 147 234	#7E93EA
66.7%	66.7% #6D85E3	RGB 109 133 227	#6D85E3
83.3%	83.3% #5E78DC	RGB 94 120 220	#5E78DC
100.0%	100.0% #4F6CD5	RGB 79 108 213	#4F6CD5

#B5C2FF #A2B1F8 #8FA2F1 #7E93EA #6D85E3 #5E78DC #4F6CD5

#B5C2FF - #7E93EA - #4F6CD5

CSS codes

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

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