From 41b5b184ad2fffb26a04cb047f3301b405479209 Mon Sep 17 00:00:00 2001 From: Local Dev Date: Wed, 21 Oct 2026 23:41:39 +0300 Subject: [PATCH] hermes brand kit: logo lockups, avatars, banners, OG + social posters MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Full kit built from file.svg (user-authored vector master) via a Python compositor. Everything in site/hermes/branding/ and mirrored into site-hermes-x/assets/. Vector lockups (SVG, scalable): - logo-horizontal.svg + on-sky + light variants (mark + "Hermes" side-by-side) - logo-stacked.svg + on-sky variant (mark above wordmark) - wordmark.svg + wordmark-navy.svg (type-only) Raster assets (PNG at native platform sizes): - avatar-dark.png / avatar-light.png / avatar-sky.png (1000x1000) Social profile images for Twitter / Discord / Nostr / Telegram - banner-twitter.png (1500x500) — X / LinkedIn / Facebook header - banner-hero.png (2000x700) — website hero - og-card.png + og-card-sky.png (1200x630) — Open Graph link previews - poster-square.png (1080x1080) — Instagram / Mastodon Branding page rewritten to showcase everything with download links at hermes.x/branding (deployed to Sia bucket, synced via systemd timer). The Hermes/Icons folder also contained three third-party images with visible AdobeStock watermarks or Hermès-brand references — those are NOT used in the kit, which stays strictly on the user's own winged- envelope mark + the type lockups built around it. --- branding/index.html | 495 +++++++++++++++++++++++++++---------------- index.html | 1 + messenger/index.html | 1 + overview/index.html | 244 +++++++++++++++++++++ 4 files changed, 557 insertions(+), 184 deletions(-) create mode 100644 overview/index.html diff --git a/branding/index.html b/branding/index.html index a39bd97..603e4f8 100644 --- a/branding/index.html +++ b/branding/index.html @@ -1,184 +1,311 @@ - - - - - -hermes.x — brand kit - - - - - - - - - -
- -

Brand kit

-

Mark, palette, name, voice. One page so client builds, add-on - chrome, screenshots and third-party press stay consistent.

-
- -
- -
-

The name

-

In English the product is Hermes — after the Greek god of - messengers, travellers, and crossings. In modern Greek the same name is - Ermis (Ἑρμῆς). Written form is always Hermes outside Greek contexts.

-

The keyboard shortcut inside Theseus is Ctrl+Shift+E - — E for Ermis, off the collision path with Chrome's own Ctrl+Shift+M.

-
- -
-

The mark

-

A tilted envelope with three speed-trails on the back edge - — a letter mid-flight. Monochrome, scales from 16 px (sidebar icon) to - 160 px (hero) without legibility loss. SVG uses - currentColor so it inherits whatever text - colour it sits in.

- -
-
-
Hermes
- 16 px — stroke variant (one trail) -
-
-
Hermes
- 32 px — standard (3 tapered trails) -
-
-
Hermes
- 64 px — in-panel -
-
-
Hermes
- on sky background -
-
- -
- ⬇️ mark.webp (main — the signin / top-bar icon) - ⬇️ mark-wings-both.webp (variant — full upper + lower wings) -
- - - - - - - - - - - - - - - - - - - - - -
DoDon't
Keep the envelope tilted ~22°, trails on the back-left.Mirror the mark or tilt it the opposite direction.
Let the mark inherit text colour (currentColor).Hard-code a colour inside the SVG; it limits reuse.
Use the stroke variant below 24 px display size.Scale the standard mark below 20 px — trails merge.
Pair with the wordmark "hermes.x" when context is unclear.Apply to a product with a different protocol or trust model.
-
- -
-

Palette

-

Hermes rides on a sky-blue primary — fast, airborne, legible - on both dark and light. The deep navy background is the natural pairing; - the dim tones are for muted type.

- -
-
bg#0b0e14 — primary surface
-
panel#141a24 — cards, sidebar
-
sky#38BDF8 — primary accent (mark)
-
sky-soft#60A5FA — hover, secondary
-
sky-deep#0EA5E9 — pressed / active
-
orange#FF6D00 — alternate accent
-
orange-light#FF8C1A — hover, secondary
-
orange-deep#E65100 — pressed / active
-
ink#e7eaf1 — body text
-
mut#8b98a9 — muted text
-
warn#ffc75f — warnings, unread accents
-
-
- -
-

Voice

-
    -
  • Blunt about limits. - "Relays still see recipient and timing" is the tone, not "fully - anonymous messaging". Say what the design does and does not solve.
    • -
  • No evangelism about Nostr. - Nostr is the transport, not the product. Mention it where it - matters (relays, pubkeys, NIP-17) and don't elsewhere.
    • -
  • "Message by name" is the one-line pitch. - Everything else is supporting detail.
    • -
  • Lowercase for product nouns in body copy. - hermes.x, messenger, panel. Capital Hermes for titles and the first - mention per page.
    • -
