Skip to content

LIVING DESIGN SYSTEM · 2026

Ex-Guard Brand Guide

One shared visual language across semi trucks, RVs, pickups and vans—built from the same global values the website uses.

01 · BRAND MARKS

Logo System

Use the supplied SVG marks without recoloring, stretching, outlining, or adding effects. Give the mark clear space equal to at least the height of the central X.

Ex-Guard primary mark

Primary mark

The single sitewide logo for every vehicle category, header, and footer.

logo-header.svg
DOKeep the mark clear and level.

Use generous space and strong surface contrast.

DON’TModify the artwork.

Do not skew, compress, recolor, shadow, or place on a busy image without a dark field.

02 · COLOR

Core Palette

Gold and black are the only brand colors. Warm white and neutral gray may support content, but interactive accents and branded surfaces stay strictly within this core palette.

Ex-Guard Gold

The single brand accent for actions, highlights, rules and purchase paths.

--exg-goldLive value

Deep Gold

Accessible accent text and interaction feedback on light surfaces.

--exg-gold-deepLive value

Protection Black

Primary brand foundation for navigation, headlines, panels and buttons.

--exg-blackLive value

Technical Charcoal

A softer black for layered dark surfaces and technical depth.

--exg-charcoalLive value

Warm Surface

Page backgrounds and section separation without a sterile gray cast.

--exg-warmLive value

White

Cards, content surfaces, reversed type, and breathing room.

--exg-whiteLive value

03 · TYPOGRAPHY

Two-Font System

Trade Gothic Next Condensed supplies the industrial voice. Barlow carries readable interface and body copy. Medium is the lightest body weight used anywhere on the site.

DISPLAY · 700 / 800

TRADE GOTHIC NEXT CONDENSED Headlines, product names, navigation, labels, and calls to action.

BODY · 500 / 600 / 700

Barlow Paragraphs, descriptions, forms, pricing details, and supporting information.
Hero display--exg-type-hero-size

PROTECT WHAT KEEPS YOU MOVING.

Section heading--exg-type-section-size

Built to Protect. Built to Last.

Card heading--exg-type-card-size

Vehicle-Specific Protection

Eyebrow / label--exg-type-eyebrow-size

ENGINEERED IN DES MOINES

Lead paragraph--exg-type-lede-size

Commercial-grade grille guards engineered around your vehicle and the work it does.

Body copy--exg-type-body-size

Every Ex-Guard is engineered to reduce front-end damage while preserving access, fitment, and everyday usability.

04 · MARKET EXPRESSION

One Brand. Four Vehicle Paths.

The underlying layout and typography stay consistent. Accent color and purchasing language make the commercial channel unmistakable.

SEMI TRUCKS + RVS

Protect uptime.

Semi trucks + recreational vehicles Purchased through authorized dealers Explore semi guards

PICKUPS + VANS

Protect your vehicle.

Pickup trucks + commercial vans Buy online or through a local upfitter Shop pickup guards

05 · COMPONENTS

Interface Examples

Actions are compact, direct, and high contrast. Form language stays practical. Decorative styling never competes with fitment, price, or purchasing information.

FORM CONTROLS

Use uppercase display labels and readable Barlow inside controls.

06 · MAINTENANCE

Change Once. Update Everywhere.

The system is intentionally split into a small global foundation and page-level presentation files. Change the foundation only when the entire site should move together.

COLORS, FONTS + SCALEassets/site-shell/brand-system.css

The global source for all brand tokens shown on this page.

PRIMARY LOGOSassets/site-shell/images/

Replace the three named SVG files while preserving their filenames and aspect ratios.

PAGE-SPECIFIC LAYOUTassets/content-pages/brand-guide.css

Changes only how this reference page presents the shared system.

Working rules

  • Use display type with purpose. Reserve condensed uppercase styling for short headlines, navigation, labels, and actions.
  • Never return to thin body type. Barlow 500 is the minimum weight for readable site copy.
  • Use only gold and black as brand colors. Neutral grays may support readability, but never introduce a competing accent hue.
  • Keep purchasing language explicit. Semi trucks and RVs route through dealers; pickups and vans can support direct purchase.