#4C7936 - #0A1107 | colorate

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

Blend #4C7936 to #0A1107

#4C7936 #0A1107

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

RGBブレンド

#4C7936 - #0A1107 | colorate

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

0.0%	0.0% #4C7936	RGB 76 121 54	#4C7936
16.7%	16.7% #41672E	RGB 65 103 46	#41672E
33.3%	33.3% #365626	RGB 54 86 38	#365626
50.0%	50.0% #2B451E	RGB 43 69 30	#2B451E
66.7%	66.7% #1F3316	RGB 31 51 22	#1F3316
83.3%	83.3% #15220E	RGB 21 34 14	#15220E
100.0%	100.0% #0A1107	RGB 10 17 7	#0A1107

#4C7936 #41672E #365626 #2B451E #1F3316 #15220E #0A1107

#4C7936 - #0A1107

HSVブレンド

#4C7936 - #0A1107 | colorate

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

0.0%	0.0% #4C7936	RGB 76 121 54	#4C7936
16.7%	16.7% #40672D	RGB 64 103 45	#40672D
33.3%	33.3% #355625	RGB 53 86 37	#355625
50.0%	50.0% #29451D	RGB 41 69 29	#29451D
66.7%	66.7% #1F3315	RGB 31 51 21	#1F3315
83.3%	83.3% #14220E	RGB 20 34 14	#14220E
100.0%	100.0% #0A1107	RGB 10 17 7	#0A1107

#4C7936 #40672D #355625 #29451D #1F3315 #14220E #0A1107

#4C7936 - #29451D - #0A1107

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #4C7936 0%, #29451D 50%, #0A1107 100%);
    background: -webkit-linear-gradient(top, #4C7936 0%, #29451D 50%, #0A1107 100%);
    background: linear-gradient(to bottom, #4C7936 0%, #29451D 50%, #0A1107 100%);
}
</style>