Skip to content

Design System

AI systems act. Invisibly.Built to make AI action legible.Nodus

Built for the interfaces nobody else is designing — AI-native products, agentic treasury, human-machine handoff. Where agent output and human judgment share the same visual language.

v1.1New: Governance model · Voice primitives · Runtime theming

41
AI Patterns
111
Finance
73
UI Primitives
8
Foundation

Semantic color system

Three colors. Three meanings. No exceptions.

AgencyRed

Authority, action, AI acting. Red means something is happening — an agent is taking an action, a user is exercising control.

TemporalBlue

Processing, information, time. Blue is computation in flight — data loading, inference running, a clock ticking.

ValidationGold

Enrichment, caution, confirmation. Gold marks moments that need attention — a threshold crossed, a value confirmed.

Token demonstration

Color that means something.

NODUS · SEMANTIC SIGNAL TRACE
LIVE
Agency
Temporal
Validation

Where to start

Pick your path.

New here? Each path takes you from zero to productive in under five minutes. Pick the one that matches what you're building.

Building an AI product

  1. 01Getting Started
  2. 02AI Patterns
  3. 03Principles

Building a finance tool

  1. 01Finance Catalog
  2. 02Guides
  3. 03Roadmap

Designer joining the system

  1. 01Philosophy
  2. 02Tokens
  3. 03Guides

Auditing coverage or compliance

  1. 01Accessibility
  2. 02Heuristics
  3. 03Roadmap

Architecture

Four layers that compose.

Every component lives at exactly one layer. Patterns consume primitives. Finance components share primitive tokens. Foundation governs all. Nothing leaks between layers.

Read bottom-up: Foundation supports everything above it.

04
AI Patterns41 patterns

Purpose-built interaction patterns for agent interfaces: agency gates, tool call chains, consent ceremonies, audit trails.

Agency & ControlTool ExecutionConversationTrust & Provenance
03
Finance Components111 components

Domain-specific UI for treasury: FX, payments, risk, compliance, recon, portfolio. The densest, most data-intensive layer.

Cash & LiquidityFX & HedgingPaymentsRisk Analytics
02
UI Primitives73 components

Universal interface building blocks: forms, tables, overlays, navigation, feedback, typography. Composable and token-governed.

ActionsData EntryData DisplayOverlaysNavigation
01
Foundation8 sections

The design language. Tokens, motion, typography, color, principles, heuristics, accessibility. Everything else inherits from here.

TokensMotionTypographyPrinciplesAccessibility

Component showcase

Composable. Dense. Precise.

Actions

Status indicators

ActivePendingActionWarning

7 outcome tokens · positive, caution, negative
3 semantic signals · agency, temporal, validation

Finance data table — 32px compact density

IDInstrumentNotionalCCYStatus
FX-0142USD/EUR Forward2,400,000USDActive
FX-0138GBP/JPY Spot850,000GBPPending
FX-0131EUR/CHF Option1,200,000EURAction

Why Nodus

No other DS has
a language for AI.

Most design systems were built for humans filling forms. Nodus is built for humans working alongside agents — where trust, legibility, and sovereignty are interface requirements, not afterthoughts.

01

Agent-first primitives.

41 patterns purpose-built for AI interaction: agency levels, tool call chains, provenance visualization, ceremony gates. Not adapted from form builders. Built for agents.

02

Semantic color discipline.

Three colors mapped to three meanings. Red is agency. Blue is temporal. Gold is validation. Every component uses this vocabulary. No exceptions.

03

Finance depth.

111 domain-specific components covering treasury, FX, payments, risk, compliance, and recon. The finance layer no other design system has.

Read the full philosophy →

Built with Nodus DS

Templates ready to ship.

80+ end-to-end interface templates across treasury, AI agent workflows, and finance domains. Copy, configure, and deploy — fully token-governed and WCAG AA compliant.

Browse all 80+ templates →

Start building

What are you building?

Design principles

Legibility as
aesthetic program.

  1. 01Visibility Over Invisibility
  2. 02Ceremony Over Efficiency
  3. 03Auditability as Aesthetic
  4. 04Temporal Honesty
  5. 05Sovereignty as Feeling
  6. 06Agent Legibility
  7. 07Learning Acceleration
Explore all principles →

Awards & recognition

Built to be recognised.

Design SystemsPending

Best-in-class AI Design System

Recognition for semantic color discipline and agentic pattern depth. Nominated category.

Finance UXSubmitted

Treasury Interface Excellence

111-component finance layer spanning FX, risk, payments, and compliance. Submitted for review.

AccessibilityAchieved

WCAG AA Full Compliance

All 233 components meet contrast requirements. 10px font floor. Keyboard navigable.

Nodus Design System v1.1

Three token layers. 233 components. One way to build.

Governance model shipped. Voice, theming, and realtime collaboration live. 233 components, 41 agent patterns, 111 finance components.