System color keywords

In forced colors mode (detectable with the forced-colors media query), most colors are restricted into a user- and browser-defined palette. These system colors are exposed by the following keywords, which can be used to ensure that the rest of the page integrates well with the restricted palette. These values may also be used in other contexts, but are not widely supported by browsers.

The keywords in the following list are defined by the CSS Color Module Level 4 specification.

Note: Note that these keywords are case insensitive, but are listed here with mixed case for readability.

Syntax

ActiveText

Text of active links

ButtonBorder

Base border color of controls

ButtonFace

Background color of controls

ButtonText

Foreground color of controls

Canvas

Background of application content or documents

CanvasText

Foreground color in application content or documents

Field

Background of input fields

FieldText

Text in input fields

GrayText

Foreground color for disabled items (e.g. a disabled control)

Highlight

Background of selected items

HighlightText

Foreground color of selected items

LinkText

Text of non-active, non-visited links

Mark

Background of text that has been specially marked (such as by the HTML mark element)

MarkText

Text that has been specially marked (such as by the HTML mark element)

VisitedText

Text of visited links

Deprecated system color keywords

The following keywords were defined in earlier versions of the CSS Color Module. They are now deprecated for use on public web pages.

ActiveBorder Deprecated

Active window border.

ActiveCaption Deprecated

Active window caption. Should be used with CaptionText as foreground color.

AppWorkspace Deprecated

Background color of multiple document interface.

Background Deprecated

Desktop background.

ButtonHighlight Deprecated

The color of the border facing the light source for 3-D elements that appear 3-D due to that layer of surrounding border.

ButtonShadow Deprecated

The color of the border away from the light source for 3-D elements that appear 3-D due to that layer of surrounding border.

CaptionText Deprecated

Text in caption, size box, and scrollbar arrow box. Should be used with the ActiveCaption background color.

InactiveBorder Deprecated

Inactive window border.

InactiveCaption Deprecated

Inactive window caption. Should be used with the InactiveCaptionText foreground color.

InactiveCaptionText Deprecated

Color of text in an inactive caption. Should be used with the InactiveCaption background color.

InfoBackground Deprecated

Background color for tooltip controls. Should be used with the InfoText foreground color.

InfoText Deprecated

Text color for tooltip controls. Should be used with the InfoBackground background color.

Menu background. Should be used with the MenuText or -moz-MenuBarText foreground color.

Text in menus. Should be used with the Menu background color.

Scrollbar Deprecated

Background color of scroll bars.

ThreeDDarkShadow Deprecated

The color of the darker (generally outer) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border.

ThreeDFace Deprecated

The face background color for 3-D elements that appear 3-D due to two concentric layers of surrounding border. Should be used with the ButtonText foreground color.

ThreeDHighlight Deprecated

The color of the lighter (generally outer) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border.

ThreeDLightShadow Deprecated

The color of the darker (generally inner) of the two borders facing the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border.

ThreeDShadow Deprecated

The color of the lighter (generally inner) of the two borders away from the light source for 3-D elements that appear 3-D due to two concentric layers of surrounding border.

Window Deprecated

Window background. Should be used with the WindowText foreground color.

WindowFrame Deprecated

Window frame.

WindowText Deprecated

Text in windows. Should be used with the Window background color.

Firefox non-standard system color extensions

Firefox also supports some non-standard extensions to the system color keyword set.

-moz-ButtonDefault Non-Standard

The border color that goes around buttons that represent the default action for a dialog box.

-moz-ButtonHoverFace Non-Standard

The background color of a button that the mouse pointer is over (which would be ThreeDFace or ButtonFace when the mouse pointer is not over it). Should be used with the -moz-ButtonHoverText foreground color.

-moz-ButtonHoverText Non-Standard

The text color of a button that the mouse pointer is over (which would be ButtonText when the mouse pointer is not over it). Should be used with the -moz-ButtonHoverFace background color.

