#5E77AF - #20335C | 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 #5E77AF to #20335C

#5E77AF #20335C

Calculate the color between two colors, #5E77AF and #20335C. 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)

#5E77AF - #20335C | 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 #5E77AF as 0% and #20335C as 100%.

0.0%	0.0% #5E77AF	RGB 94 119 175	#5E77AF
16.7%	16.7% #536BA1	RGB 83 107 161	#536BA1
33.3%	33.3% #496093	RGB 73 96 147	#496093
50.0%	50.0% #3F5585	RGB 63 85 133	#3F5585
66.7%	66.7% #344977	RGB 52 73 119	#344977
83.3%	83.3% #2A3E69	RGB 42 62 105	#2A3E69
100.0%	100.0% #20335C	RGB 32 51 92	#20335C

#5E77AF #536BA1 #496093 #3F5585 #344977 #2A3E69 #20335C

#5E77AF - #20335C

HSV Blend

#5E77AF - #20335C | 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 #5E77AF as 0% and #20335C as 100%.

0.0%	0.0% #5E77AF	RGB 94 119 175	#5E77AF
16.7%	16.7% #516AA1	RGB 81 106 161	#516AA1
33.3%	33.3% #455D93	RGB 69 93 147	#455D93
50.0%	50.0% #3B5285	RGB 59 82 133	#3B5285
66.7%	66.7% #314777	RGB 49 71 119	#314777
83.3%	83.3% #283C69	RGB 40 60 105	#283C69
100.0%	100.0% #20335C	RGB 32 51 92	#20335C

#5E77AF #516AA1 #455D93 #3B5285 #314777 #283C69 #20335C

#5E77AF - #3B5285 - #20335C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E77AF 0%, #3B5285 50%, #20335C 100%);
    background: -webkit-linear-gradient(top, #5E77AF 0%, #3B5285 50%, #20335C 100%);
    background: linear-gradient(to bottom, #5E77AF 0%, #3B5285 50%, #20335C 100%);
}
</style>