※画像に特に意味はありません。

最近、ズルいデザインテクニックというのが流行っているらしいので流行に便乗してこのブログにも取り入れてみました。ズルいですね。

ズルい付箋

基本はこちらのサイトのCSSと同じ構造ですが背景に単色でなくズルいグラデーションを使用しています。

あとは立体感を出すためにぼけ足の長い影を足しています。これは先ほどのサイトのEffect6～8で使われていますね。スライドでも紹介されています。

ズルい背景

背景画像はスライドにあるSubtle Patternsの画像を使用しています。

記事の背景になっている紙のスタイルは付箋と同じテクニックで影付け+ここでも立体感を出すために画像の上からぼけ足の長い影を足しています。

ズルい線、ズルい影

その他、ズルい線やズルい影は色々なところで使われています。

使ってる箇所が多いのでスライドにもあるようにMixin化して使っています。(私はbootstrap+lessを使ってるのでbootstrap+lessで作りました)

ズルい感想←?

やって見ると思いの外簡単に見栄えを良くすることが出来ました。ズルいですね。

個人的に好みなのはズルい線とズルいグラデーションです。特にグラデーションは言われないと入ってるか入ってないか微妙なくらい薄くてもいざ削ると印象が大きく変わります。

というわけで今回はブログのCSSを更新した事をネタに記事を更新するというズルい回をお送りしました。