🏠 Overview › 🧩 Components ›🧩 Design Token Repository

Design Token Repository

Component Detail

Data Layer medium complexity Shared Component mobile
0
Dependencies
2
Dependents
0
Entities
0
Integrations

Description

Immutable Dart class that defines all WCAG 2.2 AA-compliant design tokens: color pairs guaranteed to meet contrast thresholds, typography scale (min 16sp body, scalable to 200%), spacing grid, border radii, and touch target floor sizes. Serves as the single source of truth consumed by Accessible Widget Library and Accessibility Audit Service to prevent any individual screen from accidentally violating WCAG thresholds.

Feature: WCAG 2.2 AA Compliance

design-token-repository

Responsibilities

  • Define foreground/background color pairs with pre-validated contrast ratios
  • Enforce minimum font sizes and line-height values aligned to WCAG typography requirements
  • Define minimum interactive element size constants (24x24 logical pixels)
  • Expose semantic color names (primary, onPrimary, surface, onSurface, error) with verified contrast
  • Provide focus indicator color tokens meeting 3:1 contrast against adjacent colors

Interfaces

AppColors.primary -> Color
AppColors.onPrimary -> Color
AppColors.surface -> Color
AppColors.onSurface -> Color
AppColors.error -> Color
AppTypography.bodyMedium -> TextStyle
AppTypography.labelLarge -> TextStyle
AppSizing.minTouchTarget -> double
AppSizing.focusIndicatorWidth -> double

Relationships

Dependents (2)

Components that depend on this component

ui Accessible Widget Library service Accessibility Audit Service