コピペで簡単！CSSで実装されたジグザグ、波状、罫線、アイソメトリックスなど背景パターンのスタイルシート

ジグザグ、波状、罫線、アイソメトリックスなど、CSSで実装されたさまざまな背景用パターンをコピペで簡単に利用できるオンラインツールを紹介します。

カスタマイズにも対応しており、前景と背景のカラー、不透明度、サイズを簡単に変更できます。

CSS Background Patterns

ツールの利用は、下記ページから。
登録など、面倒なことは一切不要です。

CSS Background Patterns

使い方は、簡単です。
使用したいパターンのボタンをクリックすると、CSSがコピーできます。
カスタマイズは上部のバーからカラーや不透明度やサイズを変更できます。

左のアイコンは背景をそのパターンに変更します。

登録されているパターンは、下記の通り。

登録されているパターンの一覧

いくつか気になったパターンをピックアップしてみました。

ZigZag

ジグザグのCSSは、下記の通りです。

Wavy

ウェービー、波状のCSSは、下記の通りです。

Lines v3

水平の罫線のCSSは、下記の通りです。

Isometric

アイソメトリックスのCSSは、下記の通りです。