#FF6347 - #CE2212 | colorate

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

Blend #FF6347 to #CE2212

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

RGBブレンド

#FF6347 - #CE2212 | colorate

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

0.0%	0.0% #FF6347	RGB 255 99 71	#FF6347
16.7%	16.7% #F6583E	RGB 246 88 62	#F6583E
33.3%	33.3% #EE4D35	RGB 238 77 53	#EE4D35
50.0%	50.0% #E6422C	RGB 230 66 44	#E6422C
66.7%	66.7% #DE3723	RGB 222 55 35	#DE3723
83.3%	83.3% #D62C1A	RGB 214 44 26	#D62C1A
100.0%	100.0% #CE2212	RGB 206 34 18	#CE2212

#FF6347 #F6583E #EE4D35 #E6422C #DE3723 #D62C1A #CE2212

#FF6347 - #CE2212

HSVブレンド

#FF6347 - #CE2212 | colorate

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

0.0%	0.0% #FF6347	RGB 255 99 71	#FF6347
16.7%	16.7% #F6573C	RGB 246 87 60	#F6573C
33.3%	33.3% #EE4B33	RGB 238 75 51	#EE4B33
50.0%	50.0% #E6402A	RGB 230 64 42	#E6402A
66.7%	66.7% #DE3521	RGB 222 53 33	#DE3521
83.3%	83.3% #D62B19	RGB 214 43 25	#D62B19
100.0%	100.0% #CE2212	RGB 206 34 18	#CE2212

#FF6347 #F6573C #EE4B33 #E6402A #DE3521 #D62B19 #CE2212

#FF6347 - #E6402A - #CE2212

CSSコード

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

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