Files
anwar-pi-website/docs/brand/GUIDELINES.md
T

3.3 KiB
Raw Blame History

أنور پآي — Logo Guidelines (compact)

  • Idea: an A built from a triangle lattice, where the gold piece is the next one being placed. It shows structure being built one step at a time, the way a model generates.
  • Versions: horizontal lockup (primary) · stacked · symbol · wordmark only · small-size symbol
  • Light backgrounds: *-light.svg. Dark backgrounds: *-dark.svg. One colour: *-black.svg / *-white.svg.
  • Arabic reads right to left, so in the horizontal lockup the symbol sits on the right, at the start of the line.

2. Clear space

Keep one lattice-triangle height (⅓ of the symbol's height) clear on every side. The zone scales with the logo.

3. Minimum size and which symbol to use

Version Screen Print
Horizontal lockup 120 px wide 30 mm wide
Stacked lockup 72 px wide 18 mm wide
Symbol, full lattice (anwarpy-symbol-*) 40 px and up 10 mm
Symbol, small-size cut (anwarpy-symbol-small*, favicons) 16–32 px 4–9 mm

Below about 40 px the gaps between triangles close up, so switch to the small-size cut there.

4. Colour

Name Use HEX RGB CMYK (approx.)
Basalt ink Pieces and wordmark on light #131519 19 21 25 24 16 0 90
Gold (light) The gold piece on light #b08a45 176 138 69 0 22 61 31
Gold (dark) The gold piece on dark #d4b47c 212 180 124 0 15 42 17
Paper Pieces and wordmark on dark #f2f1ee 242 241 238 0 0 2 5
  • Contrast: ink on white 18.3:1 · gold on white 3.2:1 (passes the 3:1 minimum for graphics) · dark gold on #0c0d0f 9.8:1.
  • Gold is used for exactly one piece. Never colour the wordmark, a second triangle, or a background in gold behind the mark.
  • The CMYK values are naive conversions. Ask the printer for a proof or a Pantone match before printing.
  • The reversed (dark) files use slightly wider gaps (4.6 vs 4.0 units) so the light pieces don't look swollen. Always use the dark files on dark backgrounds rather than recolouring the light ones.

Approved pairs: full colour on white or paper · dark version on basalt #0c0d0f/#131519 · black on white · white on photos (calm area only).

5. Typography

  • Wordmark: IBM Plex Sans Arabic Bold, outlined to vector paths with HarfBuzz shaping. Don't retype it.
  • Licence: SIL Open Font License 1.1 (allows use in a logo).

6. Don'ts

Don't stretch, rotate or mirror · don't move, add or recolour pieces · don't bring back the grey tone ramp · don't add glows, gradients, shadows or outlines · don't put the full-colour mark on gold or busy photos · don't use the full lattice below 40 px · don't rearrange the lockup or retype the name.

7. Files

  • svg/: masters (symbol, small cut, horizontal, stacked, wordmark; light/dark/black/white; app icon)
  • png/: transparent PNG exports
  • web/: favicon.ico, favicon.svg (adapts to light/dark tabs), 16/32/48 px PNGs, apple-touch-icon.png, icon-192/512.png
  • presentation.html + slides/: final board with mockups

8. Open items

  • No Latin "Anwarpy" lockup yet. Add one if the brand needs to appear in English.
  • No trademark search has been done. Run one (trademark databases plus a reverse image search) before wide rollout.