### Color Tokens

A restrained set of warm greys, off-black, and muted neutrals, with orange as the only accent.

#### Primary Scheme

#F9F9F7

Off-white

--card

#161614

Off-black

--foreground

#D95E2A

Orange

--primary

#### Grey Scale

#F0F0EC

Grey 1 (5%)

#DDDDD7

Grey 2 (10%)

#C4C4BD

Grey 3 (20%)

#A6A69F

Grey 4 (50%)

#7F7F79

Grey 5 (60%)

#575753

Grey 7 (70%)

#2F2F2C

Grey 8 (80%)

#### Semantic Tokens

Background

bg-background

Foreground

bg-foreground

Card

bg-card

Muted

bg-muted

Secondary

bg-secondary

Primary

bg-primary

Accent

bg-accent

Border

bg-border

### Typography

Source Serif Pro for explanation and human-readable detail. Aspekta (displayed as Inter) for structure, navigation, and UI.

Primary

#### Source Serif Pro — Reading & Explanation

Display / H1

Local-first AI systems shaped by real work

Heading / H2

Built where work happens. Contained end to end.

Heading / H3

Systems run inside the perimeter. Nothing leaks.

Body

Real work is messy, distributed, and embedded in internal systems. Cloud AI often cannot operate there. Useful AI runs inside the environment and supports human decision-making — not abstract it away. We sit with the operators, map the steps, and build a system that mirrors what actually happens.

Small / Caption

Powered by Monadical's internal, open-source stack hardened over eight years.

Secondary

#### Aspekta — UI, Navigation & Labels

Navigation

Overview Documentation Support Contact

Button Text

Get Started Learn More View All

Labels & Form Elements

Email Address Optional Required field

Status & Metadata

Active Pending Last updated: 2 hours ago

Serif Stack

'Source Serif Pro', 'Source Serif 4', Georgia, serif

Sans Stack

'Aspekta', ui-sans-serif, system-ui, sans-serif

### Component Library

Interactive elements with consistent styling across all states: default, hover, active, disabled.

#### Buttons — Variants

Primary

Secondary

Outline

Ghost

Link

Destructive

#### Buttons — Sizes

Small

Default

Large

#### Buttons — States

Primary

Outline

Destructive

#### Icon Buttons

Variants

Sizes

Disabled

#### Buttons with Icons

Leading Icon

Trailing Icon

Sizes with Icons

#### Badges — Core Variants

Default Secondary Muted Outline

#### Badges — Tag & Value

Tag Category 42 $1,234 100%

#### Badges — Semantic

Success Warning Danger Info

#### Badges — Channel Pills

WhatsApp Email Telegram Zulip Platform

#### Badges — On Muted Surface

Default Secondary Outline Tag Success Info

#### Inputs

Default

With Value

Disabled

Textarea

#### Select

Default

With Value

Disabled

#### Checkboxes & Switches

Checkboxes

Unchecked
Checked
Disabled

Switches

Off
On
Disabled

#### Tabs

Overview content. This tab demonstrates the default active state.

#### Toggle Group

Single, outline

Single, default

Multiple

Small

Default

Large

#### Tooltips

### Real-World Examples

Complete UI patterns demonstrating how components work together in production.

#### Consultation Request Form

Request a Consultation
Tell us about your operational requirements. We'll assess whether a contained AI system can help.
Full Name
Work Email

We'll use this to schedule a call.

Organization
Industry
Project Description

Be specific about constraints: data sensitivity, existing systems, compliance requirements.

I understand that Greyhaven builds custom systems. Initial consultations focus on technical feasibility.

#### System Settings

System Configuration
Configure your contained AI deployment. All settings remain within your environment.
System Notifications

Receive alerts for system events and anomalies

Audit Logging

Record all system actions for compliance

Extended Retention

Keep processed data beyond 30 days

Security Profile

Isolation and access control level