#5E8282 - #84C4EB | 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 #5E8282 to #84C4EB

#5E8282 #84C4EB

Calculate the color between two colors, #5E8282 and #84C4EB. 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)

#5E8282 - #84C4EB | 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 #5E8282 as 0% and #84C4EB as 100%.

0.0%	0.0% #5E8282	RGB 94 130 130	#5E8282
16.7%	16.7% #648D93	RGB 100 141 147	#648D93
33.3%	33.3% #6A98A5	RGB 106 152 165	#6A98A5
50.0%	50.0% #71A3B6	RGB 113 163 182	#71A3B6
66.7%	66.7% #77AEC8	RGB 119 174 200	#77AEC8
83.3%	83.3% #7DB9D9	RGB 125 185 217	#7DB9D9
100.0%	100.0% #84C4EB	RGB 132 196 235	#84C4EB

#5E8282 #648D93 #6A98A5 #71A3B6 #77AEC8 #7DB9D9 #84C4EB

#5E8282 - #84C4EB

HSV Blend

#5E8282 - #84C4EB | 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 #5E8282 as 0% and #84C4EB as 100%.

0.0%	0.0% #5E8282	RGB 94 130 130	#5E8282
16.7%	16.7% #669093	RGB 102 144 147	#669093
33.3%	33.3% #6E9EA5	RGB 110 158 165	#6E9EA5
50.0%	50.0% #75AAB6	RGB 117 170 182	#75AAB6
66.7%	66.7% #7BB4C8	RGB 123 180 200	#7BB4C8
83.3%	83.3% #80BDD9	RGB 128 189 217	#80BDD9
100.0%	100.0% #84C4EB	RGB 132 196 235	#84C4EB

#5E8282 #669093 #6E9EA5 #75AAB6 #7BB4C8 #80BDD9 #84C4EB

#5E8282 - #75AAB6 - #84C4EB

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #5E8282 0%, #75AAB6 50%, #84C4EB 100%);
    background: -webkit-linear-gradient(top, #5E8282 0%, #75AAB6 50%, #84C4EB 100%);
    background: linear-gradient(to bottom, #5E8282 0%, #75AAB6 50%, #84C4EB 100%);
}
</style>