#64B5E9 - #1C3342 | 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 #64B5E9 to #1C3342

#64B5E9 #1C3342

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

#64B5E9 - #1C3342 | 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 #64B5E9 as 0% and #1C3342 as 100%.

0.0%	0.0% #64B5E9	RGB 100 181 233	#64B5E9
16.7%	16.7% #589FCD	RGB 88 159 205	#589FCD
33.3%	33.3% #4C89B1	RGB 76 137 177	#4C89B1
50.0%	50.0% #407495	RGB 64 116 149	#407495
66.7%	66.7% #345E79	RGB 52 94 121	#345E79
83.3%	83.3% #28485D	RGB 40 72 93	#28485D
100.0%	100.0% #1C3342	RGB 28 51 66	#1C3342

#64B5E9 #589FCD #4C89B1 #407495 #345E79 #28485D #1C3342

#64B5E9 - #1C3342

HSV Blend

#64B5E9 - #1C3342 | 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 #64B5E9 as 0% and #1C3342 as 100%.

0.0%	0.0% #64B5E9	RGB 100 181 233	#64B5E9
16.7%	16.7% #579FCD	RGB 87 159 205	#579FCD
33.3%	33.3% #4B89B1	RGB 75 137 177	#4B89B1
50.0%	50.0% #3F7395	RGB 63 115 149	#3F7395
66.7%	66.7% #335E79	RGB 51 94 121	#335E79
83.3%	83.3% #27485D	RGB 39 72 93	#27485D
100.0%	100.0% #1C3342	RGB 28 51 66	#1C3342

#64B5E9 #579FCD #4B89B1 #3F7395 #335E79 #27485D #1C3342

#64B5E9 - #3F7395 - #1C3342

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #64B5E9 0%, #3F7395 50%, #1C3342 100%);
    background: -webkit-linear-gradient(top, #64B5E9 0%, #3F7395 50%, #1C3342 100%);
    background: linear-gradient(to bottom, #64B5E9 0%, #3F7395 50%, #1C3342 100%);
}
</style>