CSSで作る柄模様

117

こんにちは。
今週は原田がお送りします。

今回はCSSの「グラデーション」を利用して、背景をチェック柄にしてみました。
こうすると画像素材を使わなくてもCSSの記述だけで柄を作ることがきます。
また、記述を変えるとチェックの色と格子の幅を変えることもできます。
(PC版とスマホ版でそれぞれ違う記述にしてみたので、ブラウザの幅を広げたり狭めたりして違いを確認してみてください。)
背景だけでなくバナーや挿絵にも応用できるので、よりデザインに広がりが生まれますね。

The following two tabs change content below.
原田

原田

アーティスティックディレクター

投稿者:

原田

原田

アーティスティックディレクター