#03170D - #074D3B | colorate

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

Blend #03170D to #074D3B

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

RGBブレンド

#03170D - #074D3B | colorate

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

0.0%	0.0% #03170D	RGB 3 23 13	#03170D
16.7%	16.7% #032014	RGB 3 32 20	#032014
33.3%	33.3% #04291C	RGB 4 41 28	#04291C
50.0%	50.0% #053224	RGB 5 50 36	#053224
66.7%	66.7% #053B2B	RGB 5 59 43	#053B2B
83.3%	83.3% #064433	RGB 6 68 51	#064433
100.0%	100.0% #074D3B	RGB 7 77 59	#074D3B

#03170D #032014 #04291C #053224 #053B2B #064433 #074D3B

#03170D - #074D3B

HSVブレンド

#03170D - #074D3B | colorate

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

0.0%	0.0% #03170D	RGB 3 23 13	#03170D
16.7%	16.7% #032013	RGB 3 32 19	#032013
33.3%	33.3% #042919	RGB 4 41 25	#042919
50.0%	50.0% #053221	RGB 5 50 33	#053221
66.7%	66.7% #063B29	RGB 6 59 41	#063B29
83.3%	83.3% #064431	RGB 6 68 49	#064431
100.0%	100.0% #074D3B	RGB 7 77 59	#074D3B

#03170D #032013 #042919 #053221 #063B29 #064431 #074D3B

#03170D - #053221 - #074D3B

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #03170D 0%, #053221 50%, #074D3B 100%);
    background: -webkit-linear-gradient(top, #03170D 0%, #053221 50%, #074D3B 100%);
    background: linear-gradient(to bottom, #03170D 0%, #053221 50%, #074D3B 100%);
}
</style>