#595450 - #3F3C32 | colorate

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

Blend #595450 to #3F3C32

#595450 #3F3C32

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

RGBブレンド

#595450 - #3F3C32 | colorate

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

0.0%	0.0% #595450	RGB 89 84 80	#595450
16.7%	16.7% #54504B	RGB 84 80 75	#54504B
33.3%	33.3% #504C46	RGB 80 76 70	#504C46
50.0%	50.0% #4C4841	RGB 76 72 65	#4C4841
66.7%	66.7% #47443C	RGB 71 68 60	#47443C
83.3%	83.3% #434037	RGB 67 64 55	#434037
100.0%	100.0% #3F3C32	RGB 63 60 50	#3F3C32

#595450 #54504B #504C46 #4C4841 #47443C #434037 #3F3C32

#595450 - #3F3C32

HSVブレンド

#595450 - #3F3C32 | colorate

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

0.0%	0.0% #595450	RGB 89 84 80	#595450
16.7%	16.7% #544F4A	RGB 84 79 74	#544F4A
33.3%	33.3% #504B45	RGB 80 75 69	#504B45
50.0%	50.0% #4C4740	RGB 76 71 64	#4C4740
66.7%	66.7% #47433B	RGB 71 67 59	#47433B
83.3%	83.3% #433F36	RGB 67 63 54	#433F36
100.0%	100.0% #3F3C32	RGB 63 60 50	#3F3C32

#595450 #544F4A #504B45 #4C4740 #47433B #433F36 #3F3C32

#595450 - #4C4740 - #3F3C32

CSSコード

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

/* HSV Gradation */
div {
    background: -moz-linear-gradient(top, #595450 0%, #4C4740 50%, #3F3C32 100%);
    background: -webkit-linear-gradient(top, #595450 0%, #4C4740 50%, #3F3C32 100%);
    background: linear-gradient(to bottom, #595450 0%, #4C4740 50%, #3F3C32 100%);
}
</style>