鬼滅の刃、勢いが止まりませんね。
公開24日間で204億円突破らしいです。
もはや異次元過ぎて理解不能です。千と千尋超えて歴代一位になるのも時間の問題なのかと。
今回はそんな大ヒットに乗っかって、鬼滅の刃の文字組みを利用し、文字の中に画像を表示するジェネレーターを作りました。
主題歌でもあるLiSAさんの「炎」をイメージし、亀裂が入った溶岩画像を文字の中に表示しています。
その画像文字に文字を重ねて白と赤のぼかしを入れてました。
それだけだとなんとなく寂しかったので、赤い飛沫を斜めに入れてます。
イラレで画像内に文字を入れる方法は以下となります。
イラストレーターを利用し画像を文字内に表示する方法
1.画像を配置する
2.画像の上に文字を配置する
文字の大きさを調整して、鬼滅の刃風の文字デザインにします。
3.画像と文字を選択し右クリックークリッピングマスクを選択
4.文字の中に画像が表示されます
SVGの出力方法についてはこちら
イラストレーターでタイトルロゴを作成!SVG文字ジェネレーターを作る方法
他の画像も選択できるように
銀河や砂、水、雪などの画像を選択できるようにしました。
画像選択時にURLをbase64形式に変換し、svgのimgタグに設定し、文字背景のぼかしの色も変更しています。
dataURLの変換については以下の記事を参考にしました。
JavaScriptで画像をbase64形式のURLに変換するやり方
選択すると以下のようなイメージで画像化できます。
画像が変わると印象もガラッと変わりますね。
好きな文字を入れて遊んでみてください〜
コメントを残す