Skip to the collection

Style sheet · 4 references

Lunarpunk / Stealth Cryptographic

Bioluminescent mushroom cyan on midnight obsidian, zero-knowledge proof status badges, end-to-end privacy, and quiet dark mode.

Copy CSS :root tokens

Synthesized CSS custom properties derived from this family's dominant surface polarity, highest-contrast WCAG pair, and open-source font stand-ins.

/* Synthesized from Trova family: Lunarpunk / Stealth Cryptographic (lunarpunk-stealth-crypto) */
/* Evidence base: 4 curated reference(s) · Primary contrast 17.7:1 */
:root {
  /* Surface & Polarity (Daylight-paper dominant) */
  --surface-ground: #f3f4f6;
  --surface-elevated: #151922;
  --text-primary: #0b0d12;
  --accent-primary: #171326;
  --border-hairline: color-mix(in srgb, #0b0d12 16%, transparent);

  /* Typography (Loadable open-source stack mapped from observed specimens) */
  --font-display: "Inter", system-ui, sans-serif;
  --font-body: "JetBrains Mono", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Structural Geometry */
  --radius-surface: 0px;
  --measure-body: 62ch;
}
Copy as DESIGN.md

The whole sheet as Markdown, every move cited to the reference it came from. Paste it into your DESIGN.md as a starting system.

# Lunarpunk / Stealth Cryptographic — style sheet

> Bioluminescent mushroom cyan on midnight obsidian, zero-knowledge proof status badges, end-to-end privacy, and quiet dark mode.

Derived from 4 curated reference(s) in the `lunarpunk-stealth-crypto` family. Counts are how many references use a value, so a value used once is a lead, not a rule. Paste this into DESIGN.md as a starting system, then verify against the images.

## Type

- Inter — 2/4
- JetBrains Mono — 2/4
- IBM Plex Mono — 1/4
- IBM Plex Sans — 1/4
- Open Sans — 1/4
- Source Code Pro — 1/4

## Color

- `#f3f4f6` light neutral — 4/4
- `#0b0d12` dark neutral — 3/4
- `#171326` dark neutral — 1/4
- `#151922` dark neutral — 1/4
- `#112031` dark neutral — 1/4
- `#192e45` dark neutral — 1/4
- `#6d4aff` chromatic — 1/4
- `#71717a` mid neutral — 1/4
- `#3b82f6` chromatic — 1/4
- `#44ad4d` chromatic — 1/4

Readable pairs from these swatches, most-used first (WCAG AA body text needs 4.5:1):
- `#0b0d12` / `#f3f4f6` — 17.7:1
- `#171326` / `#f3f4f6` — 16.5:1
- `#151922` / `#f3f4f6` — 16:1
- `#112031` / `#f3f4f6` — 15:1

## Moves

### component pattern

- Pair the numeric fingerprint grid with a high-contrast scannable QR code on an obsidian `#0b0d12` ground that flips directly to a verified emerald checkmark badge upon camera match. — 194-signal-messenger-zero-knowledge-cryptographic-verification-safety-number-grid
- Eliminate email and password signup fields completely: clicking 'Generate account number' mints a 16-digit grouped token (`4419 8820 1104 9932`) with a one-click copy button and flat €5/mo rate regardless of term length. — 195-mullvad-vpn-anonymous-account-number-generator-zero-telemetry-spec-sheet
- Email alias generation ('Hide-my-email') runs inline inside the credential creation drawer with a live forwarding-route diagram (`alias@passmail.net → inbox`). — 196-proton-pass-end-to-end-encrypted-vault-inspector-obsidian-argon2id-status

### typography

- Format 60-digit peer-to-peer cryptographic fingerprints into a scannable 3×4 matrix of 5-digit `tabular-nums` monospace blocks with generous `16px` column and `12px` row spacing so human visual comparison never loses its place. — 194-signal-messenger-zero-knowledge-cryptographic-verification-safety-number-grid
- Technical whitepaper citations sit in a persistent monospace right rail so cryptographic claims link directly to audited circuit proofs. — 197-electric-coin-co-zcash-zero-knowledge-shielded-transaction-pool-visualizer

### copywriting

- State anti-marketing truths directly beneath the pricing token ('We even accept cash in an envelope; no recurring dark patterns'). — 195-mullvad-vpn-anonymous-account-number-generator-zero-telemetry-spec-sheet

### color

- Syntax-highlight generated passwords inside the vault inspector by coloring uppercase/lowercase letters in `#f5f3ff`, numerals in `#6d4aff` violet, and symbols in `#22c55e` emerald. — 196-proton-pass-end-to-end-encrypted-vault-inspector-obsidian-argon2id-status

### grid/layout

- Contrast transparent public ledger rows (rendered in exposed `#71717a` plaintext) against the zero-knowledge Orchard shielded pool (rendered as redacted `#f4b728` cryptographic commitment hashes). — 197-electric-coin-co-zcash-zero-knowledge-shielded-transaction-pool-visualizer

## References

- 194-signal-messenger-zero-knowledge-cryptographic-verification-safety-number-grid — Signal Messenger — Zero-Knowledge Cryptographic Verification & Safety Number Grid (exemplar)
- 195-mullvad-vpn-anonymous-account-number-generator-zero-telemetry-spec-sheet — Mullvad VPN — Anonymous Account Number Generator & Zero-Telemetry Spec Sheet
- 196-proton-pass-end-to-end-encrypted-vault-inspector-obsidian-argon2id-status — Proton Pass — End-to-End Encrypted Vault Inspector & Obsidian Argon2id Status
- 197-electric-coin-co-zcash-zero-knowledge-shielded-transaction-pool-visualizer — Electric Coin Co / Zcash — Zero-Knowledge Shielded Transaction Pool Visualizer

Type

Color

Pairs that read

  • Steal this.#0b0d12 on #f3f4f6 · 17.7:1
  • Steal this.#171326 on #f3f4f6 · 16.5:1
  • Steal this.#151922 on #f3f4f6 · 16:1
  • Steal this.#112031 on #f3f4f6 · 15:1

Moves

component pattern

typography

copywriting

color

grid/layout

References