最近結構いろんなところで見かけるレタープレス風のデザインですが、結構使うことがあるのでとりあえずメモ。

Photoshopの場合

レタープレスにしたいレイヤーのレイヤースタイルを開いて上から順にこんなかんじに設定。
※カラーオーバーレイで色を塗るのでレイヤーの「塗り」は0。

  1. カラーオーバーレイ
    描画モード:通常
    描画色:好きな色。背景より濃い色で。
    不透明度:60とか70%くらいにしておくと背景に馴染むと思います。たぶん。
  2. ドロップシャドウ
    描画モード:通常
    描画色:白とか白っぽい色
    不透明度:45%くらい
    角度:90°
    包括光源のチェックを外す
  3. シャドウ(内側)
    描画モード:乗算
    描画色:黒とか黒っぽい色
    不透明度:75%くらい
    角度:90°
    包括光源のチェックを外す
  4. 必要に応じてグラデーションオーバーレイやパターンオーバーレイで調整

みたいな感じで。
ただ、背景色やレタープレスにする要素の色によって色は多少変更していく必要があると思います。

CSS3の場合

↓CSSってところをクリックするとCSSソースが見られます

うーん、つくってみたものの、なんか違うような?
なかなか難しいです。。

コメントする