#2D4D9F - #789CCD | 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 #2D4D9F to #789CCD

#2D4D9F #789CCD

Calculate the color between two colors, #2D4D9F and #789CCD. 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)

#2D4D9F - #789CCD | 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 #2D4D9F as 0% and #789CCD as 100%.

0.0%	0.0% #2D4D9F	RGB 45 77 159	#2D4D9F
16.7%	16.7% #395AA6	RGB 57 90 166	#395AA6
33.3%	33.3% #4667AE	RGB 70 103 174	#4667AE
50.0%	50.0% #5274B6	RGB 82 116 182	#5274B6
66.7%	66.7% #5F81BD	RGB 95 129 189	#5F81BD
83.3%	83.3% #6B8EC5	RGB 107 142 197	#6B8EC5
100.0%	100.0% #789CCD	RGB 120 156 205	#789CCD

#2D4D9F #395AA6 #4667AE #5274B6 #5F81BD #6B8EC5 #789CCD

#2D4D9F - #789CCD

HSV Blend

#2D4D9F - #789CCD | 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 #2D4D9F as 0% and #789CCD as 100%.

0.0%	0.0% #2D4C9F	RGB 45 76 159	#2D4C9F
16.7%	16.7% #3759A6	RGB 55 89 166	#3759A6
33.3%	33.3% #4266AE	RGB 66 102 174	#4266AE
50.0%	50.0% #4F73B6	RGB 79 115 182	#4F73B6
66.7%	66.7% #5B80BD	RGB 91 128 189	#5B80BD
83.3%	83.3% #698EC5	RGB 105 142 197	#698EC5
100.0%	100.0% #789CCD	RGB 120 156 205	#789CCD

#2D4C9F #3759A6 #4266AE #4F73B6 #5B80BD #698EC5 #789CCD

#2D4D9F - #4F73B6 - #789CCD

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D4C9F 0%, #4F73B6 50%, #789CCD 100%);
    background: -webkit-linear-gradient(top, #2D4C9F 0%, #4F73B6 50%, #789CCD 100%);
    background: linear-gradient(to bottom, #2D4C9F 0%, #4F73B6 50%, #789CCD 100%);
}
</style>