CSS背景パターン
ストライプ・斜線・ドット・水玉・チェック・格子・ジグザグ・波などの背景模様を、CSSのグラデーションだけで作ります。色・大きさ・不透明度を変えられます。
模様
大きさは模様 1 つ分（くり返しの単位）の幅です。4〜400px まで入力できます。
プレビュー
模様を選ぶと、その場でCSSを作ります。
CSS
補足
-
模様はすべて CSS のグラデーション（
linear-gradient/radial-gradient/conic-gradient）だけで描いています。画像ファイルは不要で、拡大してもぼけません。 - 不透明度は模様の色だけにかかります。地の色は常に不透明です。ギンガムチェックは不透明度を下げると、縦横の帯が重なった所が濃くなります。
- 境目は計算上ぴったりの位置で色を切り替えているため、大きさや画面の倍率によっては線がわずかにぼけたり、太さが 1px ずれて見えたりすることがあります。
- 入力した値は、この端末の外へ出ません。
よくある質問
どんな模様を作れますか？
横ストライプ・縦ストライプ・斜線・ドット・水玉（互い違い）・チェック（市松）・格子（方眼）・ギンガムチェック・ジグザグ・波（うろこ）・三角・ひし形（斜め格子）の12種類です。模様の色・地の色・大きさ・模様の不透明度を変えられます。
画像ファイルは必要ですか？
不要です。模様はすべて CSS のグラデーション（linear-gradient / radial-gradient / conic-gradient）だけで描いているので、出力した CSS を貼るだけで表示されます。拡大してもぼけません。
線の太さやドットの大きさを個別に変えられますか？
できません。線の太さやドットの半径は「大きさ」に比例して自動で決まります。細かく変えたい場合は、出力した CSS の px の値を直接書き換えてください。
地の色を透明にできますか？
この画面ではできません。地の色は常に不透明な色で出力します。透明にしたい場合は、出力の background-color の行を消してください。