#306C3D - #9FBA68 | colorate

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

Blend #306C3D to #9FBA68

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

RGBブレンド

#306C3D - #9FBA68 | colorate

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

0.0%	0.0% #306C3D	RGB 48 108 61	#306C3D
16.7%	16.7% #427944	RGB 66 121 68	#427944
33.3%	33.3% #55864B	RGB 85 134 75	#55864B
50.0%	50.0% #679352	RGB 103 147 82	#679352
66.7%	66.7% #7AA059	RGB 122 160 89	#7AA059
83.3%	83.3% #8CAD60	RGB 140 173 96	#8CAD60
100.0%	100.0% #9FBA68	RGB 159 186 104	#9FBA68

#306C3D #427944 #55864B #679352 #7AA059 #8CAD60 #9FBA68

#306C3D - #9FBA68

HSVブレンド

#306C3D - #9FBA68 | colorate

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

0.0%	0.0% #306C3D	RGB 48 108 61	#306C3D
16.7%	16.7% #38793C	RGB 56 121 60	#38793C
33.3%	33.3% #468640	RGB 70 134 64	#468640
50.0%	50.0% #5A9349	RGB 90 147 73	#5A9349
66.7%	66.7% #70A053	RGB 112 160 83	#70A053
83.3%	83.3% #87AD5D	RGB 135 173 93	#87AD5D
100.0%	100.0% #9FBA68	RGB 159 186 104	#9FBA68

#306C3D #38793C #468640 #5A9349 #70A053 #87AD5D #9FBA68

#306C3D - #5A9349 - #9FBA68

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #306C3D 0%, #5A9349 50%, #9FBA68 100%);
    background: -webkit-linear-gradient(top, #306C3D 0%, #5A9349 50%, #9FBA68 100%);
    background: linear-gradient(to bottom, #306C3D 0%, #5A9349 50%, #9FBA68 100%);
}
</style>