#7BA2FF - #1D51C6 | 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 #7BA2FF to #1D51C6

#7BA2FF #1D51C6

Calculate the color between two colors, #7BA2FF and #1D51C6. 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)

#7BA2FF - #1D51C6 | 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 #7BA2FF as 0% and #1D51C6 as 100%.

0.0%	0.0% #7BA2FF	RGB 123 162 255	#7BA2FF
16.7%	16.7% #6B94F5	RGB 107 148 245	#6B94F5
33.3%	33.3% #5B87EC	RGB 91 135 236	#5B87EC
50.0%	50.0% #4C79E2	RGB 76 121 226	#4C79E2
66.7%	66.7% #3C6CD9	RGB 60 108 217	#3C6CD9
83.3%	83.3% #2C5ECF	RGB 44 94 207	#2C5ECF
100.0%	100.0% #1D51C6	RGB 29 81 198	#1D51C6

#7BA2FF #6B94F5 #5B87EC #4C79E2 #3C6CD9 #2C5ECF #1D51C6

#7BA2FF - #1D51C6

HSV Blend

#7BA2FF - #1D51C6 | 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 #7BA2FF as 0% and #1D51C6 as 100%.

0.0%	0.0% #7BA2FF	RGB 123 162 255	#7BA2FF
16.7%	16.7% #6892F5	RGB 104 146 245	#6892F5
33.3%	33.3% #5783EC	RGB 87 131 236	#5783EC
50.0%	50.0% #4776E2	RGB 71 118 226	#4776E2
66.7%	66.7% #3868D9	RGB 56 104 217	#3868D9
83.3%	83.3% #2A5CCF	RGB 42 92 207	#2A5CCF
100.0%	100.0% #1D51C6	RGB 29 81 198	#1D51C6

#7BA2FF #6892F5 #5783EC #4776E2 #3868D9 #2A5CCF #1D51C6

#7BA2FF - #4776E2 - #1D51C6

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #7BA2FF 0%, #4776E2 50%, #1D51C6 100%);
    background: -webkit-linear-gradient(top, #7BA2FF 0%, #4776E2 50%, #1D51C6 100%);
    background: linear-gradient(to bottom, #7BA2FF 0%, #4776E2 50%, #1D51C6 100%);
}
</style>