#46474E - #9A8572 | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #46474E to #9A8572
#46474Eと#9A8572の二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#46474E - #9A8572 | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#46474Eを0%、#9A8572を100%として二色間の色を展開します。
|
0.0% #46474E |
RGB 70 71 78 | #46474E |
|
16.7% #545154 |
RGB 84 81 84 | #545154 |
|
33.3% #625B5A |
RGB 98 91 90 | #625B5A |
|
50.0% #706660 |
RGB 112 102 96 | #706660 |
|
66.7% #7E7066 |
RGB 126 112 102 | #7E7066 |
|
83.3% #8C7A6C |
RGB 140 122 108 | #8C7A6C |
|
100.0% #9A8572 |
RGB 154 133 114 | #9A8572 |
HSVブレンド
#46474E - #9A8572 | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#46474Eを0%、#9A8572を100%として二色間の色を展開します。
|
0.0% #46474E |
RGB 70 71 78 | #46474E |
|
16.7% #524E5A |
RGB 82 78 90 | #524E5A |
|
33.3% #635767 |
RGB 99 87 103 | #635767 |
|
50.0% #745E70 |
RGB 116 94 112 | #745E70 |
|
66.7% #806570 |
RGB 128 101 112 | #806570 |
|
83.3% #8D6D6C |
RGB 141 109 108 | #8D6D6C |
|
100.0% #9A8572 |
RGB 154 133 114 | #9A8572 |
CSSコード
<style type="text/css">
/* RGB Gradient */
div {
background: -moz-linear-gradient(top, #46474E 0%, #9A8572 100%);
background: -webkit-linear-gradient(top, #46474E 0%, #9A8572 100%);
background: linear-gradient(to bottom, #46474E 0%, #9A8572 100%);
}
/* HSV Gradient */
div {
background: -moz-linear-gradient(top, #46474E 0%, #745E70 50%, #9A8572 100%);
background: -webkit-linear-gradient(top, #46474E 0%, #745E70 50%, #9A8572 100%);
background: linear-gradient(to bottom, #46474E 0%, #745E70 50%, #9A8572 100%);
}
</style>
