#4345A8 - #7F90D0 | 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 #4345A8 to #7F90D0

#4345A8 #7F90D0

Calculate the color between two colors, #4345A8 and #7F90D0. 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)

#4345A8 - #7F90D0 | 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 #4345A8 as 0% and #7F90D0 as 100%.

0.0%	0.0% #4345A8	RGB 67 69 168	#4345A8
16.7%	16.7% #4D51AE	RGB 77 81 174	#4D51AE
33.3%	33.3% #575EB5	RGB 87 94 181	#575EB5
50.0%	50.0% #616ABC	RGB 97 106 188	#616ABC
66.7%	66.7% #6B77C2	RGB 107 119 194	#6B77C2
83.3%	83.3% #7583C9	RGB 117 131 201	#7583C9
100.0%	100.0% #7F90D0	RGB 127 144 208	#7F90D0

#4345A8 #4D51AE #575EB5 #616ABC #6B77C2 #7583C9 #7F90D0

#4345A8 - #7F90D0

HSV Blend

#4345A8 - #7F90D0 | 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 #4345A8 as 0% and #7F90D0 as 100%.

0.0%	0.0% #4345A8	RGB 67 69 168	#4345A8
16.7%	16.7% #4B50AE	RGB 75 80 174	#4B50AE
33.3%	33.3% #555DB5	RGB 85 93 181	#555DB5
50.0%	50.0% #5E69BC	RGB 94 105 188	#5E69BC
66.7%	66.7% #6976C2	RGB 105 118 194	#6976C2
83.3%	83.3% #7383C9	RGB 115 131 201	#7383C9
100.0%	100.0% #7F90D0	RGB 127 144 208	#7F90D0

#4345A8 #4B50AE #555DB5 #5E69BC #6976C2 #7383C9 #7F90D0

#4345A8 - #5E69BC - #7F90D0

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #4345A8 0%, #5E69BC 50%, #7F90D0 100%);
    background: -webkit-linear-gradient(top, #4345A8 0%, #5E69BC 50%, #7F90D0 100%);
    background: linear-gradient(to bottom, #4345A8 0%, #5E69BC 50%, #7F90D0 100%);
}
</style>