#B0B6B2 - #557378 | colorate

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

Blend #B0B6B2 to #557378

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

RGBブレンド

#B0B6B2 - #557378 | colorate

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

0.0%	0.0% #B0B6B2	RGB 176 182 178	#B0B6B2
16.7%	16.7% #A0AAA8	RGB 160 170 168	#A0AAA8
33.3%	33.3% #919F9E	RGB 145 159 158	#919F9E
50.0%	50.0% #829495	RGB 130 148 149	#829495
66.7%	66.7% #73898B	RGB 115 137 139	#73898B
83.3%	83.3% #647E81	RGB 100 126 129	#647E81
100.0%	100.0% #557378	RGB 85 115 120	#557378

#B0B6B2 #A0AAA8 #919F9E #829495 #73898B #647E81 #557378

#B0B6B2 - #557378

HSVブレンド

#B0B6B2 - #557378 | colorate

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

0.0%	0.0% #B0B6B2	RGB 176 182 178	#B0B6B2
16.7%	16.7% #9EABA4	RGB 158 171 164	#9EABA4
33.3%	33.3% #8EA199	RGB 142 161 153	#8EA199
50.0%	50.0% #7E9790	RGB 126 151 144	#7E9790
66.7%	66.7% #6F8C88	RGB 111 140 136	#6F8C88
83.3%	83.3% #618282	RGB 97 130 130	#618282
100.0%	100.0% #557378	RGB 85 115 120	#557378

#B0B6B2 #9EABA4 #8EA199 #7E9790 #6F8C88 #618282 #557378

#B0B6B2 - #7E9790 - #557378

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #B0B6B2 0%, #7E9790 50%, #557378 100%);
    background: -webkit-linear-gradient(top, #B0B6B2 0%, #7E9790 50%, #557378 100%);
    background: linear-gradient(to bottom, #B0B6B2 0%, #7E9790 50%, #557378 100%);
}
</style>