DUX PRANA MONOLITH

Design System V4.0 // Living Design Document

1. Core Brand Identity

Creative North Star: "The Architectural Monolith"

Aesthetic: Clean, Technical, Authoritative, Timeless.

2. Design Tokens (Root Variables)

Color Palette

Background Primary
var(--color-bg-primary) / #FAFAFA
Text Primary
var(--color-text-primary) / #111111
Brand Sepia
var(--color-brand-sepia) / #9B7653
Brand Light
var(--color-brand-light) / #F4EBD8
Brand Tint
var(--color-brand-tint) / #F8E7DF

3. Component Specifications

We use Roboto for narrative/context (Headings, Body). We pair it with Roboto Mono for precision/data (KPIs, Tables, UI Links, Buttons).

Heading 1 - Strategic Vision

Heading 2 - Implementation Phase

Heading 3 - Core Objectives

This is standard body copy. It is designed to be highly readable, scaling beautifully across devices. Dux Prana values clear communication, and our typography reflects that commitment. This is what a link looks like.

Callout Box

Strategic Insight: Highlights for metrics and key takeaways use the Sepia Light background with a Sepia Core border to naturally draw authoritative attention, respecting the Roboto narrative rule.

Interactive Elements (Buttons)

Buttons execute actions. Primary CTAs are ALWAYS Dux Black. Buttons respect strict radius (4px), uppercase transforms, and Mono typography.

Information Architecture (Cards)

Cards group data into architectural monoliths with standard soft radiuses (8px) and subtle shadowing.

Standard Data Card

Ideal for listing services, team members, or standard data points. Clean borders and white backgrounds form the structural base.

Highlight Card

Utilize the sepia background to draw the user's eye to premium offerings, critical alerts, or highlighted strategic insights.

4. Design Rules (Enforcement Check)

  1. Use Roboto for narrative/context (Headings, Body).
  2. Use Roboto Mono for precision/data (KPIs, Tables, UI Links, Buttons).
  3. Primary CTAs are ALWAYS Dux Black (mapped to Text Primary).
  4. Highlights for metrics use Sepia Light background.