#1B5DDA - #5CB5FF | 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 #1B5DDA to #5CB5FF

#1B5DDA #5CB5FF

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

#1B5DDA - #5CB5FF | 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 #1B5DDA as 0% and #5CB5FF as 100%.

0.0%	0.0% #1B5DDA	RGB 27 93 218	#1B5DDA
16.7%	16.7% #256BE0	RGB 37 107 224	#256BE0
33.3%	33.3% #307AE6	RGB 48 122 230	#307AE6
50.0%	50.0% #3B89EC	RGB 59 137 236	#3B89EC
66.7%	66.7% #4697F2	RGB 70 151 242	#4697F2
83.3%	83.3% #51A6F8	RGB 81 166 248	#51A6F8
100.0%	100.0% #5CB5FF	RGB 92 181 255	#5CB5FF

#1B5DDA #256BE0 #307AE6 #3B89EC #4697F2 #51A6F8 #5CB5FF

#1B5DDA - #5CB5FF

HSV Blend

#1B5DDA - #5CB5FF | 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 #1B5DDA as 0% and #5CB5FF as 100%.

0.0%	0.0% #1B5CDA	RGB 27 92 218	#1B5CDA
16.7%	16.7% #246BE0	RGB 36 107 224	#246BE0
33.3%	33.3% #2E7AE6	RGB 46 122 230	#2E7AE6
50.0%	50.0% #3989EC	RGB 57 137 236	#3989EC
66.7%	66.7% #4497F2	RGB 68 151 242	#4497F2
83.3%	83.3% #4FA6F8	RGB 79 166 248	#4FA6F8
100.0%	100.0% #5CB5FF	RGB 92 181 255	#5CB5FF

#1B5CDA #246BE0 #2E7AE6 #3989EC #4497F2 #4FA6F8 #5CB5FF

#1B5DDA - #3989EC - #5CB5FF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #1B5CDA 0%, #3989EC 50%, #5CB5FF 100%);
    background: -webkit-linear-gradient(top, #1B5CDA 0%, #3989EC 50%, #5CB5FF 100%);
    background: linear-gradient(to bottom, #1B5CDA 0%, #3989EC 50%, #5CB5FF 100%);
}
</style>