CSS print-color-adjust Property


The print-color-adjust CSS property is used to control how colors are adjusted when a web page is printed. It is particularly useful for ensuring that the printed version of a page maintains color accuracy and legibility. By setting this property to values like "exact" or "economy," web developers can specify whether they want the colors to be adjusted to match the original screen display as closely as possible or to be optimized for economical printing, which may result in color conversions or simplifications to save ink or toner. This property helps designers fine-tune the printed output of web content, ensuring it meets their intended visual standards while being mindful of print resource conservation.

Initial value
Applies to
all elements
Computed value
as specified
JavaScript syntax


print-color-adjust: economy | exact


  • economyThe user agent is allowed to make adjustments to the element as it deems appropriate and prudent in order to optimize the output for the device it's being rendered for. For example, when printing, a browser might opt to leave out all background images and to adjust text colors to be sure the contrast is optimized for reading on white paper. This is the default.
  • exactThe element's content has been specifically and carefully crafted to use colors, images, and styles in a thoughtful and/or important way, such that being altered by the browser might actually make things worse rather than better. The appearance of the content should not be changed except by the user's request. For example, a page might include a list of information with rows whose background colors alternate between white and a light grey. Removing the background color would decrease the legibility of the content.


<div class="my-box">
<p>Need more contrast!</p>
.my-box {
  background-color: black;
  background-image: linear-gradient(
    rgba(0, 0, 180, 0.5),
    rgba(70, 140, 220, 0.5)
  color: #900;
  width: 15rem;
  height: 6rem;
  text-align: center;
    24px "Helvetica",
  display: flex;
  align-items: center;
  justify-content: center;
  print-color-adjust: exact;

Browser Support

The following table will show you the current browser support for the CSS print-color-adjust property.

Edge Chrome Firefox Opera Safari
Tablets / Mobile
Chrome Firefox Opera Safari Samsung Webview

Last updated by CSSPortal on: 31st December 2023