#402E48 - #BC6E5E | colorate
colorateはデザイナーや開発者向けの配色ツールです。あなたのインスピレーションを引き出し、よりよい配色の構成に役立ちます。
サイトをよりよくする
Blend #402E48 to #BC6E5E
#402E48と#BC6E5Eの二色間の色を演算します。色味の近い色同士では滑らかですが、RGB値をもとにした通常のブレンドでは、色味の遠い色同士の中間の色は彩度が低くなりグレーに近くなります。HSV値をもとにしたブレンドでは、色味の遠い色同士でも彩度の低下はありません。
RGBブレンド
#402E48 - #BC6E5E | colorate
RGB値をもとにした二色間のブレンドです。色味の離れた色同士では、二色間の彩度は低下します。#402E48を0%、#BC6E5Eを100%として二色間の色を展開します。
|
0.0% #402E48 |
RGB 64 46 72 | #402E48 |
|
16.7% #54384B |
RGB 84 56 75 | #54384B |
|
33.3% #69434F |
RGB 105 67 79 | #69434F |
|
50.0% #7E4E53 |
RGB 126 78 83 | #7E4E53 |
|
66.7% #925856 |
RGB 146 88 86 | #925856 |
|
83.3% #A7635A |
RGB 167 99 90 | #A7635A |
|
100.0% #BC6E5E |
RGB 188 110 94 | #BC6E5E |
HSVブレンド
#402E48 - #BC6E5E | colorate
HSV値をもとにした二色間のブレンドです。色味の離れた色同士でも、二色間の彩度は低下しません。#402E48を0%、#BC6E5Eを100%として二色間の色を展開します。
|
0.0% #3F2E48 |
RGB 63 46 72 | #3F2E48 |
|
16.7% #59385B |
RGB 89 56 91 | #59385B |
|
33.3% #6E4166 |
RGB 110 65 102 | #6E4166 |
|
50.0% #824A69 |
RGB 130 74 105 | #824A69 |
|
66.7% #955167 |
RGB 149 81 103 | #955167 |
|
83.3% #A8585E |
RGB 168 88 94 | #A8585E |
|
100.0% #BC6E5E |
RGB 188 110 94 | #BC6E5E |
CSSコード
<style type="text/css">
/* RGB Gradient */
div {
background: -moz-linear-gradient(top, #402E48 0%, #BC6E5E 100%);
background: -webkit-linear-gradient(top, #402E48 0%, #BC6E5E 100%);
background: linear-gradient(to bottom, #402E48 0%, #BC6E5E 100%);
}
/* HSV Gradient */
div {
background: -moz-linear-gradient(top, #3F2E48 0%, #824A69 50%, #BC6E5E 100%);
background: -webkit-linear-gradient(top, #3F2E48 0%, #824A69 50%, #BC6E5E 100%);
background: linear-gradient(to bottom, #3F2E48 0%, #824A69 50%, #BC6E5E 100%);
}
</style>
