# Blueprint pattern — Unless design system

Surfaces

# Blueprint pattern
  [Construction](/en/design/surfaces/blueprint/)[Variants](/en/design/surfaces/blueprint/variants/)[Download](/en/design/surfaces/blueprint/download/)
## Blueprint geometry — circles, ticks, crosshair, diagonals

The full standalone pattern in uniform light blue (#93B4F5). Concentric φ-ratio circles, a 24-tick band, crosshair, dashed diagonals that go solid inside the logo-silhouette wedge, golden-ratio annotations, degree indicators. Surfaces tint to their desired colour with CSS filters.

### Home variant · paper-cool, white logo fade
  ![](/assets/svg/blueprint.svg)
### Light variant · on paper, light-blue fade
  ![](/assets/svg/blueprint.svg)
### Dark variant · on navy, light-blue fade
  ![](/assets/svg/blueprint.svg)
## Geometry

- **ViewBox**: −115.2 −115.2 230.4 230.4 - square, with logo radius (44) = 38.2% of the extent (golden section).
- **Outer ring**: r=44, with a 24-tick band (15° apart) on the r=41 → r=44 annulus.
- **Middle reference ring**: r=30.
- **Inner ring**: r=15.5 - fits the Unless mark when composed inside `<AgentLoop>`.
- **Crosshair**: horizontal + vertical axes drawn to ±115.2 (= 44 × φ²), with a radial fade to transparent at the edges. For wider reach (e.g. homepage hero), the image is scaled larger than its container.
- **Diagonals**: dashed reference lines at ±45°, hairline weight.
- **Degree indicators**: 0 / 90 / 180 / 270 labels at the four cardinal ticks, ui-monospace 2.6 viewBox units.
       [Monotile background · Download](/en/design/surfaces/monotile/download/)     [Blueprint pattern · Variants](/en/design/surfaces/blueprint/variants/)