#0CC100 - #006F0A | colorate

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

Blend #0CC100 to #006F0A

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

RGBブレンド

#0CC100 - #006F0A | colorate

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

0.0%	0.0% #0CC100	RGB 12 193 0	#0CC100
16.7%	16.7% #0AB301	RGB 10 179 1	#0AB301
33.3%	33.3% #08A503	RGB 8 165 3	#08A503
50.0%	50.0% #069805	RGB 6 152 5	#069805
66.7%	66.7% #048A06	RGB 4 138 6	#048A06
83.3%	83.3% #027C08	RGB 2 124 8	#027C08
100.0%	100.0% #006F0A	RGB 0 111 10	#006F0A

#0CC100 #0AB301 #08A503 #069805 #048A06 #027C08 #006F0A

#0CC100 - #006F0A

HSVブレンド

#0CC100 - #006F0A | colorate

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

0.0%	0.0% #0CC100	RGB 12 193 0	#0CC100
16.7%	16.7% #06B300	RGB 6 179 0	#06B300
33.3%	33.3% #01A500	RGB 1 165 0	#01A500
50.0%	50.0% #009802	RGB 0 152 2	#009802
66.7%	66.7% #008A05	RGB 0 138 5	#008A05
83.3%	83.3% #007C08	RGB 0 124 8	#007C08
100.0%	100.0% #006F0A	RGB 0 111 10	#006F0A

#0CC100 #06B300 #01A500 #009802 #008A05 #007C08 #006F0A

#0CC100 - #009802 - #006F0A

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #0CC100 0%, #009802 50%, #006F0A 100%);
    background: -webkit-linear-gradient(top, #0CC100 0%, #009802 50%, #006F0A 100%);
    background: linear-gradient(to bottom, #0CC100 0%, #009802 50%, #006F0A 100%);
}
</style>