#D64100 - #82200B | colorate

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

Blend #D64100 to #82200B

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

RGBブレンド

#D64100 - #82200B | colorate

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

0.0%	0.0% #D64100	RGB 214 65 0	#D64100
16.7%	16.7% #C83B01	RGB 200 59 1	#C83B01
33.3%	33.3% #BA3603	RGB 186 54 3	#BA3603
50.0%	50.0% #AC3005	RGB 172 48 5	#AC3005
66.7%	66.7% #9E2B07	RGB 158 43 7	#9E2B07
83.3%	83.3% #902509	RGB 144 37 9	#902509
100.0%	100.0% #82200B	RGB 130 32 11	#82200B

#D64100 #C83B01 #BA3603 #AC3005 #9E2B07 #902509 #82200B

#D64100 - #82200B

HSVブレンド

#D64100 - #82200B | colorate

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

0.0%	0.0% #D64100	RGB 214 65 0	#D64100
16.7%	16.7% #C83A02	RGB 200 58 2	#C83A02
33.3%	33.3% #BA3405	RGB 186 52 5	#BA3405
50.0%	50.0% #AC2E07	RGB 172 46 7	#AC2E07
66.7%	66.7% #9E2908	RGB 158 41 8	#9E2908
83.3%	83.3% #90240A	RGB 144 36 10	#90240A
100.0%	100.0% #82200B	RGB 130 32 11	#82200B

#D64100 #C83A02 #BA3405 #AC2E07 #9E2908 #90240A #82200B

#D64100 - #AC2E07 - #82200B

CSSコード

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

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