#3C48FE - #55A3FF | 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 #3C48FE to #55A3FF

#3C48FE #55A3FF

Calculate the color between two colors, #3C48FE and #55A3FF. 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)

#3C48FE - #55A3FF | 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 #3C48FE as 0% and #55A3FF as 100%.

0.0%	0.0% #3C48FE	RGB 60 72 254	#3C48FE
16.7%	16.7% #4057FE	RGB 64 87 254	#4057FE
33.3%	33.3% #4466FE	RGB 68 102 254	#4466FE
50.0%	50.0% #4875FE	RGB 72 117 254	#4875FE
66.7%	66.7% #4C84FE	RGB 76 132 254	#4C84FE
83.3%	83.3% #5093FE	RGB 80 147 254	#5093FE
100.0%	100.0% #55A3FF	RGB 85 163 255	#55A3FF

#3C48FE #4057FE #4466FE #4875FE #4C84FE #5093FE #55A3FF

#3C48FE - #55A3FF

HSV Blend

#3C48FE - #55A3FF | 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 #3C48FE as 0% and #55A3FF as 100%.

0.0%	0.0% #3C47FE	RGB 60 71 254	#3C47FE
16.7%	16.7% #4058FE	RGB 64 88 254	#4058FE
33.3%	33.3% #4468FE	RGB 68 104 254	#4468FE
50.0%	50.0% #4877FE	RGB 72 119 254	#4877FE
66.7%	66.7% #4C86FE	RGB 76 134 254	#4C86FE
83.3%	83.3% #5095FE	RGB 80 149 254	#5095FE
100.0%	100.0% #55A3FF	RGB 85 163 255	#55A3FF

#3C47FE #4058FE #4468FE #4877FE #4C86FE #5095FE #55A3FF

#3C48FE - #4877FE - #55A3FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #3C47FE 0%, #4877FE 50%, #55A3FF 100%);
    background: -webkit-linear-gradient(top, #3C47FE 0%, #4877FE 50%, #55A3FF 100%);
    background: linear-gradient(to bottom, #3C47FE 0%, #4877FE 50%, #55A3FF 100%);
}
</style>