Wrap any interface image in <div class="halftone"><img …></div> and it takes the simpler dot screen below. (The system's own reference photographs live in assets/.)

<div class="halftone">
  <img src="…" alt="…" />
</div>

Content photographs print as their four misregistered process plates with .cmyk — one swappable image in a .print wrapper; the filter defs ship in print-plates.js, inlined in the compiled bundle every template page loads (a page linking styles.css directly adds the one script tag beside the stylesheet). Interface imagery can take the simpler .halftone dot screen. Never place a raw, untreated image.