レタープレスエフェクトのチュートリアル、あなたは画像派? CSS派?
Post on:2010年3月17日
手紙などにプレスしたようなエフェクト「レタープレス」をPhotoshopで画像として作成するチュートリアルとCSSで実装するチュートリアルをAcrisDesignから紹介します。

Letterpress Text Effect Using Photoshop and CSS
レタープレスのエフェクトは2009年頃からあちこちのサイトで見られるようになりました。
主に、タイトルや見出しなどによく使用されています。
下記は、そのレタープレスをPhotoshopで作成した画像とCSSで実装したキャプチャです。

Photoshopで作成した画像のレタープレス

CSSで実装したレタープレス
デモページ
チュートリアルはどちらも詳しく説明されており、Photoshopは各ステップごとにキャプチャ付きで英語が苦手な方でも作成できると思います。
CSSもコードが公開されており、すぐに利用が可能となっています。
sponsors