Dot Logo Designer

Render text onto a square dot grid and export a production-ready SVG.

Quick Start

Apply tuned defaults for crisp icon-like dot logos, then refine as needed.

Text + Font

Text

Font family

Available fonts

Detecting common local fonts...

Font weight (boldness)

Font style

Letter spacing (px)

Font scale (% of max fit)

Text offset X (px)

Text offset Y (px)

Grid + Shape

Canvas width (px)

Canvas height (px)

Dot spacing (px)

Dot radius (px)

Edge padding (safe margin, px)

Reserved margin around the canvas where no dots are placed. Lower padding lets the logo fill more space.

Highlight threshold (alpha)

Color

Background

Lowlight dots

Highlight dots

Output

Logo variant

For app icons/themes, mono `currentColor` is recommended so host UI controls the color.

Preview backdrop

Backdrop color

SVG mode

Compact mode reduces repeated markup and usually cuts file size.

Target render sizes (px, comma-separated)

Common UI icon sizes: 16, 20, 24, 32, 48, 64. “Tune dots” uses the smallest target size as the limiting case and aims for a cleaner dot-matrix render.

Show 16x16 guide overlay in main preview

Guide is preview-only and is not included in copied/downloaded SVG output.

SVG source