#6C98C4 - #8CFFD4 | 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 #6C98C4 to #8CFFD4

#6C98C4 #8CFFD4

Calculate the color between two colors, #6C98C4 and #8CFFD4. 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)

#6C98C4 - #8CFFD4 | 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 #6C98C4 as 0% and #8CFFD4 as 100%.

0.0%	0.0% #6C98C4	RGB 108 152 196	#6C98C4
16.7%	16.7% #71A9C6	RGB 113 169 198	#71A9C6
33.3%	33.3% #76BAC9	RGB 118 186 201	#76BAC9
50.0%	50.0% #7CCBCC	RGB 124 203 204	#7CCBCC
66.7%	66.7% #81DCCE	RGB 129 220 206	#81DCCE
83.3%	83.3% #86EDD1	RGB 134 237 209	#86EDD1
100.0%	100.0% #8CFFD4	RGB 140 255 212	#8CFFD4

#6C98C4 #71A9C6 #76BAC9 #7CCBCC #81DCCE #86EDD1 #8CFFD4

#6C98C4 - #8CFFD4

HSV Blend

#6C98C4 - #8CFFD4 | 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 #6C98C4 as 0% and #8CFFD4 as 100%.

0.0%	0.0% #6C97C4	RGB 108 151 196	#6C97C4
16.7%	16.7% #71ADCD	RGB 113 173 205	#71ADCD
33.3%	33.3% #76C3D7	RGB 118 195 215	#76C3D7
50.0%	50.0% #7CDBE1	RGB 124 219 225	#7CDBE1
66.7%	66.7% #81EBE2	RGB 129 235 226	#81EBE2
83.3%	83.3% #86F5DB	RGB 134 245 219	#86F5DB
100.0%	100.0% #8CFFD4	RGB 140 255 212	#8CFFD4

#6C97C4 #71ADCD #76C3D7 #7CDBE1 #81EBE2 #86F5DB #8CFFD4

#6C98C4 - #7CDBE1 - #8CFFD4

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #6C97C4 0%, #7CDBE1 50%, #8CFFD4 100%);
    background: -webkit-linear-gradient(top, #6C97C4 0%, #7CDBE1 50%, #8CFFD4 100%);
    background: linear-gradient(to bottom, #6C97C4 0%, #7CDBE1 50%, #8CFFD4 100%);
}
</style>