> BRAND_SYSTEM

Brand Guidelines

The visual and verbal identity of LocalGhost. Use this to build with us, not against us.

> CONTENTS
> SECTION_01

Core Identity

Cypherpunk Terminal Brutalism. The visual language is a deliberate throwback to early computing—CRT monitors, green phosphor terminals, and the hacker aesthetic of the 1990s—executed with modern restraint.

This isn't retro for nostalgia. It's retro as ideological statement. The aesthetic says: we remember when computers were tools, not cages.

The Positioning

LocalGhost inverts the modern cloud paradigm. We move everything—AI, data, digital identity—from their servers to yours. A private server where nobody can see you. Where nobody even knows you exist.

> THE CORE PROMISE

[1]
Privacy through architecture, not promises. We can't see your data because the system prevents it.
[2]
Ownership through atoms, not accounts. You own hardware. Hardware doesn't have terms of service.
[3]
Sovereignty through code, not trust. Verify, don't believe.
> SECTION_03

Color Palette

A deliberately limited palette. Black, green, grey, red. No gradients. No pastels. The constraint is the point.

Aa
The Void
#111111
Primary background. Near-black with residual CRT glow.
Aa
Void Lighter
#1a1a1a
Secondary backgrounds, cards, code blocks.
Aa
Terminal Green
#33FF00
Primary accent. Links, emphasis, success states, "our" values.
Aa
Terminal Dim
#1a8000
Muted green for borders, shadows, glow effects.
Aa
Text
#E0E0E0
Primary text. Slightly warm white, readable but not harsh.
Aa
Text Dim
#808080
Secondary text, metadata, comments, placeholders.
Aa
Border
#333333
Dividers, borders, structural lines.
Aa
Warning
#FF3333
Danger, errors, "their" way, what we reject. Use sparingly.

Usage Rules

Terminal Green is sacred. It represents LocalGhost values, user sovereignty, and correct paths. Warning Red is reserved for highlighting what we reject—surveillance, rent-seeking, enshittification. Don't dilute either.

> SECTION_04

Typography

PRIMARY TYPEFACE
JetBrains Mono

The modern programmer's typeface. Clean, legible, unapologetically technical. Used for all headings, navigation, code, and UI elements.

Light 300
Sovereignty
Regular 400
Sovereignty
Medium 500
Sovereignty
Bold 700
Sovereignty
SECONDARY TYPEFACE
System Stack

-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif. Used for body copy where readability matters more than aesthetic.

Type Rules

No serif fonts. Ever. Serifs are for institutions that want to look trustworthy. We prove trust through architecture.

Section headers use the format > SECTION_XX with terminal green color and 0.2em letter-spacing.

> SECTION_05

Visual Effects

Subtle texture and animation that evokes CRT monitors without being distracting. The effects are subliminal—you feel them more than see them.

SCANLINES
> GLOW
PHOSPHOR GLOW
CRT FLICKER
1px solid
SHARP BORDERS

Effect Specifications

Scanlines: Repeating linear gradient, 2px transparent / 2px rgba(0,0,0,0.1). Applied as fixed overlay across entire viewport.

Terminal Glow: Box-shadow and text-shadow on green elements. text-shadow: 0 0 5px var(--terminal-dim)

Flicker: Randomized, slow animation (6s+ duration). Subtle opacity changes. Not annoying—just enough to feel alive.

Borders: Always 1px. Sharp corners (0 or 4px max border-radius for code blocks). No drop shadows. No blur effects on cards.

> SECTION_06

Components

BUTTONS
TERMINAL PROMPT
> ghost@localghost: ~
SECTION HEADERS
> SECTION_01
Section Title Here

Component Rules

Buttons: Square brackets in label text. 1px border. No background until hover. Ghost variant uses terminal green.

Cards: 1px border, no border-radius. Cards are cells—they feel like terminal panes, not material design cards.

Terminal chrome: The dot-buttons (red/yellow/green) are interactive easter eggs, not decoration. Close triggers Matrix rain. Maximize expands terminal.

> SECTION_07

Symbolic Motifs

Recurring symbols that carry meaning throughout the brand. These aren't decorative—they're semantic.

>
The Terminal Prompt
Appears everywhere: section headers, navigation, lists. The universal symbol of "your turn to act." It's an invitation, not a command.
▪
The Black Box
Matte, silent, sovereign. The anti-smart-device. No lights, no logos—just presence. The physical embodiment of privacy.
☁
The Mist
The P2P backup network. Decentralized, ephemeral, impossible to grasp. Your data scattered across strangers' drives, encrypted and sharded.
⚿
Hardware Keys
Physical tokens. Tangible ownership. Two keys, two locations. If you lose both, you're gone—and that's the point. Sovereignty means responsibility.
👻
Daemons
Not "agents" or "assistants." Daemons—background processes that serve without surveillance. The Scribe, The Observer, The Shadow.
> SECTION_08

Voice & Tone

