画像を使わないPureCSSでつくる背景パターンを集めました -『CSS』
toc
ー
CSSのbackgroundを駆使して描く、画像を使わない背景パターンのアイデアをまとめました。
なんらかのパターンをくりかえす背景は、画像で指定した方が実装しやすいということはありますが、レスポンシブデザインやRetinaディスプレイなどの高解像度ディスプレイを考慮していくと、CSSだけで実装できるものはCSSに任せてしまう方がいいのではないかと思います。
また、CSSで指定することにより動的な表現を美しく実装することも可能になり、表現の幅が広がります。
CSS3 Patterns Gallery
かなり豊富に背景パターンがまとまっています。
サムネイルをクリックすると、その背景柄のページに遷移して、実際のコードを見ることができます。
CSS3 Patterns Gallery
CSSグラデーションで作った背景パターンのサンプル
細かく実装のためのtipsが掲載されていて、どうやって複雑なパターンを実装すればいいのかがわかりやすくなっています。
自分好みの背景を作成する参考になります。
おわります。
