Web サイトやスライド、バナー、イラストの仕上げに重ねる「背景テクスチャ」を生成するツールです。種類はノイズ(細かいフィルムグレイン)・紙(明暗2トーンの微粒子で紙っぽい質感)・グリッド(等間隔の方眼線)・ドット(格子状の点)の4つ。幅と高さ(px)を入力し、背景色とテクスチャ色を選び、「強さ」と「スケール」のスライダーで密度・粒の大きさを調整します。背景を透過にすれば、写真やデザインの上に乗せる重ね用ノイズ PNG として書き出せます。ノイズと紙は seed 付きの乱数で描いており、「再生成」ボタンで別のパターンに振り直せます。1024×1024・1920×1080・1200×630(OGP)など、よく使うサイズのプリセット付き。出力は PNG(透過対応)または JPEG。CSS の background-image にそのまま使えるオーバーレイ素材作りに向きます。画像をアップロードする必要はなく、描画と書き出しはすべて端末内(Canvas)で完結します。
使い方
- 種類(ノイズ/紙/グリッド/ドット)を選ぶ。
- 幅と高さ(px)を入力する(プリセットからも選べます)。
- 背景色とテクスチャ色を選び、強さ・スケールを調整する。
- 重ね用なら「背景を透過」をオン。ノイズ/紙は「再生成」で別パターンに。
- 形式(PNG / JPEG)を選び「ダウンロード」で書き出し。画像は送信されません。
よくある質問
画像はサーバーにアップロードされますか?
いいえ。テクスチャの描画と PNG / JPEG 書き出しはすべてブラウザ内(Canvas API)で行われます。生成画像はアップロード・保存・送信されず、あなたの端末内だけで処理されます。
写真やデザインに重ねるノイズを作れますか?
はい。「背景を透過」をオンにすると背景なしでテクスチャだけを描き、透過 PNG として書き出せます。Photoshop やデザインツール、CSS の background でそのまま重ねられます(透過は PNG のみ。JPEG は透過に対応しません)。
毎回同じ模様になりますか?
ノイズと紙は内部の seed(乱数の種)で描いており、設定が同じなら同じ模様を再現します。「再生成」ボタンを押すと種が変わり、別のパターンに振り直せます。グリッドとドットは規則的なので常に同じ並びです。
「強さ」と「スケール」は何を変えますか?
「強さ」はテクスチャの不透明度(濃さ)で、上げるほどはっきり見えます。「スケール」は粒・線・点の間隔(px)で、小さくすると細かく、大きくすると粗いテクスチャになります。グリッド/ドットでは方眼やドットの間隔になります。