Design System

Brand Guidelines & Visual Identity

A Gateway to Legacy

Version 1.0 | 2026

Logo

Trijem33 Logo - Primary

Primary Logo

Full logo with icon and text

Trijem33 Icon

Icon Only

Standalone architectural icon

Text Logo

Text only without icon

Logo Usage Guidelines

Clear Space Maintain minimum clear space equal to the height of the "3" around all sides of the logo.

Minimum Size Do not scale the logo smaller than 80px wide to ensure legibility.

Color Integrity Never alter the logo colors. Use only the provided primary version.

Placement Position the logo prominently, typically in the header or top-left of materials.

Color Philosophy

A timeless, architectural palette that balances strength and refinement.

Rooted in natural materials, elevated with gold. This palette is designed to meet WCAG AA contrast standards for text and UI components.

Primary Palette

#E9E4DB

Stone

Warm, timeless, foundational

#1A1A1A

Charcoal

Strength, sophistication, contrast

#C8A063

Gold

Luxury, warmth, achievement

Neutral Palette

White

#FFFFFF

Alabaster

#F7F5F2

Pearl

#F0EDE6

Sand

#D6CEC0

Taupe

#B8B1A4

Slate

#4B4B4B

Ink

#0D0D0D

LIGHT
DARK

Accent Palette

Sophisticated accents for highlights, interactive states, and subtle differentiation.

Bronze

#8A6A3A

Aged Gold

#D2B67A

Sage

#7C8271

Deep Navy

#111C2E

Terracotta

#B46A4A

Background Palette (Usage)

DARK BG

#1A1A1A

ELEVATED BG

#F7F5F2

SURFACE BG

#FFFFFF

SUBTLE BG

#F0EDE6

Gradients (Usage)

Gold Gradient

#E0C27F → #B98B48

Stone Gradient

#F7F5F2 → #E4DED3

Text Hierarchy

Text Hierarchy (On Light)

H1 Heading

Montserrat / Light | #1A1A1A

Body Text Example

Montserrat / Regular | #4B4B4B

Link Example

#C8A063

Text Hierarchy (On Dark)

H1 Heading

Montserrat / Light | #FFFFFF

Body Text Example

Montserrat / Regular | #D6D6D6

Link Example

#C8A063

Typography Scale

Download Montserrat
Style Font Weight Size Line Height Letter Spacing
H1MontserratLight (300)48px1.20
H2MontserratLight (300)36px1.20
H3MontserratRegular (400)24px1.30
H4MontserratMedium (500)18px1.40
BodyMontserratRegular (400)14px1.60
CaptionMontserratRegular (400)12px1.50.02em
LabelMontserratSemibold (600)10px1.40.15em
TaglineMontserratLight (300)12px1.50.25em

Spacing Scale

Based on an 8px grid system for consistent spacing throughout the interface.

4px

8px

12px

16px

24px

32px

48px

64px

Border Radius

None

0px

SM

4px

MD

6px

LG

8px

XL

12px

Full

9999px

Box Shadows

SM

MD

LG

XL

Button Components

Card Components

Standard Card

White background with sand border for elevated content.

Subtle Card

Stone background for secondary or grouped content.

Dark Card

Charcoal background for high contrast sections.

Usage Notes

🏛️

Global Use

Neutrals for backgrounds, surfaces, and text.

Accents

Use gold and bronze for CTAs, highlights, and key interactions.

📐

Depth & Layers

Use slate and taupe for dividers, borders, and secondary elements.

🎯

Brand Impact

Charcoal and gold create premium contrast and visual authority.

Accessibility

This palette meets WCAG AA contrast standards for text and UI.