W3cubDocs

/CSS

CSS Colors

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 compatibilityUpdate compatibility data on GitHubUpdate compatibility data on GitHubUpdate compatibility data on GitHub

color property

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
color 1 12 1 3 3.5 1
Mobile
Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
color 1 18 4 10.1 1 1.0

color-adjust property

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
color-adjust 49
49
Uses the non-standard name: -webkit-print-color-adjust
79
79
Uses the non-standard name: -webkit-print-color-adjust
48 No 15
15
Uses the non-standard name: -webkit-print-color-adjust
6
6
Uses the non-standard name: -webkit-print-color-adjust
Mobile
Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
color-adjust 49
49
Uses the non-standard name: -webkit-print-color-adjust
49
49
Uses the non-standard name: -webkit-print-color-adjust
48 36
36
Uses the non-standard name: -webkit-print-color-adjust
6
6
Uses the non-standard name: -webkit-print-color-adjust
5.0
5.0
Uses the non-standard name: -webkit-print-color-adjust

opacity property

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
opacity 1 12 1
1
1 — 3.5
Prefixed
Prefixed Implemented with the vendor prefix: -moz-
9 9 2
2
1.1 — 2
Prefixed
Prefixed Implemented with the vendor prefix: -khtml-
Support for percentage opacity values 78 79 70 No No No
Mobile
Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
opacity 1 18 4 10.1 1 1.0
Support for percentage opacity values 78 78 No No No 12.0

Legend

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

See also

© 2005–2020 Mozilla and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Colors