I made a simple HDR brightness checker page. You can use it to check blooming on Mini LED monitors and brightness capabilities of OLED screens at different ABL levels. Alternatively you can use it to get CSS values for HDR colours in Display P3 colour space. Or just play around :)
Right now it only works in Chromium based browsers, and you, obviously, need an HDR capable screen.
HDR is enabled with an HDR image trick as described here, but instead of loading an external image, it is inlined inside HTML using data protocol. If you want to enable HDR CSS for your own page, add the following HTML snippet into your wb page:
<img
src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/4gKMSUNDX1BST0ZJTEUAAQEAAAJ8AAAAAARAAABtbnRyUkdCIFhZWiAAAAAAAAAAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAApkZXNjAAAA/AAAAFxyWFlaAAABWAAAABRnWFlaAAABbAAAABRiWFlaAAABgAAAABR3dHB0AAABlAAAABRyVFJDAAABqAAAAIxnVFJDAAABqAAAAIxiVFJDAAABqAAAAIxjaWNwAAACNAAAAAxjcHJ0AAACQAAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAD4AAAAcAFIAZQBjADIAMAAyADAAIABHAGEAbQB1AHQAIAB3AGkAdABoACAASABMAEcAIABUAHIAYQBuAHMAZgBlAHIAAFhZWiAAAAAAAACsaAAAR2////+BWFlaIAAAAAAAACppAACs4wAAB61YWVogAAAAAAAAIAcAAAuuAADME1hZWiAAAAAAAAD21gABAAAAANMtY3VydgAAAAAAAABAAAAADQAuAF8AoQDxAVABvAI2Ar0DUgPyBKAFWQYeBvAHzQi1CaoKqQu0DMoN7A8XEE4RkBLcFDMVlBcAGHYZ+BuGHTMfBiEAIyYlfCgFKsUtwTD/NIM4VTx5QPhF2EsjUOBXGl3bZS9tIHW+fxeJOpQ4oCKtD7sTykXawOyg//9jaWNwAAAAAAkSAAFtbHVjAAAAAAAAAAEAAAAMZW5VUwAAACAAAAAcAEcAbwBvAGcAbABlACAASQBuAGMALgAgADIAMAAxADb//gAPTGF2YzYwLjMuMTAwAP/bAEMACAQEBAQEBQUFBQUFBgYGBgYGBgYGBgYGBgcHBwgICAcHBwYGBwcICAgICQkJCAgICAkJCgoKDAwLCw4ODhERFP/EAEwAAQEAAAAAAAAAAAAAAAAAAAAFAQEBAAAAAAAAAAAAAAAAAAAABBABAAAAAAAAAAAAAAAAAAAAABEBAAAAAAAAAAAAAAAAAAAAAP/AABEIAAEAAQMBEgACEgADEgD/2gAMAwEAAhEDEQA/AKQjFA//2Q==">
Please note that this is a 1x1 image and it MUST BE VISIBLE. If you hide the image with CSS or remove it from DOM tree, Chrome will switch back to SDR rendering.