#5087AD - #203E5C | 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 #5087AD to #203E5C

#5087AD #203E5C

Calculate the color between two colors, #5087AD and #203E5C. 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)

#5087AD - #203E5C | 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 #5087AD as 0% and #203E5C as 100%.

0.0%	0.0% #5087AD	RGB 80 135 173	#5087AD
16.7%	16.7% #487A9F	RGB 72 122 159	#487A9F
33.3%	33.3% #406E92	RGB 64 110 146	#406E92
50.0%	50.0% #386284	RGB 56 98 132	#386284
66.7%	66.7% #305677	RGB 48 86 119	#305677
83.3%	83.3% #284A69	RGB 40 74 105	#284A69
100.0%	100.0% #203E5C	RGB 32 62 92	#203E5C

#5087AD #487A9F #406E92 #386284 #305677 #284A69 #203E5C

#5087AD - #203E5C

HSV Blend

#5087AD - #203E5C | 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 #5087AD as 0% and #203E5C as 100%.

0.0%	0.0% #5087AD	RGB 80 135 173	#5087AD
16.7%	16.7% #46799F	RGB 70 121 159	#46799F
33.3%	33.3% #3D6D92	RGB 61 109 146	#3D6D92
50.0%	50.0% #356084	RGB 53 96 132	#356084
66.7%	66.7% #2D5477	RGB 45 84 119	#2D5477
83.3%	83.3% #264969	RGB 38 73 105	#264969
100.0%	100.0% #203E5C	RGB 32 62 92	#203E5C

#5087AD #46799F #3D6D92 #356084 #2D5477 #264969 #203E5C

#5087AD - #356084 - #203E5C

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5087AD 0%, #356084 50%, #203E5C 100%);
    background: -webkit-linear-gradient(top, #5087AD 0%, #356084 50%, #203E5C 100%);
    background: linear-gradient(to bottom, #5087AD 0%, #356084 50%, #203E5C 100%);
}
</style>