#78877C - #D8DCD9 | colorate

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

Blend #78877C to #D8DCD9

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

RGBブレンド

#78877C - #D8DCD9 | colorate

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

0.0%	0.0% #78877C	RGB 120 135 124	#78877C
16.7%	16.7% #88958B	RGB 136 149 139	#88958B
33.3%	33.3% #98A39B	RGB 152 163 155	#98A39B
50.0%	50.0% #A8B1AA	RGB 168 177 170	#A8B1AA
66.7%	66.7% #B8BFBA	RGB 184 191 186	#B8BFBA
83.3%	83.3% #C8CDC9	RGB 200 205 201	#C8CDC9
100.0%	100.0% #D8DCD9	RGB 216 220 217	#D8DCD9

#78877C #88958B #98A39B #A8B1AA #B8BFBA #C8CDC9 #D8DCD9

#78877C - #D8DCD9

HSVブレンド

#78877C - #D8DCD9 | colorate

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

0.0%	0.0% #78877C	RGB 120 135 124	#78877C
16.7%	16.7% #86958A	RGB 134 149 138	#86958A
33.3%	33.3% #96A399	RGB 150 163 153	#96A399
50.0%	50.0% #A6B1A8	RGB 166 177 168	#A6B1A8
66.7%	66.7% #B6BFB8	RGB 182 191 184	#B6BFB8
83.3%	83.3% #C6CDC8	RGB 198 205 200	#C6CDC8
100.0%	100.0% #D8DCD9	RGB 216 220 217	#D8DCD9

#78877C #86958A #96A399 #A6B1A8 #B6BFB8 #C6CDC8 #D8DCD9

#78877C - #A6B1A8 - #D8DCD9

CSSコード

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

/* HSV Gradient */
div {
    background: -moz-linear-gradient(top, #78877C 0%, #A6B1A8 50%, #D8DCD9 100%);
    background: -webkit-linear-gradient(top, #78877C 0%, #A6B1A8 50%, #D8DCD9 100%);
    background: linear-gradient(to bottom, #78877C 0%, #A6B1A8 50%, #D8DCD9 100%);
}
</style>