Ultra HDR

import { EquirectangularReflectionMapping, HalfFloatType, Texture } from "three"
import { UltraHDRLoader } from "three/examples/jsm/Addons.js"

const loader = new UltraHDRLoader()

// Fix iPhone 15, iOS 18.3: THREE.WebGLRenderer: Unable to use linear filtering with floating point textures. OES_texture_float_linear not supported on this device.
loader.setDataType(HalfFloatType)

const envMap = await new Promise((resolve: (texture: Texture) => void) => {
  loader.load("/assets/envmap.jpg", function (texture) {
    texture.mapping = EquirectangularReflectionMapping
    texture.needsUpdate = true
    resolve(texture)
  })
})

scene.environment = envMap

Three.js example: https://threejs.org/examples/?q=hd#webgl_loader_texture_ultrahdr
Online HDR to Ultra HDR tool: https://gainmap-creator.monogrid.com/
Understand Ultra HDR + source code: https://github.com/MONOGRID/gainmap-js

• envmap
• hdr
• online
• three.js
• tool
• webgl