#BA3C2B - #FC8539 | colorate

colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。サイトをよりよくする

Blend #BA3C2B to #FC8539

#BA3C2Bと#FC8539の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。

RGBブレンド

#BA3C2B - #FC8539 | colorate

RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#BA3C2Bを0%、#FC8539を100%として二色間の色を展開します。

0.0%	0.0% #BA3C2B	RGB 186 60 43	#BA3C2B
16.7%	16.7% #C5482D	RGB 197 72 45	#C5482D
33.3%	33.3% #D0542F	RGB 208 84 47	#D0542F
50.0%	50.0% #DB6032	RGB 219 96 50	#DB6032
66.7%	66.7% #E66C34	RGB 230 108 52	#E66C34
83.3%	83.3% #F17836	RGB 241 120 54	#F17836
100.0%	100.0% #FC8539	RGB 252 133 57	#FC8539

#BA3C2B #C5482D #D0542F #DB6032 #E66C34 #F17836 #FC8539

#BA3C2B - #FC8539

HSVブレンド

#BA3C2B - #FC8539 | colorate

HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#BA3C2Bを0%、#FC8539を100%として二色間の色を展開します。

0.0%	0.0% #BA3C2B	RGB 186 60 43	#BA3C2B
16.7%	16.7% #C5462D	RGB 197 70 45	#C5462D
33.3%	33.3% #D0512F	RGB 208 81 47	#D0512F
50.0%	50.0% #DB5D32	RGB 219 93 50	#DB5D32
66.7%	66.7% #E66934	RGB 230 105 52	#E66934
83.3%	83.3% #F17636	RGB 241 118 54	#F17636
100.0%	100.0% #FC8539	RGB 252 133 57	#FC8539

#BA3C2B #C5462D #D0512F #DB5D32 #E66934 #F17636 #FC8539

#BA3C2B - #DB5D32 - #FC8539

CSSコード

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

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