#9FDDF2 - #2D3F45 | 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 #9FDDF2 to #2D3F45

#9FDDF2 #2D3F45

Calculate the color between two colors, #9FDDF2 and #2D3F45. 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)

#9FDDF2 - #2D3F45 | 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 #9FDDF2 as 0% and #2D3F45 as 100%.

0.0%	0.0% #9FDDF2	RGB 159 221 242	#9FDDF2
16.7%	16.7% #8CC2D5	RGB 140 194 213	#8CC2D5
33.3%	33.3% #79A8B8	RGB 121 168 184	#79A8B8
50.0%	50.0% #668E9B	RGB 102 142 155	#668E9B
66.7%	66.7% #53737E	RGB 83 115 126	#53737E
83.3%	83.3% #405961	RGB 64 89 97	#405961
100.0%	100.0% #2D3F45	RGB 45 63 69	#2D3F45

#9FDDF2 #8CC2D5 #79A8B8 #668E9B #53737E #405961 #2D3F45

#9FDDF2 - #2D3F45

HSV Blend

#9FDDF2 - #2D3F45 | 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 #9FDDF2 as 0% and #2D3F45 as 100%.

0.0%	0.0% #9FDDF2	RGB 159 221 242	#9FDDF2
16.7%	16.7% #8BC2D5	RGB 139 194 213	#8BC2D5
33.3%	33.3% #78A8B8	RGB 120 168 184	#78A8B8
50.0%	50.0% #658D9B	RGB 101 141 155	#658D9B
66.7%	66.7% #52737E	RGB 82 115 126	#52737E
83.3%	83.3% #3F5961	RGB 63 89 97	#3F5961
100.0%	100.0% #2D3F45	RGB 45 63 69	#2D3F45

#9FDDF2 #8BC2D5 #78A8B8 #658D9B #52737E #3F5961 #2D3F45

#9FDDF2 - #658D9B - #2D3F45

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #9FDDF2 0%, #658D9B 50%, #2D3F45 100%);
    background: -webkit-linear-gradient(top, #9FDDF2 0%, #658D9B 50%, #2D3F45 100%);
    background: linear-gradient(to bottom, #9FDDF2 0%, #658D9B 50%, #2D3F45 100%);
}
</style>