One language.
Every surface.
A living visual system for Itunda — shared tokens, typography, color, spacing, components, motion and accessibility across web, Android and iOS.
The primitives
everything shares.
These are the actual values exposed by the Itunda Design System. Products consume semantic roles instead of inventing one-off styles.
Color roles
Itunda keeps its identity in indigo while semantic roles make the system reusable and accessible.
#7472F4
#625FE0
#F0EFFF
#191F28
#6B7684
Token model
Semantic tokens sit above raw identity values so components can stay consistent across surfaces.
--itunda-color-text
--itunda-color-surface
--itunda-color-border
--itunda-motion-normal
--itunda-radius-lg
Typography
Large, confident display type for product storytelling; compact body type for dense financial and service information.
and everyday life.
Spacing
A compact 4px-based rhythm scales from controls to large editorial sections.
See the system
in motion.
Real IDS classes are used below — buttons, inputs, tabs, lists, cards, states and status language.
Actions
Clear primary action, quiet secondary action, and deliberate press feedback.
Form control
Focused states use the same brand ring and surface language.
List & hierarchy
Dense information stays calm through spacing, metadata and value alignment.
Tabs & feedback
System state is explicit without visual noise.
Designed once.
Built everywhere.
The standalone IDS is structured around shared tokens with platform implementations for Web CSS, Jetpack Compose and SwiftUI.
A living system,
not a poster.
Changes to the tokens and components can flow back into the products. The page is a visual reference for the code, not a separate design truth.