#4FB5E5 - #1267AC | 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 #4FB5E5 to #1267AC

#4FB5E5 #1267AC

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

#4FB5E5 - #1267AC | 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 #4FB5E5 as 0% and #1267AC as 100%.

0.0%	0.0% #4FB5E5	RGB 79 181 229	#4FB5E5
16.7%	16.7% #44A8DB	RGB 68 168 219	#44A8DB
33.3%	33.3% #3A9BD2	RGB 58 155 210	#3A9BD2
50.0%	50.0% #308EC8	RGB 48 142 200	#308EC8
66.7%	66.7% #2681BF	RGB 38 129 191	#2681BF
83.3%	83.3% #1C74B5	RGB 28 116 181	#1C74B5
100.0%	100.0% #1267AC	RGB 18 103 172	#1267AC

#4FB5E5 #44A8DB #3A9BD2 #308EC8 #2681BF #1C74B5 #1267AC

#4FB5E5 - #1267AC

HSV Blend

#4FB5E5 - #1267AC | 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 #4FB5E5 as 0% and #1267AC as 100%.

0.0%	0.0% #4FB5E5	RGB 79 181 229	#4FB5E5
16.7%	16.7% #42A7DB	RGB 66 167 219	#42A7DB
33.3%	33.3% #379AD2	RGB 55 154 210	#379AD2
50.0%	50.0% #2D8CC8	RGB 45 140 200	#2D8CC8
66.7%	66.7% #237FBF	RGB 35 127 191	#237FBF
83.3%	83.3% #1A73B5	RGB 26 115 181	#1A73B5
100.0%	100.0% #1267AC	RGB 18 103 172	#1267AC

#4FB5E5 #42A7DB #379AD2 #2D8CC8 #237FBF #1A73B5 #1267AC

#4FB5E5 - #2D8CC8 - #1267AC

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4FB5E5 0%, #2D8CC8 50%, #1267AC 100%);
    background: -webkit-linear-gradient(top, #4FB5E5 0%, #2D8CC8 50%, #1267AC 100%);
    background: linear-gradient(to bottom, #4FB5E5 0%, #2D8CC8 50%, #1267AC 100%);
}
</style>