Titan
Titan is Invoca’s design system. It exists so that a person or an agent building an Invoca screen can make the right decision without asking anyone.How this documentation is organized
Four tiers, resolved from the top down. When you are building something new, start at View and work inward — the page-level decision constrains everything below it.Foundations
Design tokens: color, type, space, elevation, motion. What everything else is built from.
Components
Units that ship as exports from the Titan package, with a props API.
Patterns
Named compositions of two or more components. Rules, but no export.
Views
Full-page archetypes. Which regions exist, and what fills each one.
How to read a page
Every page carries three layers, and it helps to know which one you are reading.Constraints have IDs
Normative rules are numbered —TITAN-BTN-01, TITAN-COLOR-03. The IDs are permanent
and citable. Use them in design review and in pull requests: “this conflicts with
TITAN-BTN-01” is a shorter and less personal conversation than describing the rule again.
Start here
For designers
The Figma library, how it relates to code, and what to do when they disagree.
For engineers
Install, theming, tokens in code, and contributing back.
For agents
How to consume this documentation programmatically.