Polar Grid

What this grid is

A Polar Grid is a set of concentric rings and radial spokes centered on one point. It is a practical guide for radial layouts, dials, badges, mandalas, and circular compositions. Unlike a line grid, it emphasizes angles and distance from the center.

Key parameters

• Ring Mode — Linear uses constant spacing; Log uses geometric spacing so rings spread out or compress toward the edge.
• Rings — Number of circles (or circle-like rings).
• Ring Spacing (px) — Baseline distance between rings; in Log mode it is the spacing near the center.
• Ring Ratio — Log mode only; >1 makes outer rings farther apart, <1 makes outer rings denser.
• Spokes — Number of radial lines (0 makes rings only).
• Rotation (deg) — Rotates the whole grid without changing geometry.
• Edge Shape (%) — Keeps the same center and spoke alignment, but changes the ring edge profile: 0 = circular, 100 = straight polygon edges, -100 = inward concave edges.

Unique highlights

• One control spans three looks: circular rings at 0, spoke-aligned polygon rings at positive values, and inward-concave rings at negative values.
• Log spacing creates a strong sense of depth and focus toward the center.
• Works as both a subtle guide (low opacity) and a bold graphic element (thicker stroke).

Typical use cases

• Clock faces, compasses, and instrument dials.
• Rosettes, seals, badges, and circular labels.
• Radial infographics and “sunburst” style layouts.
• Mandala-style pattern bases and circular UI mockups.
• Alignment guides for logos built around a central mark.

Tips

• For a classic “dial” look, use linear rings with 12–60 spokes and moderate opacity.
• For a “center-focused” look, use log rings with a ratio slightly above 1 (e.g., 1.05–1.20).
• If polygon rings look uneven, increase spokes (more sides gives a smoother polygon).
• If the grid feels too busy, reduce spokes first, then reduce rings.

FAQ