From e5ed801ea7c4981b277ddc2f1f91bad1d91df9f4 Mon Sep 17 00:00:00 2001 From: Local Dev Date: Mon, 31 Aug 2026 05:22:45 +0200 Subject: [PATCH] brand: Silent Mode + navigate.st kits (logo, wordmark, avatar, banner, favicon) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Two brand kits, one design language. Each site now has a /brand/ page + a favicon; every page I own on silentmode.st links the SVG favicon (parallel sessions can add the same line to Sirius/Hephaestus/Choose when they touch those files). Silent Mode kit (site/brand/, site/favicon.svg): Mark — two interlocking chain links, one muted (#8b98a9) + one acid (#d6ff3d). The umbrella family mark. Logo, wordmark, avatar (400x400 social), banner (1500x500 social header). Brand page shows every asset with SVG download, colour palette (tokens matching shared.css), usage do's and don'ts. navigate.st kit (navigate.st/brand/, navigate.st/favicon.svg): Mark — compass rose (N acid, other points muted) inside a chain-link ring. Ring keeps it in the Silent Mode family without cloning the SilentMode mark; compass says what this specific site is (the wayfinding front door). Same asset set: logo, wordmark, avatar, banner. Standalone brand page (no shared.css — navigate.st runs single-file). nginx (VPS): added two locations to sites-enabled/navigate-st so /favicon.svg and /brand/* resolve from /opt/silent-mode/navigate-brand/. Rollback point at sites-enabled/navigate-st.bak.1788146513. silentmode.st serves both from disk under /opt/silent-mode/site/ — no vhost change needed. Verified live: all favicon + brand URLs return 200 on both hosts. --- brand/avatar.svg | 20 ++++ brand/banner.svg | 28 +++++ brand/index.html | 231 ++++++++++++++++++++++++++++++++++++++++++ brand/logo.svg | 7 ++ brand/wordmark.svg | 13 +++ favicon.svg | 9 ++ helios/index.html | 1 + hermes/index.html | 1 + index.html | 1 + prometheus/index.html | 1 + releases/index.html | 1 + tools/index.html | 1 + 12 files changed, 314 insertions(+) create mode 100644 brand/avatar.svg create mode 100644 brand/banner.svg create mode 100644 brand/index.html create mode 100644 brand/logo.svg create mode 100644 brand/wordmark.svg create mode 100644 favicon.svg diff --git a/brand/avatar.svg b/brand/avatar.svg new file mode 100644 index 0000000..5d8cf53 --- /dev/null +++ b/brand/avatar.svg @@ -0,0 +1,20 @@ + + Silent Mode — avatar (400×400 profile square) + + + + + + + + + + + + + Silent Mode + + diff --git a/brand/banner.svg b/brand/banner.svg new file mode 100644 index 0000000..3f1a52f --- /dev/null +++ b/brand/banner.svg @@ -0,0 +1,28 @@ + + Silent Mode — banner (1500×500 social header) + + + + + + + + + + + + + Silent Mode + + + Decentralized web infrastructure — names, hosting, browsers, search, messaging. + + + silentmode.st · silentmode.bch (on chain) + + diff --git a/brand/index.html b/brand/index.html new file mode 100644 index 0000000..77e5fcb --- /dev/null +++ b/brand/index.html @@ -0,0 +1,231 @@ + + + + + +Brand — Silent Mode + + + + + + + + + +
+
+ +
+

Silent Mode — brand

+

Two interlocking chain links, one acid green — the family mark for + every Silent Mode product. Kit below: logo, wordmark, avatar, banner, palette, + usage. Every asset is a scalable SVG; raster it to whatever platform demands + a PNG.

+
+ +
+ + +
+

Assets

+ +
+
Silent Mode logo
+
+

Logo

+

Two interlocking chain links. Use where the mark stands alone — favicons, + app icons, small tile placements. Reads at any size from 16 px up.

+
SVG · viewBox 200×200 · scalable
+
+ SVG + Open +
+
+
+ +
+
Silent Mode wordmark
+
+

Wordmark

+

Mark + "Silent Mode" set at 56 px, letter + spacing 0.4. Use for horizontal placements — page headers, business cards, + email signatures.

+
SVG · viewBox 640×120
+
+ SVG + Open +
+
+
+ +
+
Silent Mode avatar
+
+

Avatar

+

Square 400×400 with radial background, centred mark, wordmark below. + Sized for social profile pictures — X, Mastodon, Nostr, GitHub org avatar. + Rasters cleanly to 200×200 and 100×100.

+
SVG · viewBox 400×400
+
+ SVG + Open +
+
+
+ +
+
Silent Mode banner
+
+

Banner

+

Wide 1500×500 header for X / Mastodon covers, GitHub org banners, OG social + cards. Tagline and second-line URL are text nodes — edit in a vector editor + if you need a different language or campaign.

+
SVG · viewBox 1500×500 · 3:1 aspect
+
+ SVG + Open +
+
+
+ +
+
Silent Mode favicon
+
+

Favicon

+

The same mark, compressed for tab-bar and bookmark rendering. Served from + /favicon.svg. Also works as a 16×16 PNG once + rasterised — the shape holds.

+
SVG · viewBox 32×32
+
+ SVG +
+
+
+
+ + +
+

Palette

+

Small palette on purpose — one accent, one text tone, three greys, + a couple of semantics. Same tokens the whole site's shared.css + exposes as CSS variables.

+ +
+
+
Acid
#d6ff3d
+
The accent — links, marks, active state, one CTA per view.
+
+
Ink (bg)
#0b0e14
+
Page background. Dark by default; a light theme is the exception.
+
+
Panel
#141a24
+
Cards, buttons ghost, elevated surfaces.
+
+
Text
#e7eaf1
+
Body ink.
+
+
Muted
#8b98a9
+
Secondary text, disabled state, muted mark stroke.
+
+
Dim
#5e6678
+
Meta, timestamps, "less important than muted".
+
+
Sia
#b39ddb
+
Storage badge. Only for "content lives on Sia".
+
+
Server
#4fd1a5
+
Server badge. Only for "content lives on an ordinary server".
+
+
+ + +
+

Usage

+
+
+

Where the mark goes

+

Anywhere Silent Mode itself is the subject: project sites, README banners, + social profiles, presentation title slides. If a specific product is the + subject (Theseus, Sirius, Prometheus, Hermes, Helios), prefer that + product's own mark and reserve this one for the umbrella.

+
+
+

Clear space

+

Give the mark clearance equal to one chain-link on every side. On the banner + this is honoured by the left-margin; when placing the logo yourself, respect it.

+
+
+

Colours in prose

+

The word "Mode" is in acid; the rest is body text. Don't reverse — "Silent" + in acid + "Mode" in body doesn't read as this brand.

+
+
+

Rasterising

+

SVG is the canonical format. Any modern image tool can convert it to PNG + at the size you need; Inkscape and rsvg-convert are the free defaults. + Don't distribute a low-fidelity trace as "the logo".

+
+
+ +
+ Don't: +
    +
  • Recolour the mark into the palette of another product or brand.
    • +
  • Distort the chain-link proportions (they read as chain because of the ratio; squished, they don't).
    • +
  • Place the mark on a busy image without a solid backing panel.
    • +
  • Use the mark to endorse a third-party product, service, or claim without written permission.
    • +
+
+
+ +
Related brand kits. Navigate.st has its own mark (a compass + rose in a chain-link ring) at navigate.st/brand/. + Each Silent Mode product (Theseus, Sirius, Prometheus, Hermes, Helios) will + eventually have its own kit; this one is the umbrella.
+ +
+ + + + + diff --git a/brand/logo.svg b/brand/logo.svg new file mode 100644 index 0000000..a1ff73e --- /dev/null +++ b/brand/logo.svg @@ -0,0 +1,7 @@ + + Silent Mode — logo + + + diff --git a/brand/wordmark.svg b/brand/wordmark.svg new file mode 100644 index 0000000..853dd91 --- /dev/null +++ b/brand/wordmark.svg @@ -0,0 +1,13 @@ + + Silent Mode — wordmark + + + + + + Silent Mode + + diff --git a/favicon.svg b/favicon.svg new file mode 100644 index 0000000..d963e50 --- /dev/null +++ b/favicon.svg @@ -0,0 +1,9 @@ + + + Silent Mode + + + diff --git a/helios/index.html b/helios/index.html index bd0a342..241bde9 100644 --- a/helios/index.html +++ b/helios/index.html @@ -6,6 +6,7 @@ Helios — searching the decentralized web — Silent Mode + diff --git a/hermes/index.html b/hermes/index.html index f34578a..f23ef84 100644 --- a/hermes/index.html +++ b/hermes/index.html @@ -6,6 +6,7 @@ Hermes — messaging by name — Silent Mode + diff --git a/index.html b/index.html index f54be12..23065de 100644 --- a/index.html +++ b/index.html @@ -6,6 +6,7 @@ Silent Mode — decentralized web infrastructure + diff --git a/prometheus/index.html b/prometheus/index.html index e9d32f2..e8a7d54 100644 --- a/prometheus/index.html +++ b/prometheus/index.html @@ -30,6 +30,7 @@ .banner h3{margin:0 0 .3rem;font-size:1.1rem} .banner p{margin:.2rem 0 0;color:var(--mut);font-size:14.5px} + diff --git a/releases/index.html b/releases/index.html index 287a7c1..e46ed05 100644 --- a/releases/index.html +++ b/releases/index.html @@ -28,6 +28,7 @@ footer{color:var(--dim);font-size:12.5px;margin-top:2.5rem;text-align:center} + diff --git a/tools/index.html b/tools/index.html index 97f24b0..4ea5c2b 100644 --- a/tools/index.html +++ b/tools/index.html @@ -66,6 +66,7 @@ .hashes code{font-family:ui-monospace,monospace;font-size:11.5px;color:#c9d4e3;word-break:break-all} .platform-line{color:var(--dim);font-size:12.5px;margin-top:.2rem;letter-spacing:.02em} +