#636B2F - #2F3C06 | colorate

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

Blend #636B2F to #2F3C06

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

RGBブレンド

#636B2F - #2F3C06 | colorate

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

0.0%	0.0% #636B2F	RGB 99 107 47	#636B2F
16.7%	16.7% #5A6328	RGB 90 99 40	#5A6328
33.3%	33.3% #515B21	RGB 81 91 33	#515B21
50.0%	50.0% #49531A	RGB 73 83 26	#49531A
66.7%	66.7% #404B13	RGB 64 75 19	#404B13
83.3%	83.3% #37430C	RGB 55 67 12	#37430C
100.0%	100.0% #2F3C06	RGB 47 60 6	#2F3C06

#636B2F #5A6328 #515B21 #49531A #404B13 #37430C #2F3C06

#636B2F - #2F3C06

HSVブレンド

#636B2F - #2F3C06 | colorate

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

0.0%	0.0% #636B2F	RGB 99 107 47	#636B2F
16.7%	16.7% #596325	RGB 89 99 37	#596325
33.3%	33.3% #505B1D	RGB 80 91 29	#505B1D
50.0%	50.0% #485316	RGB 72 83 22	#485316
66.7%	66.7% #3F4B10	RGB 63 75 16	#3F4B10
83.3%	83.3% #37430A	RGB 55 67 10	#37430A
100.0%	100.0% #2F3C06	RGB 47 60 6	#2F3C06

#636B2F #596325 #505B1D #485316 #3F4B10 #37430A #2F3C06

#636B2F - #485316 - #2F3C06

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #636B2F 0%, #485316 50%, #2F3C06 100%);
    background: -webkit-linear-gradient(top, #636B2F 0%, #485316 50%, #2F3C06 100%);
    background: linear-gradient(to bottom, #636B2F 0%, #485316 50%, #2F3C06 100%);
}
</style>