SVG サーキュラーパターンジェネレーター

ドット・リング・ポルカパターン — すべて SVG で

円ベースのパターンは、最もシンプルでありながら効果的なデザイン要素の 1 つです。他のコンテンツと争うことなく、リズム、遊び心、動きを添えられます。このジェネレーターは人気の 3 バリエーションを 1 クリックで生成します:

パターンモード

• 同心円リング — 中心から外に向かって等間隔に並ぶ円。色を交互にするとダーツ・レーダー風の見た目に、アウトラインのみモードではクリーンで最小限のリングアートに。
• ドットグリッド — 完璧なグリッド上のクラシックなポルカドット。ドットサイズと列数で控えめなスティップリングから大胆なレトロパターンまで。
• オフセットドット — 行ごとに交互にずらしたドットがハニカムのリズムを作る。背景やシームレスパターンに優雅。

コントロール

• モード — 3 つのパターン形状。
• リング / 列 — パターンの密度。
• ドットサイズ — グリッドモードでの各ドットの大きさ。
• 色 / 背景 — 前景 / 背景のペア。
• アウトラインモード — 塗り潰しドットとリング輪郭を切替、ストローク幅を調整可能。

用途

• ヒーロー背景と装飾的セクション区切り
• プロダクトモックアップや生地風グラフィック
• ローディング状態や UI アクセント
• 記事の編集装飾
• モバイル画面の高コントラスト背景

各円は軽量な <circle> 要素なので、SVG 全体は小さく、後からいじりやすい — 色を入れ替えたり、任意サイズにスケールしたり、<pattern> に入れて無限背景にしたりできます。