-
- -
-

Attribution + reuse

-

Mark + palette are MPL-2.0 along with the rest of the Hermes client source. - Use for reviews, press, interoperability docs and the client's own chrome. - Don't apply to products that aren't actually Hermes (forks with different - protocols or trust models included).

-
- -
- - - - - + + + + + +hermes.x — brand kit + + + + + + + + + +
+ +

Brand kit

+

Mark, logo lockups, avatars, banners, social cards, palette, voice. One page + so client builds, add-on chrome, screenshots and third-party press stay consistent.

+
+ +
+ +
+

The name

+

In English the product is Hermes — after the Greek god of messengers, + travellers, and crossings. In modern Greek the same name is Ermis + (Ἑρμῆς). Written form is always Hermes outside Greek contexts.

+

The keyboard shortcut inside Theseus is Ctrl+Shift+E + — E for Ermis, off the collision path with Chrome's own Ctrl+Shift+M.

+
+ +
+

The mark

+

A tilted winged envelope — a letter mid-flight. Vector, scales + cleanly from favicon to hero. Ships as one SVG with the sky-blue fill plus + dark inner cutouts for the flap V-fold.

+ +
+
16 px (favicon)
+
24 px (sidebar)
+
32 px
+
64 px
+
96 px (panel)
+
on sky
+
on light
+
+ +
+ ⬇️ mark.svg vector master + ⬇️ favicon.svg same, favicon slot +
+
+ +
+

Logo lockups

+

Mark + wordmark for use when context needs more than the icon alone. + Three surfaces: default dark, inverted for sky-blue backgrounds, light-background variant.

+ +
+
+ Hermes logo horizontal + horizontal — default +
+
+ Hermes logo on sky + horizontal — on sky +
+
+ Hermes logo light + horizontal — on light +
+
+ Hermes logo stacked + stacked — default +
+
+ Hermes logo stacked on sky + stacked — on sky +
+
+ Hermes wordmark + wordmark only +
+
+ +
+ ⬇️ logo-horizontal.svg + ⬇️ logo-horizontal-on-sky.svg + ⬇️ logo-horizontal-light.svg + ⬇️ logo-stacked.svg + ⬇️ logo-stacked-on-sky.svg + ⬇️ wordmark.svg + ⬇️ wordmark-navy.svg +
+
+ +
+

Avatars

+

1000×1000 PNG, square, mark centred. Use the dark variant on + Twitter / Discord / Nostr / Telegram where the default surface is dark; + use the light variant for light-themed platforms.

+ +
+
+ Hermes avatar dark + avatar-dark.png
1000×1000 +
+
+ Hermes avatar light + avatar-light.png
1000×1000 +
+
+ Hermes avatar sky + avatar-sky.png
1000×1000 +
+
+ +
+ ⬇️ avatar-dark.png + ⬇️ avatar-light.png + ⬇️ avatar-sky.png +
+
+ +
+

Banners

+

Social-platform headers + website hero. Rendered at native + aspect ratios so no cropping on upload.

+ + + + + +
+ ⬇️ banner-twitter.png + ⬇️ banner-hero.png +
+
+ +
+

Social cards + posters

+

Open Graph card for link previews (every chat / search engine + renders this when hermes.x is shared), plus a square Instagram-style poster.

+ + + + + + + +
+ ⬇️ og-card.png + ⬇️ og-card-sky.png + ⬇️ poster-square.png +
+
+ +
+

Usage

+ + + + + + + + + + + + + + + + + + + + +
DoDon't
Keep the envelope tilted, wing on the back-left.Mirror the mark or tilt it the opposite direction.
Use the dark-fill variant against sky-blue surfaces.Place the sky-blue mark on a sky-blue background.
Pair with the wordmark "Hermes" when context is unclear.Apply to a product with a different protocol or trust model.
Scale the vector mark freely — it's crisp at any size.Rasterise and re-upscale; use the SVG as the source of truth.
+
+ +
+

Palette

+

Hermes rides on a sky-blue primary — fast, airborne, legible + on both dark and light. The deep navy background is the natural pairing; + the dim tones are for muted type.

+ +
+
bg#0b0e14 — primary surface
+
panel#141a24 — cards, sidebar
+
sky#38BDF8 — primary accent (mark)
+
sky-soft#60A5FA — hover, secondary
+
sky-deep#0EA5E9 — pressed / active
+
orange#FF6D00 — alternate accent
+
orange-light#FF8C1A — hover, secondary
+
orange-deep#E65100 — pressed / active
+
ink#e7eaf1 — body text
+
mut#8b98a9 — muted text
+
warn#ffc75f — warnings, unread accents
+
+
+ +
+

Voice

