手紙などにプレスしたようなエフェクト「レタープレス」をPhotoshopで画像として作成するチュートリアルとCSSで実装するチュートリアルをAcrisDesignから紹介します。
Letterpress Text Effect Using Photoshop and CSS
レタープレスのエフェクトは2009年頃からあちこちのサイトで見られるようになりました。
主に、タイトルや見出しなどによく使用されています。
下記は、そのレタープレスをPhotoshopで作成した画像とCSSで実装したキャプチャです。
Photoshopで作成した画像のレタープレス
CSSで実装したレタープレス
デモページ
チュートリアルはどちらも詳しく説明されており、Photoshopは各ステップごとにキャプチャ付きで英語が苦手な方でも作成できると思います。
CSSもコードが公開されており、すぐに利用が可能となっています。
Post on:2010年3月17日
[...] レタープレスエフェクトのチュートリアル、あなたは画像派？ CSS派？ | コ… (tags: css photoshop tutorial) WPのWYSIWYGをCKEditorに変更するプラグイン・CKEditor [...]
[...] Explorer 9（IE9）」のプレビュー版を提供開始 – GIGAZINEfc2:1 レタープレスエフェクトのチュートリアル、あなたは画像派？ CSS派？ | コ…fc2:1 セレブママ大注目！ Sマッカートニー×GAPキッズがカムバックnewsing:1 [...]
レタープレスエフェクトのチュートリアル、あなたは画像派？ CSS派？
「Letterpress Text Effect Using Photoshop and CSS」
手紙などにプレスしたようなエフェクト「レタープレス」をPhotoshopで画像として作成するチュートリアルとCSSで実装するチュートリアルを AcrisDesign…