#AA221B - #180303 | colorate

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

Blend #AA221B to #180303

#AA221B

#180303

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

RGBブレンド

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

0.0%	0.0% #AA221B	RGB 170 34 27	#AA221B
16.7%	16.7% #921D17	RGB 146 29 23	#921D17
33.3%	33.3% #7A1813	RGB 122 24 19	#7A1813
50.0%	50.0% #61130F	RGB 97 19 15	#61130F
66.7%	66.7% #490E0B	RGB 73 14 11	#490E0B
83.3%	83.3% #310907	RGB 49 9 7	#310907
100.0%	100.0% #180303	RGB 24 3 3	#180303

#AA221B #921D17 #7A1813 #61130F #490E0B #310907 #180303

#AA221B - #180303

HSVブレンド

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

0.0%	0.0% #AA221B	RGB 170 34 27	#AA221B
16.7%	16.7% #911B16	RGB 145 27 22	#911B16
33.3%	33.3% #791511	RGB 121 21 17	#791511
50.0%	50.0% #610F0D	RGB 97 15 13	#610F0D
66.7%	66.7% #480A09	RGB 72 10 9	#480A09
83.3%	83.3% #300606	RGB 48 6 6	#300606
100.0%	100.0% #180303	RGB 24 3 3	#180303

#AA221B #911B16 #791511 #610F0D #480A09 #300606 #180303

#AA221B - #610F0D - #180303

CSSコード

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

/* HSV Gradation */
div {                
    background: -moz-linear-gradient(top, #AA221B 0%, #610F0D 50%, #180303 100%);
    background: -webkit-linear-gradient(top, #AA221B 0%, #610F0D 50%, #180303 100%);
    background: linear-gradient(to bottom, #AA221B 0%, #610F0D 50%, #180303 100%); 
}
</style>