CSSで北斗の拳のタイトルロゴを作ってみた

CSSでお絵描きするのは楽しいな〜

今回は僕のバイブルといっても過言ではない「北斗の拳」のタイトルロゴをCSSで作ってみました。

「作ってみた」といっても、かなり前に作った作品を公開してるだけなんですけどねｗ

基本はマーベルのロゴを作ったときと同じ作り方で、こういった直線ベースのデザインなら、大概のものは作れちゃいます。

CodePen Embed Fallback

今回はtransform: skewX();で斜体に、filter: drop-shadow();で影をつけています。

「斗」の稲妻部分だけは、角度的な問題で、別途疑似属性で作りました。

ここまで忠実に再現できると、完成したときの喜びは半端ないっす！