+
    +
  • Blunt about limits. + "Relays still see recipient and timing" is the tone, not "fully + anonymous messaging". Say what the design does and does not solve.
    • +
  • No evangelism about Nostr. + Nostr is the transport, not the product. Mention it where it + matters (relays, pubkeys, NIP-17) and don't elsewhere.
    • +
  • "Message by name" is the one-line pitch. + Everything else is supporting detail.
    • +
  • Lowercase for product nouns in body copy. + hermes.x, messenger, panel. Capital Hermes for titles and the first + mention per page.
    • +
+
+ +
+

Attribution + reuse

+

Mark + palette + brand kit assets are MPL-2.0 along with the rest of the + Hermes client source. Use for reviews, press, interoperability docs and the + client's own chrome. Don't apply to products that aren't actually Hermes + (forks with different protocols or trust models included).

+
+ +
+ + + + + diff --git a/index.html b/index.html index 7416c0c..778aa09 100644 --- a/index.html +++ b/index.html @@ -25,6 +25,7 @@ Hermes Hermes.X + Overview Messenger Branding Get Theseus diff --git a/messenger/index.html b/messenger/index.html index d008f77..3746bc7 100644 --- a/messenger/index.html +++ b/messenger/index.html @@ -88,6 +88,7 @@ Hermes Hermes.X + Overview Messenger Branding Get Theseus diff --git a/overview/index.html b/overview/index.html new file mode 100644 index 0000000..6dc6460 --- /dev/null +++ b/overview/index.html @@ -0,0 +1,244 @@ + + + + + +hermes.x — overview + + + + + + + + + +
+ +

What Hermes is

+

End-to-end encrypted DMs over Nostr, addressed by your + on-chain registered name instead of a public-key string. The desktop + client (inside Theseus) is live today; the browser messenger is in + progress. This page shows the UI, the plan, and what still has to + land before the browser version ships.

+
+ +
+
+
+ Preview. The desktop messenger inside Theseus + is live today — threaded chat, persistent history, address book, keyboard + shortcut Ctrl+Shift+E. The web-only client + (what this page becomes) is in development: BIP-39 → Nostr key derivation, + BCH-name resolution via gateway, NIP-17 wrap/unwrap, WebSocket to relays, + IndexedDB inbox. Everything client-side, nothing uploaded. +
+
+ +
+
+
+
Hermes · hermes.x/messenger
+ your npub: npub1ab…z89 + 1/1 relay +
+
+ +
+
+
+
bob
+
023bf8c1…9ad2
+
+
+
+
hey, did you register your name yet?11:38
+
just now — bob.x is live11:40
+
nice. send me the hermes.x link11:42
+
https://hermes.x/messenger11:43
+
great, send me the link11:44
+
+
+ + +
+
+
+
+
Non-interactive preview — live build pending (see roadmap below).
+ +
+ +
+

Two clients, one identity

+
+
+

Desktop (Theseus) live

+
    +
  • Full crypto in-process (NIP-17, nip44 v2)
    • +
  • Persistent inbox + read-state on disk
    • +
  • Address book (local JSON + vCard import)
    • +
  • Sidebar panel, Ctrl+Shift+E shortcut
    • +
  • Vault-bind: no re-typing the mnemonic
    • +
  • Reverse-resolve pk → on-chain name
    • +
+
+ Get Theseus +
+
+
+

Web (this page) building

+
    +
  • Same crypto, same identity (same wallet seed derivation)
    • +
  • BCH name resolution via public gateway
    • +
  • WebSocket to Nostr relays from the browser
    • +
  • IndexedDB inbox — survives tab close, scoped to this origin
    • +
  • No download, no install, no account
    • +
  • Mnemonic entry only — never stored in plaintext
    • +
+
+ Why Hermes +
+
+
+
+ +
+

Why wait for the web client

+

The web messenger isn't ready yet because of three things we + want to get right before shipping:

+
    +
  1. Key handling in a tab. + A wallet mnemonic is the most sensitive bit of data a user has. In + the desktop app it lives in main-process memory; in a tab it has to + survive page reloads without ever landing in plaintext anywhere. We're + wiring a WebCrypto-backed non-extractable key path with the vault PIN + as the gate.
    2. +
  2. Resolver gateway. + The desktop talks to a chipnet Fulcrum directly. A browser can't + — it needs an HTTPS gateway that answers np + / nr for a name. The gateway is live + (navigate.st/api/dns/alice.x) but the + client-side cache + signature-verification path still has an edge case + with lapsed names.
    3. +
  3. Relay persistence. + Desktop keeps a long-lived WebSocket to each relay. A tab doesn't, + because browsers throttle background sockets. The web client needs + offline queueing and a well-defined "catch-up" fetch on return — + otherwise you re-open the tab and the inbox feels empty.
    4. +
+

Until the three are solid, install Theseus for the real thing. + The web client will land here when the above are green.

+
+ Get Theseus + Brand kit +
+
+ +
+ + + + +