hatch-surf/brand/mark/mark.svg
Designer fcfde5660c brand: add Hatch v1 wordmark, mark, favicon, banner, OG image, usage guide
v1 brand kit for the Hatch launch (ELF-53).

Files:
  brand/wordmark/   - text+mark wordmark (SVG with embedded Inter Bold,
                     plus PNG exports at 200x60, 400x120, 800x240,
                     1200x360); light/dark and on-light/on-dark variants
  brand/mark/       - the icon alone, in 16/32/48/64/128/192/256/512/1024
  brand/favicon/    - favicon.ico (16+32+48) and the 5 required PNG sizes
  brand/banner/     - README banner at 1280x640 (+ @2x retina)
  brand/og/         - OG image at 1200x630 (+ @2x retina)
  docs/brand/usage.md - one-pager on spacing, clear space, do-not rules,
                     light/dark mode behavior

Concept:
  Mark is a rounded square with a horizontal slot — the literal "hatch".
  A small "request" indicator drops into the slot. At 16px the slot still
  reads; at 512px the proportions hold.

Type:
  Inter Bold for the wordmark; JetBrains Mono for the code/tagline accent.
  Both SIL OFL 1.1, attributed in docs/brand/usage.md.

Color:
  Ink #0A0A0B, Paper #FAFAF9, Accent #F59E0B. No other colors in the kit.

Co-Authored-By: Paperclip <noreply@paperclip.ing>
2026-06-22 16:46:11 +02:00

18 lines
866 B
XML

<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 1000" width="1000" height="1000" role="img" aria-label="Hatch mark">
<g>
<!-- Rounded square body -->
<rect x="100" y="100" width="800" height="800" rx="192" ry="192"
fill="none" stroke="#0A0A0B" stroke-width="88" stroke-linejoin="round"/>
<!-- The slot: a horizontal bar -->
<line x1="276" y1="460" x2="596" y2="460"
stroke="#0A0A0B" stroke-width="61.599999999999994" stroke-linecap="round"/>
<!-- The request: a small filled square above the slot -->
<rect x="436" y="244" width="128" height="128" fill="#0A0A0B"/>
<!-- The stem connecting the request to the slot -->
<line x1="500" y1="372" x2="500" y2="460"
stroke="#0A0A0B" stroke-width="46.199999999999996" stroke-linecap="round"/>
</g>
</svg>