Direct. Technical. Defiant. The copy doesn't explain—it declares. It assumes intelligence. It treats the reader as a peer, not a prospect.

Key Rhetorical Moves

Manifestos over marketing. We don't pitch benefits; we state principles.

"We" vs "They." Clear adversarial framing. Big Tech is the antagonist. The user is the protagonist. LocalGhost is the weapon.

Code as proof. Every claim is backed by architecture, not policy. "Code, not promises."

Dark humor. "At least this 404 doesn't require a subscription." Gallows wit that acknowledges the absurdity of the status quo.

Signature Phrases

The only cloud is you.
We have designed ourselves out of the loop.
Atoms don't have terms of service.
The architecture is the legal defense.
Do not lend your mind to the dying machine.
The exit is open.
Privacy through code, not promises.

Voice Comparison

[✓] DO
"We cannot sell your data because we do not have it."
[✗] DON'T
"We're committed to protecting your privacy."
[✓] DO
"If we go bankrupt tomorrow, your box keeps working."
[✗] DON'T
"We're excited to announce our new feature!"
[✓] DO
"Sovereignty means responsibility. Two keys. Two locations. No excuses."
[✗] DON'T
"Please consider backing up your keys for safety."
[✓] DO
"The math doesn't care about your feelings."
[✗] DON'T
"We understand this might seem complicated..."

What We Never Sound Like

Corporate: "We're excited to announce..." / "Best-in-class solutions..."
Apologetic: "We understand this might seem..." / "We're sorry but..."
Vague: "Industry-leading" / "Seamless experience" / "Synergy"
Pleading: "Please consider..." / "We'd love if you..."

> SECTION_09

Design Principles

> INTERACTION PHILOSOPHY

[1]
Easter eggs over empty polish. Every interaction rewards curiosity. The terminal is interactive. The snake game teaches data consumption. Buttons do unexpected things.
[2]
No dark patterns. The waitlist modal doesn't collect email. The donate modal shows a raw ETH address. We don't trick. We don't manipulate.
[3]
Friction as feature. We don't auto-play. We don't pop up. We don't interrupt. If you want to engage, you engage. The box waits for you.
[4]
Respect for the reader. No hand-holding. No FAQs that start with "What is a computer?" You're technical, you're skeptical, and you've been burned before.

Emotional Register

Controlled anger. The copy is political but not preachy. Angry at systems, not people. Channels frustration into action.

Quiet confidence. We don't beg. We don't compare ourselves to competitors. We state what we've built and let the architecture speak.

Dark humor. The gallows wit of people who've seen the machine and chosen to build the exit. Never cruel, always knowing.

Spacing & Layout

xs
0.5rem
sm
1rem
md
1.5rem
lg
2rem
xl
3rem
section
4rem

Grid: Components align to an implicit grid. Dense but not cluttered. Max content width: 900px for text, 1200px for full layouts.

Line height: 1.7-1.8 for body text. Generous but not loose.

> SECTION_10

CSS Utilities

Drop-in CSS utilities for building interfaces with the LocalGhost aesthetic. Includes design tokens as CSS custom properties, utility classes, and pre-built components.

> LOCALGHOST-UTILITIES.CSS

Design tokens, utility classes, and component styles. 8KB minified.

[ DOWNLOAD .CSS ]

Usage

INCLUDE THE STYLESHEET
<link rel="stylesheet" href="localghost-utilities.css">

Design Tokens (CSS Custom Properties)

/* Colors */
--lg-void: #111111;
--lg-terminal: #33FF00;
--lg-text: #E0E0E0;
--lg-text-dim: #808080;
--lg-border: #333333;
--lg-warning: #FF3333;
/* Typography */
--lg-font-mono: 'JetBrains Mono', monospace;
--lg-font-system: -apple-system, sans-serif;
/* Spacing */
--lg-space-sm: 0.5rem;
--lg-space-md: 1rem;
--lg-space-lg: 1.5rem;
--lg-space-xl: 2rem;

Utility Classes

TYPOGRAPHY
.lg-mono .lg-text-sm .lg-text-lg .lg-font-bold .lg-tracking-wide .lg-prompt
COLORS
.lg-color-terminal .lg-color-dim .lg-bg-void .lg-bg-void-lighter
SPACING
.lg-p-md .lg-px-lg .lg-mb-xl .lg-gap-md
EFFECTS
.lg-glow .lg-cursor .lg-flicker .lg-scanlines

Components

BUTTONS
CARDS
.lg-card .lg-card-terminal .lg-terminal-box
OTHER
.lg-link .lg-badge .lg-code .lg-divider .lg-list .lg-section-label

Example

<!-- Terminal-style card with button --> <div class="lg-card-terminal lg-p-lg"> <p class="lg-section-label">SYSTEM_STATUS</p> <h2 class="lg-mono lg-text-lg lg-glow">All Systems Operational</h2> <button class="lg-btn-terminal lg-mt-md">[ VIEW LOGS ]</button> </div>
[ ← RETURN TO THE ESCAPE PATH ]