System map · v3.1 · 2026-09

The whole design system, in one map.

From brand decisions and visual foundations to components, applications, and release governance, this is the complete path through the Omninal Design System. Start with the task at hand, then enter the existing 00–09 chapters.

Every existing 00–09 chapter, URL, download path, and reading order remains intact. The sitemap adds clearer grouping and navigation without rewriting the original structure.

Existing chapters: 10; The 00–09 structure and URLs stay unchanged
DTCG tokens: 131; Primitive, semantic, and component layers
React components: 13; States, content, accessibility, and Storybook
Platform outputs: 5; Web, Figma, SwiftUI, Compose, Android XML

Information architecture

Four layers, from judgment to delivery.

Each chapter keeps its own responsibility; the groups only make the standards easier to find. The header, mobile navigation, footer, and this page share the same structure source.

Foundations

Brand core, identity, color, typography, and graphic language: establish the judgment and visual grammar first.

Components & tokens

DTCG tokens, production components, interaction states, accessibility behavior, and platform outputs.

06UI Kit & Coverageshadcn × Omninal design tokens, component coverage, states, and implementation guidance.

Applications & guidance

Apply the system to real touchpoints, then align writing, governance, and maintenance.

Resources & downloads

Get logo assets, tokens, multiplatform outputs, theme files, and the brand book.

09ResourcesLogo packs, color resources, UI kit tokens, and brand book downloads.

Start by task

You do not need to read the whole manual first.

The sitemap is a working entry point that connects design judgment, implementation, and release — not decorative table-of-contents furniture.

Make a brand decision

Align positioning, pillars, identity, color, and type before visual exploration begins.

Start with Brand Core

Design and build an interface

Begin with semantic tokens and existing components, then verify states, content, accessibility, and platform boundaries.

Inspect the UI kit

Release and maintain the system

Download the correct outputs and record version, migration impact, ownership, and deprecation under the governance rules.

Open governance

Platform coverage

One source, platform-native behavior.

The foundation now connects token output and naming across platforms. Native components are still labeled by actual completion: token ready is not presented as component ready.

Figma Variables alignedCollections, light/dark modes, and code names map to one another.
Web Production ready13 React primitives, themes, Storybook, and automated checks.
iOS Token readySwift and SwiftUI outputs ship in the multiplatform download; components follow the roadmap.
Android Token readyKotlin Compose and Android XML outputs generate today; components follow the roadmap.
Content & accessibility Fixtures activeChinese, English, Korean, RTL, keyboard, long copy, and 200% text fixtures are in place.

The whole design system, in one map.

Every existing 00–09 chapter, URL, download path, and reading order remains intact. The sitemap adds clearer grouping and navigation without rewriting the original structure.