#FF694C - #FEC566 | 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 #FF694C to #FEC566

#FF694C #FEC566

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

#FF694C - #FEC566 | 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 #FF694C as 0% and #FEC566 as 100%.

0.0%	0.0% #FF694C	RGB 255 105 76	#FF694C
16.7%	16.7% #FE7850	RGB 254 120 80	#FE7850
33.3%	33.3% #FE8754	RGB 254 135 84	#FE8754
50.0%	50.0% #FE9759	RGB 254 151 89	#FE9759
66.7%	66.7% #FEA65D	RGB 254 166 93	#FEA65D
83.3%	83.3% #FEB561	RGB 254 181 97	#FEB561
100.0%	100.0% #FEC566	RGB 254 197 102	#FEC566

#FF694C #FE7850 #FE8754 #FE9759 #FEA65D #FEB561 #FEC566

#FF694C - #FEC566

HSV Blend

#FF694C - #FEC566 | 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 #FF694C as 0% and #FEC566 as 100%.

0.0%	0.0% #FF694B	RGB 255 105 75	#FF694B
16.7%	16.7% #FE7A50	RGB 254 122 80	#FE7A50
33.3%	33.3% #FE8A54	RGB 254 138 84	#FE8A54
50.0%	50.0% #FE9A59	RGB 254 154 89	#FE9A59
66.7%	66.7% #FEA95D	RGB 254 169 93	#FEA95D
83.3%	83.3% #FEB761	RGB 254 183 97	#FEB761
100.0%	100.0% #FEC566	RGB 254 197 102	#FEC566

#FF694B #FE7A50 #FE8A54 #FE9A59 #FEA95D #FEB761 #FEC566

#FF694C - #FE9A59 - #FEC566

CSS codes

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

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