System Colors

This page was created to help the W3C ARIA Authoring Practices Task Force develop guidance in using CSS System Colors when contrast themes are set in operating systems or browser settings.

Supported System Colors for Contrast Themes

Summary

System colors that can are changed for both Firefox Contrast themes and Windows 11 Contrast Themes:

Accent Color
Button Face
Button Text
Canvas
Canvas Text
Link Text
Visited Text

Default System Colors by Operating System

Summary

The default system colors are not consistent between browsers, although Mozilla Firefox and Google Chrome use very similar schemes.

Default System Colors Data

Firefox Contrast

Summary

The system colors affected by Firefox Website Contrast settings are consistent between operating systems. The following system colors are changed based on the contrast settings:

Accent Color
Button Face
Button Text
Canvas
Canvas Text
Link Text
Visited Text

Firefox Windows Contrast Data

Windows 11 Contrast Themes

Summary

The system colors affected by Window 11 Contrast Themes are consistent between Firefox, Chrome and Edge, except for the Active Text system color which Firefox does not support. The following system colors are changed based on all three browsers when a Windows 11 Contrast Theme is enabled:

Accent Color
Accent Color Text
Button Border
Button Face
Button Text
Canvas Text
Field Text
Gray Text
Highlight
Highlight Text
Link Text
Mark Text
Selected Item
Selected Item Text
Visited Text

Windows 11 Contrast Theme Data

Current Computed System Colors

The following table shows the current system colors based on the browser you are using, operating system and contrast theme settings. Information can be expored in a JSON format and this information was used to create the comparison tables in the previous sections.

Color Context

Color Theme

Export Options

Download as JSON | Copy JSON to Clipboard

Computed System Colors

System Color	Computed Color	Description