Mia Hartley 
文字エフェクトとは、フォントを選んだあとに単語に起きることのすべてです。塗り、縁取り、後ろの影、下の奥行き、表面に当たる光。フォントが与えるのは文字の形です。エフェクトは、その形をゴールドに、ネオンの看板に、燃えている何かに見せるものです。
手に入れる方法は三つあります。ジェネレーターに単語を入力して画像をダウンロードする、Photoshop でレイヤー付きの PSD を開く、CSS を書いてブラウザーの中だけに存在させる。このページは一つ目の話で、レイヤーが欲しい人のための PSD の道筋は後半にあります。
以下、実際に探される順で12の系統を並べます。サンプルはすべて TextStudio のかっこいい文字ジェネレーターで本当にレンダリングしたもので、単語にはそのエフェクトの名前を使いました。モックアップは一つもありません。画像をクリックすると、そのスタイルがそのまま開いて、自分の言葉を入れられます。12スタイルは、どれもプレミアムではありません。
1. 3Dの文字エフェクト
奥行きはこの中で最も古い手であり、いまも最も使えます。文字に押し出した側面と光源と接地面が加わり、インクであることをやめて物体になります。
このようなアイソメトリックな奥行きは、どのサイズでも読めます。ロゴやサムネイルが何度もここに戻ってくるのはそのためです。もう一つの選択肢はやわらかい遠近法の押し出しで、大きく使うと見栄えがしますが、小さくするとつぶれます。同じ発想の、もっと古くて角ばった版が欲しいなら、ワードアートのスタイルにまとまっています。
向いている用途：ロゴ、動画のサムネイル、ポスター、縮小に耐える必要があるもの全般。
2. ゴールドの文字エフェクト
ゴールドは色ではなく、レシピです。上が暗く中央が明るい暖色のグラデーション、縁の硬いベベル、そして光が当たるところのハイライト。文字をべた塗りの黄色で埋めると、できあがるのはバナナです。
後ろの青も飾りではありません。ゴールドが金属に見えるには、冷たくて暗い地が要ります。表彰のポスターも、新年の挨拶も、高級品のラベルも、最後は紺か黒に落ち着くのはそのためです。ほかの作例はゴールドの文字エフェクトのガイドにあります。
向いている用途：招待状、新年の投稿、賞状、高そうに見せたいロゴ。
3. ネオンの文字エフェクト
ネオンのエフェクトは、光を発するストロークです。明るい芯、外へにじむ色のついたハロー、そしてその光が落ちる暗い面。白い背景では消えてしまい、どれだけ調整しても直りません。
バーの上にあるようなチューブ式のネオンは、輪郭が見えたまま残り、文字の内側に光らない細い隙間ができます。LED 看板のスタイルはチューブをやめて、代わりに光の点を使います。ほかの発光するスタイルはネオンフォントの記事にまとめてあります。
向いている用途：パーティーの招待状、配信のオーバーレイ、暗いサイトのヘッダー、看板に見せたいもの全般。
4. 炎の文字エフェクト
単語に火をつける方法は二つあり、見た目は似ていません。文字の上から炎が立ち上るように描くか、文字そのものを熾火でつくって内側から光らせるかです。
文字の上の炎は、単語を読めるまま保ちます。それが名前なら、そこが効いてきます。熾火で埋めた文字はもっと熱く見えますが、読みにくくなります。溶岩やカートゥーンの火を含む8つのバリエーションは、炎フォントのガイドで並べています。
向いている用途：ゲームのサムネイル、スポーツやバンドのポスター、うるさく見せたいもの全般。
5. クロームの文字エフェクト
クロームは、地平線の入ったグラデーションです。肝は、反射した空と反射した地面が出会う、それぞれの文字の中央を横切る硬い線。これを取り除くと、灰色のプラスチックになります。
シルバー、スチール、クロームは、コントラストの量が違うだけの同じ系統です。Y2K のリバイバルがそれらを一度に連れ戻しました。ほかはメタルとクロームのフォントにあります。
向いている用途：賞状、車やスポーツのロゴ、Y2K のデザイン、金属的なもの全般。
6. キラキラの文字エフェクト
本物のラメは、文字の内側のテクスチャに、まわりへ散る細かい粉が加わったものです。偽物のほうはなめらかな金のグラデーションの上にきらめきを描いたもので、一度その違いが見えてしまうと、もう見えないふりはできません。
ラメは、印刷すると持ち味の大半を失う唯一のエフェクトです。きらめきの正体は小さな明るいピクセルで、プリンターはそれを平均してしまいます。これは画面のためのものです。塗って描いただけの光沢と本物のきらめきを見分けるテストは、ラメフォントのガイドにあります。
向いている用途：誕生日の投稿、パーティーの招待状、プロフィールのヘッダー、スマホの画面で見られるもの全般。
7. 縁取りの文字エフェクト
単語のまわりのストローク一本が、それを後ろにあるものから切り離します。ミームやサムネイルがこれを使う理由はそれだけです。自分では選べない写真の上でも、キャプションが読めるまま残ります。
色の違うストロークを何本か重ねると、単語は何の上にでも置けるほど厚いハローをまといます。これがステッカーの見た目です。縁取りを増やすたびに文字の形は削れていくので、ポスターでは効いてもサムネイルのサイズでは破綻します。仕組みは文字に縁取りを追加するガイドにあります。
向いている用途：ミーム、ステッカー、写真や動画に載せるキャプション。
8. 影の文字エフェクト
影は二つの仕事を同時にこなします。単語を背景から持ち上げること、そして光がどこにあるかを伝えること。やわらかい影はコントラストの道具です。硬いオフセットの影はスタイルです。
上の長い影はフラットデザイン版で、45度に伸びる単色の形が一つ、ぼかしはありません。日常的に使うのはやわらかいドロップシャドウのほうで、誰にも気づかれない程度に控えめであるべきです。それを説明しているのが文字の影です。
向いている用途：フラットデザインのポスター、アプリの画面、スライドのタイトル、縁取りなしでコントラストが欲しいキャプション。
9. カラーの文字エフェクト
色は、均一であることをやめた時点で、それ自体が一つのエフェクトになります。一文字ずつ違う色にするか、単語全体にグラデーションを走らせるかです。
カラフルな文字を探している人が実際に求めているのは、子どものパーティーや教室やプライドの投稿で使う、一文字ずつの色です。単語を横切るグラデーションのほうは、いまのショート動画の標準になっています。8つの色と、それぞれがどこに効くのかはカラー文字エフェクトにあります。
向いている用途：誕生日や教室の掲示物、プレイリストのカバー、親しみやすく見せたいもの全般。
10. グラフィティの文字エフェクト
グラフィティは一つのスタイルではなく、スタイルの系統です。素早いタグ、太いスローアップ、ブロックバスター、そして読めないことになっているワイルドスタイル。
このようなタグは署名なので、名前を入れたくなるものです。9つのレタリングスタイルを、壁の上での呼び名と用途つきで同じ単語に並べたものがグラフィティフォントにあります。
向いている用途：音楽のカバー、ストリートウェア、ゲームの名前、スケートや若者向けの掲示物。
11. バブルの文字エフェクト
バブルの文字はふくらんでいます。丸い肩、太い縁取り、やわらかい光が上に当たるところのハイライト。一語も読まれないうちから、若くて親しみやすいと伝わります。
ここには重要な分かれ道があります。この画像のような絵としてのバブルレターは、ダウンロードする描かれた形です。コピーして貼れる文字としてのバブルレターは Unicode の記号で、プロフィール文には持っていけますが、色をつけることはできません。バブルレターのガイドは両方と、手で描く方法を扱っています。
向いている用途：誕生日カード、教室の掲示、ステッカーのセット、子ども向けのもの全般。
12. レトロの文字エフェクト
レトロは見た目ではなく年代であり、年代を取り違えるのがこのページで最も多い間違いです。70年代のグルーヴィーは丸くて暖かい。80年代のアーケードはクロームとグリッド。Y2K は青いデスクトップの上の、ふくらんだメタルです。
上の70年代版はいちばん強く戻ってきたもので、コーヒーのパッケージにもフェスのポスターにも載っています。ほかのリバイバルのスタイルはレトロフォントにあります。
向いている用途：フェスのポスター、パッケージ、バンドのグッズ、懐かしさを狙うもの全般。
さらに16スタイル、同じ単語で
上の12の系統は、人が実際に探すものをカバーしています。カタログはそこで終わりではありませんし、残りは12語で見るより一つの単語で見比べたほうが判断しやすいものです。
雰囲気ではなく題材にエフェクトを合わせる必要があるときに見る場所です。クリスマスカード、スポーツのポスター、園芸店のチラシ、花で単語を綴ったパーティーの招待状。
文字エフェクトは、実のところ何でできているのか
上のスタイルはどれも、同じ四つのレイヤーを同じ順に重ねたものです。切り分けて見えるようになると、どれでも組み立てられますし、うまくいっていないものの何が悪いのかも言えるようになります。
塗りは文字の内側の色、グラデーション、テクスチャです。縁取りはまわりのストロークで、にぎやかな背景の上でも単語が埋もれずにすむのはこれのおかげです。影は単語を面から切り離し、光の向きを決めます。奥行きは文字を立体に押し出します。
ゴールドは塗りにベベルを足したもの。ネオンは塗りのない光る縁取り。ミームのキャプションは素の塗りに重い縁取り。それ以外には何も起きていません。
5つのステップでつくる
ステップ1. まず単語を入力する
エフェクトは単語に合わせるもので、逆ではありません。3文字なら完璧に見えるスタイルが11文字で破綻することはありますし、それは色を決める前に知っておきたいことです。
ステップ2. 欲しいものにいちばん近いスタイルを選ぶ
空のエディターから始めないこと。このページのどのスタイルも、自分の文字が入った動くエフェクトとして開きます。一から組み立てるより、あるものを調整するほうが速いです。
ステップ3. 何よりも先に色を変える
印象の大半は色が担っています。ゴールドに見えるのと同じベベルが、グレーならクローム、ピンクならキャンディーに見えます。ほかの設定には触れずに、です。
ステップ4. 見られる場所に合わせてサイズを決める
サムネイルは、スマホでは幅300ピクセルほどで読まれます。細い縁取りや小さな押し出しはそのサイズで消えるので、これでいけると決める前に小さくして確かめてください。
ステップ5. 正しいファイルをダウンロードする
ウェブには PNG。単語を自分の画像の上に載せるなら透過 PNGで、これが最も見落とされる選択肢です。
このページのスタイルはどれも無料で、アカウントも要りません。TextStudio を開いて、どれにでも自分の言葉を入れてみてください。
アルファベット全部を、一つのエフェクトで
単語ではなく文字が要る仕事もあります。壁に一文字ずつ並べる名前、一文字ずつ切り出すケーキトッパー、教室の掲示。どのスタイルもアルファベット全部を一度にレンダリングできます。
縁取りの太いスタイルでは、隣り合って触れてしまう組み合わせに注意してください。二つの文字がぶつかるなら、文字を縮めるのではなく字間を広げます。
透過PNG
ダウンロードしたエフェクトには、たいてい四角い背景がついてきます。単体ならそれで構いません。自分の写真の上に載せると、写真の真ん中に灰色の箱ができます。
ダウンロードのパネルで、書き出す前に背景を透明にできます。するとファイルに残るのは、文字と、その光と影と奥行きだけです。写真にも動画にもスライドにも Canva のデザインにも落とせて、エフェクトはそのまま保たれます。
この言葉が、最後に置かれる場所
同じエフェクトでも、どこに載るかで振る舞いが変わります。スタイルを決めてしまう前に見ておく価値があります。
動画のサムネイルでは、敵はサイズです。ほかのサムネイルと並んで小さく読まれるので、ディテールよりコントラストが勝ちます。ステッカーや印刷物では、敵は縁です。貼られる相手から切り離すために、単語には縁取りが要ります。透過 PNG はその両方を満たします。
Photoshop の PSD ファイル
完成した画像ではなくレイヤーが欲しいなら、TextStudio はソースファイルも配っています。無料の PSD 文字エフェクトのページでは、それらを個人利用にも業務利用にも使える高解像度の PSD 文字エフェクト画像として説明しています。
PSD を開けるものが必要です。Photoshop か、ブラウザーで動く Photopea。Photopea は無料で、レイヤーも読めます。その道筋の手順はPhotopea で文字エフェクトを編集するにあります。
レイヤーが余分な手間に見合うのは、エフェクトをもっと大きな構図の中に置く必要があるときや、来週クライアントが色を変えてくれと言ってくるときです。
Canva の中で
このページの12スタイルはすべて、Canva 用の文字エフェクトアプリからも使えます。同じエンジンが Canva のエディターの中に入る仕組みです。そこで単語を入力すると、エフェクトがそのままデザインに戻ってきます。あいだにアップロードの手順はありません。
例外はブランドとロゴのスタイルです。Canva はアプリの中でサードパーティのロゴを受け付けないので、それらはウェブサイトに残り、透過 PNG として持ち出すことになります。
費用
上の12スタイルは無料のスタイルで、レンダリングにも費用はかかりません。プレミアムはありますが、それで買えるのは別のものです。Ultra HD の品質、ベクターと PSD を含むすべてのダウンロード形式、限定のエフェクトとフォント、広告なし、クレジット表記の義務なし。価格は月 9.99 ユーロ、年 49.99 ユーロ、買い切り 129.99 ユーロで、これを書いた日に確認しました。
はっきり書いておく価値があるのは、比較対象になるツールの多くが逆をやっているからです。有料の壁の向こうにあるのが、エフェクトそのものなのです。
12種類を一覧で
| エフェクト | 何でできているか | 必要な背景 | 向いている用途 |
|---|---|---|---|
| 3D | 押し出しと光源 | どれでも | ロゴ、サムネイル |
| ゴールド | 暖色のグラデーションとベベル | 暗くて冷たい色 | 招待状、表彰 |
| ネオン | 光るストローク、塗りなし | 暗い色 | 看板、パーティーの投稿 |
| 炎 | 上に立ち上る炎、または内側の熾火 | 暗い色 | ゲーム、スポーツ |
| クローム | 地平線の入ったグラデーション | 暗い色か無地 | 賞状、Y2K |
| キラキラ | 内側の粒とまわりの粉 | 暗い色、画面のみ | 誕生日、プロフィール |
| 縁取り | 一本以上のストローク | にぎやかな写真 | ミーム、ステッカー |
| 影 | ずらした形、硬いかやわらかいか | 単色 | スライド、ポスター |
| カラー | 一文字ずつの色、またはグラデーション | 明るい色 | 教室、パーティー |
| グラフィティ | スプレーの縁、垂れ、飛び散り | 壁、暗い色 | 音楽、ストリートウェア |
| バブル | ふくらんだ形、太い縁取り | 明るい色 | 子ども、カード |
| レトロ | ある年代のディテール | 暖かくくすんだ色 | パッケージ、ポスター |
単語が見られる場所に合う系統を選んで、時間は色に使ってください。かっこいい文字ジェネレーターを開いて、空のキャンバスではなく、いちばん近いスタイルから始めましょう。
よくある質問
これは無料ですか。 ここにある12スタイルは無料で、レンダリングも無料です。プレミアムがカバーするのは Ultra HD、追加の形式、限定のエフェクト、そしてクレジット表記の義務の解除です。
文字エフェクトを商用利用できますか。 何かを売る前に、選んだスタイルのライセンスを読んでください。ブランドのロゴのスタイルは、どのツールでその画像をつくったとしても、あなたがライセンスできるものではありません。
文字エフェクトはアニメーションにできますか。 できるものもあります。アニメーションのスタイルは静止画ではなく動画か GIF として書き出され、このページのものとは別の系統です。
どんなファイルが手に入りますか。 既定では PNG で、ダウンロードのパネルから透過版も選べます。ベクターや PSD の形式はプレミアムのプランです。
Photoshop は必要ですか。 このページの内容には、どれも要りません。Photoshop が関係するのはレイヤー付きの PSD ファイルが欲しいときだけで、その場合でも Photopea がブラウザーで開いてくれます。
どのエフェクトを使えばいいですか。 どこで見られるかから始めてください。小さくてにぎやかならば縁取りか影。暗くて大きいならばネオン、ゴールド、炎。印刷ならばラメ以外のどれでも。