いんでぃーづ

ゲームメインのブレブレブログ。ゲーム,Unity,デザイン,UI/UX

クレイジー・ビート・ジャンクション : on Steam

GIMPでテキストにグラデーションをかける

{スポンサーリンク}

ロゴとか作るときにテキストにグラデーションかけたい場合。

テキストを配置する

「テキスト」レイヤーの中にてきとうにテクストを配置します。 このとき、テキストの色は真っ黒にしてください。

f:id:sugar_affordance:20160629081945p:plain

レイヤーを整える

テキストを配置したら、以下の画像のようなレイヤーの構成にします。

f:id:sugar_affordance:20160629081942p:plain

「グラデーションテキスト」というレイヤーグループの中に、さきほど作成したテキストのレイヤーと、グラデーション用のレイヤーを作ります。

グラデーションのレイヤーを着色する

「グラデーション」レイヤーにブレンドツールでグラデーションをかけます。

f:id:sugar_affordance:20160629081950p:plain

f:id:sugar_affordance:20160629081947p:plain

この状態ですが見た目まっつぁおですが気にしないでください。

そしておもむろに「グラデーション」レイヤーのレイヤーモード比較(明)にする。

f:id:sugar_affordance:20160629082239p:plain

あ・ら・ふしぎ

f:id:sugar_affordance:20160629082244p:plain

文字の形にそって、きれいにグラデーションがかかりました。

仕組み

レイヤーモード「比較(明)」は、レイヤーで重なっている色から明るい色を選んで描画します。 テキストの色が真っ黒であるため、ピクセルの色が黒より明るいグラデーションレイヤーの色が全適用されるという仕組み。

テキストの色が真っ白の場合、比較(暗)を選べば同じ効果が出ます。

他の方法

テキストからパスを作ってグラデーションかける方法もありますが、あんま好きくない。 こっちの方法ならグラデーションレイヤーの色を変えるだけでいかようにも色着せ替えできます。


“Unity” and Unity logos are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere, and are used under license.


Amazon.co.jpアソシエイト


免責事項

当サイトの広告バナー、リンクによって提供される情報、サービス内容について、当サイトは一切の責任を負いません。

また、当サイトの情報を元にユーザ様が不利益を被った場合にも、当サイトは一切の責任を負いません。

すべて自己責任でお願いします。