#2D8FA1 - #74D0CF | 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 #2D8FA1 to #74D0CF

#2D8FA1 #74D0CF

Calculate the color between two colors, #2D8FA1 and #74D0CF. 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)

#2D8FA1 - #74D0CF | 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 #2D8FA1 as 0% and #74D0CF as 100%.

0.0%	0.0% #2D8FA1	RGB 45 143 161	#2D8FA1
16.7%	16.7% #3899A8	RGB 56 153 168	#3899A8
33.3%	33.3% #44A4B0	RGB 68 164 176	#44A4B0
50.0%	50.0% #50AFB8	RGB 80 175 184	#50AFB8
66.7%	66.7% #5CBABF	RGB 92 186 191	#5CBABF
83.3%	83.3% #68C5C7	RGB 104 197 199	#68C5C7
100.0%	100.0% #74D0CF	RGB 116 208 207	#74D0CF

#2D8FA1 #3899A8 #44A4B0 #50AFB8 #5CBABF #68C5C7 #74D0CF

#2D8FA1 - #74D0CF

HSV Blend

#2D8FA1 - #74D0CF | 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 #2D8FA1 as 0% and #74D0CF as 100%.

0.0%	0.0% #2D8FA1	RGB 45 143 161	#2D8FA1
16.7%	16.7% #379AA8	RGB 55 154 168	#379AA8
33.3%	33.3% #41A5B0	RGB 65 165 176	#41A5B0
50.0%	50.0% #4DB0B8	RGB 77 176 184	#4DB0B8
66.7%	66.7% #59BBC0	RGB 89 187 192	#59BBC0
83.3%	83.3% #66C6C8	RGB 102 198 200	#66C6C8
100.0%	100.0% #74D0CF	RGB 116 208 207	#74D0CF

#2D8FA1 #379AA8 #41A5B0 #4DB0B8 #59BBC0 #66C6C8 #74D0CF

#2D8FA1 - #4DB0B8 - #74D0CF

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #2D8FA1 0%, #4DB0B8 50%, #74D0CF 100%);
    background: -webkit-linear-gradient(top, #2D8FA1 0%, #4DB0B8 50%, #74D0CF 100%);
    background: linear-gradient(to bottom, #2D8FA1 0%, #4DB0B8 50%, #74D0CF 100%);
}
</style>