#414146 - #6B959C | colorate

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

Blend #414146 to #6B959C

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

RGBブレンド

#414146 - #6B959C | colorate

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

0.0%	0.0% #414146	RGB 65 65 70	#414146
16.7%	16.7% #484F54	RGB 72 79 84	#484F54
33.3%	33.3% #4F5D62	RGB 79 93 98	#4F5D62
50.0%	50.0% #566B71	RGB 86 107 113	#566B71
66.7%	66.7% #5D797F	RGB 93 121 127	#5D797F
83.3%	83.3% #64878D	RGB 100 135 141	#64878D
100.0%	100.0% #6B959C	RGB 107 149 156	#6B959C

#414146 #484F54 #4F5D62 #566B71 #5D797F #64878D #6B959C

#414146 - #6B959C

HSVブレンド

#414146 - #6B959C | colorate

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

0.0%	0.0% #414146	RGB 65 65 70	#414146
16.7%	16.7% #4A4C54	RGB 74 76 84	#4A4C54
33.3%	33.3% #535762	RGB 83 87 98	#535762
50.0%	50.0% #5B6471	RGB 91 100 113	#5B6471
66.7%	66.7% #61727F	RGB 97 114 127	#61727F
83.3%	83.3% #66828D	RGB 102 130 141	#66828D
100.0%	100.0% #6B959C	RGB 107 149 156	#6B959C

#414146 #4A4C54 #535762 #5B6471 #61727F #66828D #6B959C

#414146 - #5B6471 - #6B959C

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #414146 0%, #5B6471 50%, #6B959C 100%);
    background: -webkit-linear-gradient(top, #414146 0%, #5B6471 50%, #6B959C 100%);
    background: linear-gradient(to bottom, #414146 0%, #5B6471 50%, #6B959C 100%);
}
</style>