#549A8C - #BED498 | 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 #549A8C to #BED498

#549A8C #BED498

Calculate the color between two colors, #549A8C and #BED498. 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)

#549A8C - #BED498 | 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 #549A8C as 0% and #BED498 as 100%.

0.0%	0.0% #549A8C	RGB 84 154 140	#549A8C
16.7%	16.7% #65A38E	RGB 101 163 142	#65A38E
33.3%	33.3% #77AD90	RGB 119 173 144	#77AD90
50.0%	50.0% #89B792	RGB 137 183 146	#89B792
66.7%	66.7% #9AC094	RGB 154 192 148	#9AC094
83.3%	83.3% #ACCA96	RGB 172 202 150	#ACCA96
100.0%	100.0% #BED498	RGB 190 212 152	#BED498

#549A8C #65A38E #77AD90 #89B792 #9AC094 #ACCA96 #BED498

#549A8C - #BED498

HSV Blend

#549A8C - #BED498 | 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 #549A8C as 0% and #BED498 as 100%.

0.0%	0.0% #549A8C	RGB 84 154 140	#549A8C
16.7%	16.7% #5DA385	RGB 93 163 133	#5DA385
33.3%	33.3% #68AD7E	RGB 104 173 126	#68AD7E
50.0%	50.0% #73B779	RGB 115 183 121	#73B779
66.7%	66.7% #89C07F	RGB 137 192 127	#89C07F
83.3%	83.3% #A4CA8B	RGB 164 202 139	#A4CA8B
100.0%	100.0% #BED498	RGB 190 212 152	#BED498

#549A8C #5DA385 #68AD7E #73B779 #89C07F #A4CA8B #BED498

#549A8C - #73B779 - #BED498

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #549A8C 0%, #73B779 50%, #BED498 100%);
    background: -webkit-linear-gradient(top, #549A8C 0%, #73B779 50%, #BED498 100%);
    background: linear-gradient(to bottom, #549A8C 0%, #73B779 50%, #BED498 100%);
}
</style>