1. css
  2. /properties
  3. /print-color-adjust

print-color-adjust

Overview

The print-color-adjust property specifies suggestions for the user agent to potentially optimize color usage when rendering a webpage on non-screen media, like print media. Essentially, it gives a hint to the browser regarding modifications to color usage for output optimization, such as ink-saving when printing.

Examples and Usage

The examples provided below are mainly for illustrative purposes, as the actual effects of this property may significantly vary depending on the output device and user agent.

/* The browser is allowed to make color adjustments to save ink */
.example-element {
  print-color-adjust: economy;
}

/* The browser should respect the original color styles */
.example-element {
  print-color-adjust: exact;
}

Note that the specified appearance with the print-color-adjust property is not a guarantee but rather a hint to the browser. The actual outcome can vary depending on various factors, including the output device's capabilities, the user agent's implementation, and user settings.

Values

ValueDescription
economyDefault value. Permits the browser to alter colors and styles to optimize the output for the specific rendering device, like removing dark backgrounds or altering text colors for better readability on white paper.
exactInstructs the browser to maintain the exact colors and styles as specified on the elements, unless overridden by the user. Useful in situations where specific color usage and styles contribute significantly to the readability or visual presentation.

Associated Properties

  • color
  • background-color
  • border-color
  • outline-color
  • text-decoration-color
  • text-emphasis-color
  • text-shadow
  • caret-color
  • column-rule-color
  • background-image

Tips and Tricks

  • Be aware that the effect of print-color-adjust is not guaranteed. User agents are allowed to decide how to handle this property.

  • In most browsers, the print-color-adjust property doesn't affect the <body> element. If it's set to exact for the <body> element, it applies only to its descendants.

  • Successful implementation of the print-color-adjust property significantly depends on the correct use of vendor prefixes.

Browser Compatibility

For a detailed breakdown of browser behavior, vendor prefix usage, and partial support in specific browser versions, refer to the first link in the Useful Resources below.

BrowserChromeEdgeSafariFirefoxOperaInternet Explorer
SupportYes*Yes*Yes*Yes*Yes*No

Caution: Early Edge versions used EdgeHTML, leading to mismatched version numbers. From version 79, Edge uses Chromium with matching version numbers.

Useful Resources

Can I use: print-color-adjust

W3C's Editor's Draft of CSS Color Adjustment Module Level 1: print-color-adjust