#3B656C - #3B4978 | colorate

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

Blend #3B656C to #3B4978

#3B656C #3B4978

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

RGBブレンド

#3B656C - #3B4978 | colorate

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

0.0%	0.0% #3B656C	RGB 59 101 108	#3B656C
16.7%	16.7% #3B606E	RGB 59 96 110	#3B606E
33.3%	33.3% #3B5B70	RGB 59 91 112	#3B5B70
50.0%	50.0% #3B5772	RGB 59 87 114	#3B5772
66.7%	66.7% #3B5274	RGB 59 82 116	#3B5274
83.3%	83.3% #3B4D76	RGB 59 77 118	#3B4D76
100.0%	100.0% #3B4978	RGB 59 73 120	#3B4978

#3B656C #3B606E #3B5B70 #3B5772 #3B5274 #3B4D76 #3B4978

#3B656C - #3B4978

HSVブレンド

#3B656C - #3B4978 | colorate

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

0.0%	0.0% #3B656C	RGB 59 101 108	#3B656C
16.7%	16.7% #3B616E	RGB 59 97 110	#3B616E
33.3%	33.3% #3B5D70	RGB 59 93 112	#3B5D70
50.0%	50.0% #3B5872	RGB 59 88 114	#3B5872
66.7%	66.7% #3B5474	RGB 59 84 116	#3B5474
83.3%	83.3% #3B4E76	RGB 59 78 118	#3B4E76
100.0%	100.0% #3B4978	RGB 59 73 120	#3B4978

#3B656C #3B616E #3B5D70 #3B5872 #3B5474 #3B4E76 #3B4978

#3B656C - #3B5872 - #3B4978

CSSコード

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

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