画像をマスクに変換


9

いくつかの影が付いた緑の背景画像があります。これをマスクとして使用して、背景に任意の色(赤やピンクなど)で配置し、同じスタイルのシャドウを取得できるようにします。

グレースケールに変換して不透明度を20%に変更してみましたが、その結果、画像がかなり暗くなりました。

管理者がテンプレートの色を設定できるWebページでこれを使用しています。次に、CSSで次のようなものを使用しています。

background: #557d0d url("img/background.png") center center;

ここに画像の説明を入力してください

UbuntuでGimp 2.8.6を使用します。


hue-rotate色を変更するためのCSS3 フィルターはオプションではないと仮定しますか?stackoverflow.com/questions/17721960/…またはstackoverflow.com/questions/12546499/…を
Takkat

回答:


5

で画像の彩度を下げることができColors > Desaturate...ます。次に、を使用Colors > Color to Alpha...して、グレーを暗くし、暗くします(#808080)。

不透明度を40%に設定してください。

私が作成したWebサイトで簡単なテストを実行しました。 ここに画像の説明を入力してください


3

緑色の色相も垂直方向のグラデーションに沿って変化するため、無地の背景にマスクされたグレースケールレイヤーだけを使用して画像を正確に複製することはできません。

スポイトツールを使用して画像の中央から中程度の緑の色相の1つを選択し、その彩度と値を最大化し、レイヤー→透明度→アルファへの色...ツールを使用してその色を透明にするだけで、かなり近づくことができます。ただし、これにより、レイヤーの上部と下部に色かぶりが残り、必要ない場合があります。

より良い解決策は、画像を色相、彩度、明度(HSV)に分解し、色相チャネルを破棄し、彩度と明度チャネルをグレースケールマスクに再構築して、純粋な飽和色の上に配置して彩度と新しい色相の元の画像の値。

これを行う1つの方法は次のとおりです。

  1. 使用する色→コンポーネント→デコンポーズを... HSVモードを使用してレイヤーにイメージを分解するためのツール。

  2. 色相レイヤーを削除します。使用しません。

  3. 飽和レイヤーを選択し、レイヤー→マスク→レイヤーマスクの追加...ダイアログ開き、「レイヤーのグレースケールコピー」モードを選択して、「マスクの反転」チェックボックスをオンにします。

  4. 値レイヤーについても手順3を繰り返します。

  5. バケット塗りつぶしツール(「選択全体を塗りつぶす」モード)を使用して、値のレイヤー(マスクではなく!)をすべて黒で塗りつぶし、彩度のレイヤーをすべて白で塗りつぶします。

  6. スタックの飽和層の上に値層を移動します。

  7. 必要に応じて、レイヤーを[ イメージ]→[表示レイヤーの結合...]または[ レイヤー]→[下に結合]で結合します。

結果の半透明のグレースケールイメージは次のようになります。

半透明のPNG画像
クリックしてフルサイズでダウンロード/表示します。

秘訣は、ステップ3〜5の後、

  • 「彩度」レイヤーは、元の色が0%飽和した純白で、100%飽和した透明です。
  • 「値」レイヤーは、元の色の値が0%の場合は純粋な黒になり、値が100%の場合は透明になります。

これらの2つのレイヤー(またはそれらの組み合わせ)を純粋な飽和色の背景の上に配置すると、HSV色をRGBに変換するプロセスが複製されます。正しい色相の純粋な飽和色から始め、必要な色になるように十分な白を混ぜます。彩度を調整し、必要な値を取得するために十分な黒を混ぜます。

さまざまな色の背景で、結果の画像は次のようになります。

緑の背景(#83ff00) 青色の背景(#00aeff​​) オレンジ色の背景(#ffa200) 赤の背景(#ff002a)
色:緑(#83ff00)、青(#00aeff)、オレンジ(#ffa200)、赤(#ff002a)。


2

Gimpでは、カラーにアルファを使用して、基本的にフォトショップの回答と同じことを行うことができます。複数の色がある場合は、彩度を下げて白をアルファに設定することをお勧めします。青・黄のバリエーションがあるようです。主な手順は次のとおりです。

  1. 非飽和の画像あなたは、グレースケール画像を持っているように、
  2. 白(カラーピッカーで白に#FFFFFFを入力できます)をアルファに設定します
  3. pngとして保存して透明性を維持する

彩度を下げるのではなくグレースケールに変換すると、アルファチャネルのない画像が生成される可能性があることに注意してください。レイヤーダイアログを使用して、これを元に戻すことができます。開いた元のファイルにアルファチャネルがない場合も、これを行う必要があります。
hurtstotouchfire 2014

1
  • チャンネルパネルを開きます。

ここに画像の説明を入力してください

  • 探しているコントラストの度合いを与えるチャネルを決定します。

方法1:

  • Image > Calculationsソース1として選択したチャネル、ソース2と同じチャネルまたは「グレー」、ブレンドモードとして「通常」を選択して使用します。宛先として「新規ドキュメント」を選択します。

ここに画像の説明を入力してください

  • 新しいドキュメントのモードをRGBまたはグレースケールに変更し、pngまたはjpegとして保存します。

方法2:

  • 選択したチャンネルのサムネイルをCtl / Cmdキーを押しながらクリックします。

  • Edit > Copy またはCtl / Cmd-C

  • File > New、寸法を受け入れる、Edit > PasteまたはCtl / Cmd-V

  • 背景レイヤーを削除します。

  • Image > Mode > RGB

  • 透明な24ビットpng形式で保存します。

必要に応じて、結果の画像のいずれかをオーバーレイまたはアルファチャネルとして使用できます。


これはPhotoshopのようです、OPはGIMPソリューションを求めました。
ケルニク2014年

-2

レイヤーをダブルクリックすると、レイヤースタイルボックスが表示されます。左側にある[グラデーションオーバーレイ]を見つけて選択し、必要に応じてグラデーションの色を変更して、[OK]をクリックします。次に、グラデーションオーバーレイボックスでスタイルを線形に変更し、角度とスケールを変更しますあなたの必要性。


2回目は、会社のリンクを追加しました。それはスパムのにおいがしない、それはスパムです!
Mensch
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.