site/deviant/brand/README.md
Local Dev 3879b05dfb Sweep: mobile Ariadne updates, Deviant brand + sites, Hephaestus bootstrap, snappymail
Broad-scope commit sweeping in work from parallel sessions plus this session's
dev-only utilities. No single unifying theme — this is the "commit everything
that's ready" pass. Grouped by area below.

AriadneResolver / mobile
* Small updates to BchFetcher, Bns, MainActivity, AriadneVpnService, and the
  Android manifest — from a parallel mobile-resolver session.
* AriadneResolver/mobile/webpreview/ — new local dev webview (index.html +
  server.mjs) for iterating on the mobile UI without a device.

Email / SnappyMail
* Email/snappymail-plugin/silentmode-addresses — new SnappyMail plugin
  (README, CSS, PHP entry, JS) for surfacing @silentmode.st address
  management inside the webmail UI.

Hephaestus (Forgejo + auth-proxy)
* auth-proxy/src/oidc.ts + docker-compose.yml updates.
* scripts/bootstrap-auth.sh — idempotent script that registers the wallet
  auth-proxy as Forgejo's OIDC provider after `docker compose up -d`. All
  secrets read from .env — no literals in the script.

TheseusNavigator / dev tools
* dev/list-tlds.mjs — enumerate every registered BNS name grouped by TLD via
  our own indexer.
* dev/show-tlds-bch.mjs — dump the full records payload of the legacy
  tlds.bch name (kept as a diagnostic for the list-in-one-NFT era).

Deviant sites + brand
* site/deviant/ — new microsites (anthemus, potidaea, brand, mindmap, main
  index) plus the full brand kit under site/deviant/brand/ (logos, icons,
  palette, social exports as SVG source + PNG renders).
* site-sirius-x/portal.html — updates.

Coordination
* _coordination/sessions/mobile-resolver.md — parallel-session notes.

Deliberately excluded from this commit:
* scratchpad/ — this session's temp drafts (Sia doc mockups, tlds UPD payloads).
* TheseusNavigator/_prev/ — ~372 MB of prior release binaries; belongs in
  a separate artefacts store, not the git tree. Add to .gitignore next pass.
2026-08-30 10:38:49 +02:00

4.6 KiB
Raw Permalink Blame History

Deviant — Brand assets

Canonical brand assets for the Deviant project. Source of truth for logos, icons, and social-media cards. All primary assets are SVG (resolution-independent, editable in code); PNG exports live under source/exports/ when tooling generates them.

Contents

Path Purpose
palette.md Color tokens + typography, extracted from the landing page CSS
logo/ Wordmarks and combination marks
icon/ App icons, favicons, the D-mark alone
social/ Open Graph, Twitter card, avatar
source/ Editable working files, exports, raw art

Voice — one paragraph

Deviant exists to enable resistance — by giving users on-chain experience that intermediation cannot mediate.

Tagline (short): Power Your Ideas. Tagline (subline): A response to a default trajectory.

The mark

The Deviant mark is a stylized "D" as an orbital crescent on a starfield, with a single acid-yellow dot orbiting the outer ring. It reads two ways:

  • Letterform: D for Deviant.
  • Astronomical: a partial planetary disc with a satellite — the "deviation from the default trajectory" imagery encoded in the logo itself.

Never redraw the orbital dot inside the ring, never tint it any other color — the acid yellow (--acid) is the load-bearing accent across the whole system.

Themes

Both themes ship — the landing page respects data-theme="editorial" in localStorage; assets should exist for both:

  • signal (default): starfield ink on cool deep-space blue. Acid #d6ff3d.
  • editorial: near-monochrome charcoal, more graphic. Acid #c6ff00.

See palette.md for exact values.

What to use where

Surface Asset Size
Browser tab / OS icon icon/favicon.svg, icon/icon-512.svg 64 / 512
App shell splash icon/icon-512.svg 512 (matches shells/app/public/icon.svg)
Website header, README logo/deviant-wordmark.svg 720×180
Print / dark surfaces logo/deviant-mark.svg 256×256, no background
Print / light surfaces logo/deviant-mark-onlight.svg 256×256, inverted
Open Graph (Facebook, LinkedIn, Slack unfurls) social/og-1200x630.svg 1200×630
Twitter/X post card (summary_large_image) social/twitter-card-1200x675.svg 1200×675 (16:9, current spec)
Twitter/X header (profile banner) social/twitter-header-1500x500.svg 1500×500 (3:1, with profile-photo safe zone)
Facebook page cover social/facebook-cover-820x312.svg 820×312 desktop / 640×360 mobile-safe
LinkedIn company banner social/linkedin-banner-1584x396.svg 1584×396 (with profile-photo safe zone)
Instagram feed post social/instagram-square-1080x1080.svg 1080×1080 (also works for Discord/Threads)
Social avatar (X, GitHub, Discord, LinkedIn) social/avatar-400x400.svg 400×400, round-crop-safe

Fonts

Every SVG with text loads the website's own faces (Fraunces + DM Sans + JetBrains Mono) via a <style>@import url(fonts.googleapis.com/...)</style> block inside the SVG. That means:

  • In a browser (opening the SVG directly, or embedding via <img>) the Google fonts fetch and render — same as the website.
  • In rsvg-convert / most SVG-to-PNG renderers the @import is IGNORED (they don't fetch remote CSS) and the fallback stack applies: Georgia for display, system sans for body. If pixel-perfect PNG exports matter, either install Fraunces + DM Sans locally on the export machine, or export from a browser screenshot instead (see source/README.md).

The <style> block never breaks anything — it degrades to the fallback stack.

PNG exports

SVGs are the source. When a platform demands PNG:

# One-off — needs rsvg-convert (fonts fall back) or a headless browser (fonts real)
rsvg-convert -w 1200 -h 630 brand/social/og-1200x630.svg -o brand/source/exports/og-1200x630.png

Do not check in PNGs unless a specific delivery pipeline requires them — source/exports/ is .gitignore-friendly for that reason.

Do

  • Keep the acid dot outside the ring (upper-right, ~2 o'clock).
  • Use Fraunces for display type, DM Sans for body, JetBrains Mono or DM Mono for code / addresses / hashes.
  • Preserve the black-with-starfield background on dark surfaces; the mark is designed for it.

Don't

  • Don't recolor the acid dot — that yellow-green is the brand.
  • Don't add glow to the wordmark; the glow lives only on the orbital dot.
  • Don't tighten the letterspacing of "Deviant" below 0.02em; the wordmark breathes.
  • Don't put the wordmark on the acid color as a background.