-moz-CellHighlight Non-Standard

Background color for selected item in a tree widget. Should be used with the -moz-CellHighlightText foreground color. See also -moz-html-CellHighlight.

-moz-CellHighlightText Non-Standard

Text color for a selected item in a tree. Should be used with the -moz-CellHighlight background color. See also -moz-html-CellHighlightText.

-moz-Combobox Non-Standard

Background color for combo-boxes. Should be used with the -moz-ComboboxText foreground color. In versions prior to 1.9.2, use -moz-Field instead.

-moz-ComboboxText Non-Standard

Text color for combo-boxes. Should be used with the -moz-Combobox background color. In versions prior to 1.9.2, use -moz-FieldText instead.

-moz-Dialog Non-Standard

Background color for dialog boxes. Should be used with the -moz-DialogText foreground color.

-moz-DialogText Non-Standard

Text color for dialog boxes. Should be used with the -moz-Dialog background color.

-moz-dragtargetzone Non-Standard , -moz-EvenTreeRow Non-Standard

Background color for even-numbered rows in a tree. Should be used with the -moz-FieldText foreground color. In Gecko versions prior to 1.9, use -moz-Field. See also -moz-OddTreeRow.

-moz-html-CellHighlight Non-Standard

Background color for highlighted item in HTML <select>s. Should be used with the -moz-html-CellHighlightText foreground color. Prior to Gecko 1.9, use -moz-CellHighlight.

-moz-html-CellHighlightText Non-Standard

Text color for highlighted items in HTML <select>s. Should be used with the -moz-html-CellHighlight background color. Prior to Gecko 1.9, use -moz-CellHighlightText.

-moz-mac-accentdarkestshadow Non-Standard , -moz-mac-accentdarkshadow Non-Standard , -moz-mac-accentface Non-Standard , -moz-mac-accentlightesthighlight Non-Standard , -moz-mac-accentlightshadow Non-Standard , -moz-mac-accentregularhighlight Non-Standard , -moz-mac-accentregularshadow Non-Standard

Accent colors.

-moz-mac-chrome-active Non-Standard , -moz-mac-chrome-inactive Non-Standard

Colors for inactive and active browser chrome.

-moz-mac-focusring Non-Standard , -moz-mac-menuselect Non-Standard , -moz-mac-menushadow Non-Standard , -moz-mac-menutextselect Non-Standard , -moz-MenuHover Non-Standard

Background color for hovered menu items. Often similar to Highlight. Should be used with the -moz-MenuHoverText or -moz-MenuBarHoverText foreground color.

-moz-MenuHoverText Non-Standard

Text color for hovered menu items. Often similar to HighlightText. Should be used with the -moz-MenuHover background color.

-moz-MenuBarText Non-Standard

Text color in menu bars. Often similar to MenuText. Should be used on top of Menu background.

-moz-MenuBarHoverText Non-Standard

Color for hovered text in menu bars. Often similar to -moz-MenuHoverText. Should be used on top of -moz-MenuHover background.

-moz-nativehyperlinktext Non-Standard

Default platform hyperlink color.

-moz-OddTreeRow Non-Standard

Background color for odd-numbered rows in a tree. Should be used with the -moz-FieldText foreground color. In Gecko versions prior to 1.9, use -moz-Field. See also -moz-EvenTreeRow.

-moz-win-communicationstext Non-Standard

Should be used for text in objects with appearance: -moz-win-communications-toolbox;.

-moz-win-mediatext Non-Standard

Should be used for text in objects with appearance: -moz-win-media-toolbox.

-moz-win-accentcolor Non-Standard

Used to access the Windows 10 custom accent color that you can set on the start menu, taskbar, title bars, etc.

-moz-win-accentcolortext Non-Standard

Used to access the color of text placed over the Windows 10 custom accent color in the start menu, taskbar, title bars, etc.

See also

  • <color> data type these keywords belong to.