#BEC2FF - #736BED | 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 #BEC2FF to #736BED

#BEC2FF #736BED

Calculate the color between two colors, #BEC2FF and #736BED. 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)

#BEC2FF - #736BED | 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 #BEC2FF as 0% and #736BED as 100%.

0.0%	0.0% #BEC2FF	RGB 190 194 255	#BEC2FF
16.7%	16.7% #B1B3FC	RGB 177 179 252	#B1B3FC
33.3%	33.3% #A5A5F9	RGB 165 165 249	#A5A5F9
50.0%	50.0% #9896F6	RGB 152 150 246	#9896F6
66.7%	66.7% #8C88F3	RGB 140 136 243	#8C88F3
83.3%	83.3% #7F79F0	RGB 127 121 240	#7F79F0
100.0%	100.0% #736BED	RGB 115 107 237	#736BED

#BEC2FF #B1B3FC #A5A5F9 #9896F6 #8C88F3 #7F79F0 #736BED

#BEC2FF - #736BED

HSV Blend

#BEC2FF - #736BED | 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 #BEC2FF as 0% and #736BED as 100%.

0.0%	0.0% #BEC2FF	RGB 190 194 255	#BEC2FF
16.7%	16.7% #AFB2FC	RGB 175 178 252	#AFB2FC
33.3%	33.3% #A1A2F9	RGB 161 162 249	#A1A2F9
50.0%	50.0% #9393F6	RGB 147 147 246	#9393F6
66.7%	66.7% #8785F3	RGB 135 133 243	#8785F3
83.3%	83.3% #7D78F0	RGB 125 120 240	#7D78F0
100.0%	100.0% #736BED	RGB 115 107 237	#736BED

#BEC2FF #AFB2FC #A1A2F9 #9393F6 #8785F3 #7D78F0 #736BED

#BEC2FF - #9393F6 - #736BED

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #BEC2FF 0%, #9393F6 50%, #736BED 100%);
    background: -webkit-linear-gradient(top, #BEC2FF 0%, #9393F6 50%, #736BED 100%);
    background: linear-gradient(to bottom, #BEC2FF 0%, #9393F6 50%, #736BED 100%);
}
</style>