#FF697C - #FFCC93 | 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 #FF697C to #FFCC93

#FF697C #FFCC93

Calculate the color between two colors, #FF697C and #FFCC93. 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)

#FF697C - #FFCC93 | 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 #FF697C as 0% and #FFCC93 as 100%.

0.0%	0.0% #FF697C	RGB 255 105 124	#FF697C
16.7%	16.7% #FF797F	RGB 255 121 127	#FF797F
33.3%	33.3% #FF8A83	RGB 255 138 131	#FF8A83
50.0%	50.0% #FF9A87	RGB 255 154 135	#FF9A87
66.7%	66.7% #FFAB8B	RGB 255 171 139	#FFAB8B
83.3%	83.3% #FFBB8F	RGB 255 187 143	#FFBB8F
100.0%	100.0% #FFCC93	RGB 255 204 147	#FFCC93

#FF697C #FF797F #FF8A83 #FF9A87 #FFAB8B #FFBB8F #FFCC93

#FF697C - #FFCC93

HSV Blend

#FF697C - #FFCC93 | 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 #FF697C as 0% and #FFCC93 as 100%.

0.0%	0.0% #FF697C	RGB 255 105 124	#FF697C
16.7%	16.7% #FF7072	RGB 255 112 114	#FF7072
33.3%	33.3% #FF8377	RGB 255 131 119	#FF8377
50.0%	50.0% #FF977E	RGB 255 151 126	#FF977E
66.7%	66.7% #FFAA85	RGB 255 170 133	#FFAA85
83.3%	83.3% #FFBC8C	RGB 255 188 140	#FFBC8C
100.0%	100.0% #FFCC93	RGB 255 204 147	#FFCC93

#FF697C #FF7072 #FF8377 #FF977E #FFAA85 #FFBC8C #FFCC93

#FF697C - #FF977E - #FFCC93

CSS codes

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #FF697C 0%, #FF977E 50%, #FFCC93 100%);
    background: -webkit-linear-gradient(top, #FF697C 0%, #FF977E 50%, #FFCC93 100%);
    background: linear-gradient(to bottom, #FF697C 0%, #FF977E 50%, #FFCC93 100%);
}
</style>