55 lines
2.7 KiB
Markdown
Executable File
55 lines
2.7 KiB
Markdown
Executable File
# Brand assets
|
||
|
||
The official logo files are installed. This page explains what each one is and when to use it.
|
||
|
||
## Files in `docs/assets/`
|
||
|
||
| File | What it is | Used by |
|
||
|---|---|---|
|
||
| `logo.svg` | Copy of `logo-mark-white.svg` | Site header (Material reads `theme.logo`) |
|
||
| `logo-mark-white.svg` | Symbol only, white | Header (on the accent blue), dark scheme |
|
||
| `logo-mark-black.svg` | Symbol only, black | Homepage lockup in light scheme |
|
||
| `logo-lockup-black.svg` | Symbol **+ "Bitcoin After Life"** wordmark, black | Print, covers, external use |
|
||
| `logo-lockup-white.svg` | Same lockup, white | Dark backgrounds, external use |
|
||
| `favicon.png` | Symbol in `#2d6cdf`, 256×256 | Browser tab (`theme.favicon`) |
|
||
|
||
All were derived from the official `Logo nero.svg`: recoloured, and — for the mark-only
|
||
versions — cropped to `viewBox="0 0 205.29 212.5"` to remove the wordmark band.
|
||
|
||
## The Optima dependency — important
|
||
|
||
The wordmark in the **lockup** files is live `<text>` in **Optima-Bold**, not outlines.
|
||
On any machine without Optima installed, the browser substitutes another face and the
|
||
wordmark no longer matches the brand.
|
||
|
||
Two mitigations are already in place:
|
||
|
||
1. A fallback stack — `'Optima-Bold', Optima, Candara, 'Segoe UI', 'Trebuchet MS', sans-serif`.
|
||
2. The three original absolutely-positioned text runs (`Bitcoin` / ` ` / `After Life`) were
|
||
merged into a **single centred `<text>`**. In the original they overlapped badly whenever
|
||
Optima was missing.
|
||
|
||
**The proper fix**, when someone has Optima and a vector editor: open the lockup, convert
|
||
the text to outlines (Illustrator: *Type → Create Outlines*; Inkscape: *Path → Object to Path*),
|
||
re-export, and replace the two lockup files. After that the wordmark is font-independent.
|
||
|
||
Until then, prefer the **mark-only** files wherever the rendering environment is unknown.
|
||
|
||
## Why the homepage does not use the lockup SVG
|
||
|
||
The homepage builds its own lockup: the mark, then "Bitcoin After Life" as HTML text in
|
||
**Inter**. This mirrors what the website's top bar does, and sidesteps the Optima problem
|
||
entirely. See `.bal-hero` in `docs/stylesheets/extra.css`.
|
||
|
||
## Typeface note
|
||
|
||
`OPTIMA.TTF` ships in the `bal-website` repo, but Optima is a licensed commercial typeface.
|
||
Do **not** self-host it as a webfont in this repository unless the project holds a webfont
|
||
licence. The manual uses Inter, matching the landing page's `--display` / `--body` stack.
|
||
|
||
## Replacing a logo later
|
||
|
||
Keep the filenames. Drop the new file over the old one and rebuild — `mkdocs.yml`,
|
||
`index.md` and the CSS all reference these names, so nothing else changes. If you replace
|
||
`logo-mark-white.svg`, copy it over `logo.svg` too (that is the header logo).
|