Foundations
Text colour
Apply SGDS text colour utilities for body, heading, label, and interactive text across themes.
Text colour utilities apply semantic colour tokens to text. All tokens are theme-aware and automatically switch between day and night mode values — unless a fixed variant is used.
Base
General-purpose hierarchy tokens. Use these when a specific typographic role (heading, label, link) does not apply.
sgds:text-default#1a1a1a#ffffffsgds:text-subtle#525252#c6c6c6sgds:text-muted#c6c6c6#3b3b3bsgds:text-inverse#f3f3f3#2a2a2asgds:text-fixed-light#f3f3f3#f3f3f3sgds:text-fixed-dark#1a1a1a#1a1a1aTypography roles
Purpose-specific tokens for structured document content. Prefer these over base tokens when the element has a clear typographic role.
sgds:text-display-default#1a1a1a#ffffffsgds:text-heading-default#2a2a2a#f3f3f3sgds:text-body-default#1a1a1a#ffffffsgds:text-body-subtle#525252#c6c6c6sgds:text-label-default#2a2a2a#f3f3f3sgds:text-link-default#0269d0#60aaf4sgds:text-link-emphasis#0151a0#96c7f7Semantic
State and brand tokens that carry meaning. Use these when colour communicates a specific intent — status, feedback, or brand identity.
sgds:text-accent-default#0269d0#60aaf4sgds:text-accent-emphasis#0151a0#96c7f7sgds:text-success-default#0e7c3d#16bd5esgds:text-success-emphasis#0b5e2f#62db96sgds:text-danger-default#cf2323#e98b8bsgds:text-danger-emphasis#a11b1b#f1b2b2sgds:text-warning-default#7e6917#e5bf29sgds:text-warning-emphasis#605111#fcde63sgds:text-purple-default#ac1cdb#d983f6sgds:text-purple-emphasis#8516a9#e6adf9sgds:text-cyan-default#00758d#00b4dasgds:text-cyan-emphasis#005a6d#49d2efsgds:text-neutral-default#6b6b6b#a5a5a5sgds:text-neutral-emphasis#525252#c6c6c6