CSS Color

CSS Color is a CSS module that deals with colors, color types, color blending, opacity, and how you can apply these colors and effects to HTML content. Not all CSS properties that take a <color> as a value are part of this module, but they do depend upon it.

Reference

Properties

Data types

Guides

Applying color to HTML elements using CSS
A guide to using CSS to apply color to a variety of types of content. All color-related CSS properties are touched upon.

Tools

Color picker tool
This tool makes it easy to create, adjust, and experiment with custom colors.

Specifications

Specification Status Comment
CSS Color Module Level 4 Working Draft
CSS Color Module Level 3 Recommendation
CSS Level 2 (Revision 1) Recommendation
CSS Level 1 Recommendation Initial definition

Browser compatibility

color property

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
colorChrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 3Opera Full support 3.5Safari Full support 1WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support 1.0

Legend

Full support  
Full support

color-adjust property

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
color-adjustChrome Full support 49
Alternate Name
Full support 49
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Edge Full support 79
Alternate Name
Full support 79
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Firefox Full support 48IE No support NoOpera Full support 15
Alternate Name
Full support 15
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Safari Full support 6
Alternate Name
Full support 6
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
WebView Android Full support 49
Alternate Name
Full support 49
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Chrome Android Full support 49
Alternate Name
Full support 49
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Firefox Android Full support 48Opera Android Full support 36
Alternate Name
Full support 36
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Safari iOS Full support 6
Alternate Name
Full support 6
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust
Samsung Internet Android Full support 5.0
Alternate Name
Full support 5.0
Alternate Name
Alternate Name Uses the non-standard name: -webkit-print-color-adjust

Legend

Full support  
Full support
No support  
No support
Uses a non-standard name.
Uses a non-standard name.

opacity property

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
opacityChrome Full support 1Edge Full support 12Firefox Full support 1
Full support 1
No support 1 — 3.5
Prefixed
Prefixed Implemented with the vendor prefix: -moz-
IE Full support 9Opera Full support 9Safari Full support 2
Full support 2
No support 1.1 — 2
Prefixed
Prefixed Implemented with the vendor prefix: -khtml-
WebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support 10.1Safari iOS Full support 1Samsung Internet Android Full support 1.0
Support for percentage opacity valuesChrome Full support 78Edge Full support 79Firefox Full support 70IE No support NoOpera No support NoSafari No support NoWebView Android Full support 78Chrome Android Full support 78Firefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No

Legend

Full support  
Full support
No support  
No support
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also