◈Free
SVG dot pattern generator
Generate a seamless dot pattern with precise spacing.
Generate a seamless dot pattern with precise spacing. Set tile spacing, dot radius and color to create a centered circle in a reusable SVG tile. Width, height and viewBox all match the spacing to support repeated backgrounds.
How to use
- Enter your text, values, or image.
- Adjust the options and run the tool.
- Copy or download your result.
Worked example
Example input
Grid spacing: 20 Dot radius: 2 Dot color: #808080
Example result
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"><circle cx="10" cy="10" r="2" fill="#808080"/></svg>
Limitations and details
The radius cannot exceed half the spacing; this generates a tile only and does not add background CSS automatically.
Inputs and options
- Grid spacing
- Number · Minimum: 2 · Maximum: 500
- Dot radius
- Number · Minimum: 0.1 · Maximum: 100
- Dot color
- Text
Frequently asked questions
Is this tool free and private?
Yes. All 300 tools are free in this phase. Processing happens in your browser; your input and files are not sent to our servers.