Pure js NPM package to check hdr support in css (browser and hardware)
Install it in a project
npm install isit-hdr-ready
You can use it in your markup like this:
<p class="hdr-not-ready-message">✅ Browser support sRGB</p>
<p class="hdr-ready-message hidden">✅ Browser and Hardware is HDR ready</p>
Then check hdr support and change block, picture or js logic:
import isitHDRReady from "isit-hdr-ready";
const hdrReadyMessage = document.querySelector(".hdr-ready-message");
if (isitHDRReady()) {
hdrReadyMessage.classList.remove("hidden");
}