Brand Guide | Get Your Site Together

01 / Logo

Logo Variants

Primary /logo.svg

Outlined /logo-outlined.svg

Transparent /logo-transparent.svg

Favicon /favicon.svg

A diagonal lightning-bolt G inside a sharp-cornered square
Background: Sovereign Red #c8102e, Letter: Star White #ffffff
Web size: 40 × 40px (scale proportionally for print)

02 / Color

Color Palette

Primary

Sovereign Red

#c8102e

RGB(200, 16, 46)

Primary CTAs, hero accents, danger

Command Blue

#002f6c

RGB(0, 47, 108)

Headers, nav bar, section backgrounds

Glory Gold

#ffd700

RGB(255, 215, 0)

Highlights, badges, hover states

Supporting

Deep Navy

#001a3a

RGB(0, 26, 58)

Body text on light, darkest tone

Bright Red

#e63946

RGB(230, 57, 70)

Hover/active state for Sovereign Red

Pale Gold

#fff4b8

RGB(255, 244, 184)

Soft badge backgrounds, highlights

Ice Blue

#cce0f5

RGB(204, 224, 245)

Soft card tints, info panels

Neutrals

Star White

#ffffff

RGB(255, 255, 255)

Page background, card surfaces

Off White

#f5f5f5

RGB(245, 245, 245)

Alternate section background

Smoke

#e0e0e0

RGB(224, 224, 224)

Borders, dividers

Charcoal

#2b2b2b

RGB(43, 43, 43)

Body text on dark backgrounds

03 / Typography

Type Scale

Space Grotesk

Headings & Display

"Space Grotesk", ui-sans-serif, system-ui, sans-serif

Inter

Body Text

"Inter", ui-sans-serif, system-ui, sans-serif

Hit Different

Hero Title
96px / 6rem
weight: 700
spacing: -0.04em

We build sites that hit different.

Hero Subtitle
28px / 1.75rem
weight: 400
spacing: 0.02em

Bold Heading

Section Heading
48px / 3rem
weight: 700
spacing: -0.03em

Card Title Example

Card Title
20px / 1.25rem
weight: 700
spacing: normal

Body text looks like this. Clean, readable, and generous line height.

Body
18px / 1.125rem
weight: 400
spacing: normal

LABEL TEXT

Label / Kicker
12px / 0.75rem
weight: 700
spacing: 0.16em

GET YOUR SITE TOGETHER

Brand Wordmark
14px / 0.875rem
weight: 700
spacing: 0.14em

Headings: Deep Navy #001a3a or Star White on dark, tight tracking, bold
Body: Charcoal #2b2b2b on light, Star White on dark, line height 1.70
Labels / kickers: ALL CAPS, wide letter-spacing (0.14-0.16em), Glory Gold on dark sections

04 / Components

Button Styles

Primary

Get Started

Main CTAs

Secondary

Learn More

Supporting actions

Accent

Highlight

Highlights, alerts

Ghost

View Work

On dark backgrounds

Sharp corners (0px radius), 52px min height
Font weight 700, ALL CAPS, 0.08em letter spacing
2px solid border matching background color

05 / Tokens

Spacing, Corners & Shadows

Corner Radius

Radius SM

0px

Buttons, badges

Radius MD

4px

Cards, inputs

Radius LG

8px

Panels, modals

Shadows

Shadow SM

0 4px 12px rgba(0,26,58,0.08)

Cards, buttons

Shadow LG

0 12px 40px rgba(0,26,58,0.18)

Hero cards

Borders & Lines

Line (Subtle)

rgba(0, 26, 58, 0.10)

Line Strong

rgba(0, 26, 58, 0.22)

Gold Rule

2px solid #ffd700

06 / Visual Style

Visual Language

Bold, graphic, high-contrast. Minimal white space — fill with color.

Large color-blocked sections: Command Blue, Sovereign Red, Star White.

Glory Gold accents as horizontal rules, underlines, and highlight bars.

Diagonal stripe motifs (45°) for hero backgrounds and section transitions.

Hard geometric shapes — no soft gradients, no glassmorphism.

Full-bleed photography with dark overlays and bold text on top.

07 / Guidelines

Do's and Don'ts

Use one dominant color per section, with a second as accent

Keep text high-contrast (white on dark, navy on light)

Use gold sparingly — it's the exclamation point

Don't

Mix all three primaries in equal proportion (it looks like a flag)

Use light colors on light backgrounds

Round corners excessively — this brand is sharp

Use gradients between the primary colors