Gamut Explorer User Guide
A complete workflow guide for designing, comparing, visualizing, and exporting RGB color spaces: chromaticity diagrams, standard and custom primaries, RGB to XYZ matrices, transfer curves, Lab and OKLab slices, 3-D wireframes, Monte Carlo volume metrics, share URLs, and local library exchange.
Overview
Gamut Explorer is the workspace for RGB color-space engineering. It helps you compare standard gamuts, inspect CIE 1931 xy and CIE 1976 u-prime v-prime diagrams, derive matrices from primaries, visualize EOTF and OETF behavior, estimate Lab volume and overlap, and exchange custom color-space definitions. It is useful for display engineering notes, wide-gamut design education, HDR handoff, ACES and cinema comparisons, and custom gamut experiments.
1. Workspace Layout
+Gamut Explorer is split into a live Lab tab plus a Transfer tab that plots every transfer function, a Compare tab that measures every space the same way, a Data tab listing the datasets behind the figures, an Export tab, and a Reference tab that holds the standards, formulas, citations, and research notes.
- Lab: working color space, diagram mode, observer selector, overlays, vertex readout, PNG and SVG export, primaries, white point, RGB to XYZ matrices, transfer function, volume comparison, gamut slice controls, chromaticity diagram, transfer curve, slice diagram, and 3-D wireframe.
- Export: choose what to take and in which format, preview the exact payload, then download or copy it; the tab also holds the local library table, JSON import, and exchange status.
- Standards: display, broadcast, cinema, VFX, photography, print, legacy, and colorimetry standard summaries.
- Formulas: xy and u-prime v-prime coordinates, RGB to XYZ matrix derivation, sRGB, PQ, HLG, shoelace area, Monte Carlo volume, and overlap notes.
- Citations: source standards and citations for color spaces, matrix derivation, transfer functions, gamut volume, and gamut mapping.
- Research notes: interpretation notes for gamut triangle area, transfer functions, MacAdam ellipses, Monte Carlo accuracy, gamut mapping intents, imaginary primaries, CIELAB, and OKLab.
2. Working spaces
+- sRGB / BT.709: the baseline web, desktop, and HDTV-style color space.
- Display P3: common wide-gamut display space with P3 primaries and D65 white.
- DCI-P3: digital cinema P3 variant with cinema white and gamma 2.6.
- Rec.2020: UHD wide-gamut primaries used as the RGB container for many HDR workflows.
- Rec.2100 PQ and HLG: Rec.2020 primaries paired with HDR transfer functions.
- Adobe RGB: photography and print-oriented D65 space with a wider green primary than sRGB.
- ProPhoto RGB and Adobe Wide Gamut: very wide D50 spaces for high-fidelity reproduction and editing studies.
- ACES AP0 and ACES AP1: scene-referred cinema and VFX spaces. AP0 includes an imaginary primary outside the spectral locus, while AP1 is the practical ACEScg working space.
- NTSC 1953 and PAL/SECAM: legacy broadcast references useful for historical comparison.
- Custom: a runtime-editable space created from the primaries panel or imported JSON.
3. Diagram modes and overlays
+- CIE 1931 xy: the default chromaticity diagram and the best mode for comparing standard primary triangles against the spectral locus.
- CIE 1976 u-prime v-prime: a more perceptually even chromaticity view for comparing chromatic distances.
- 3-D wireframe: renders projected Lab gamut boundary rings for selected spaces.
- Spectral locus: draws the boundary of visible chromaticities from 380 nm to 715 nm, the range where the color matching function table still gives reliable chromaticities.
- Grid: adds coordinate reference lines for reading positions.
- MacAdam ellipses: overlays discrimination ellipses to show why xy is not perceptually uniform.
- Lambda labels: labels selected spectral wavelengths along the locus.
- Show all library spaces: draws every registered standard and custom space, useful for broad comparison but visually dense.
- WebGL chromaticity fill: attempts a solid CIE fill through WebGL2. If WebGL2 is unavailable, the canvas still renders the grid, locus, and gamut overlays.
4. Vertex Probe and Membership
+- Click or drag the diagram: the probe converts the canvas position back into xy or u-prime v-prime coordinates for the active diagram mode.
- Coordinate readout: the side panel reports x, y, and Y for the current probe.
- Display chip: the probe estimates an sRGB preview HEX for the selected chromaticity.
- Lab readout: the selected point is converted through XYZ into CIELAB for L*, a*, and b* diagnostics.
- Membership row: the output reports whether the point falls inside each active gamut triangle.
- Important limit: triangle membership is a chromaticity test. It does not prove the full luminance-dependent color is inside a device profile.
5. Primaries, white point, and matrices
+- Primaries panel: shows red, green, blue, and white xy coordinates for the active space.
- White point XYZ: reports the active white converted from xy with Y = 1.
- RGB to XYZ matrix: derived from the primary xy coordinates and scaled to match the white point.
- XYZ to RGB matrix: inverse of the RGB to XYZ matrix.
- Solve from primaries: takes the current primary fields, registers them as the runtime Custom space, clears the custom matrix cache, and redraws the diagrams.
- Area metrics: reports xy triangle area and percentage relative to sRGB.
- Custom-space caution: invalid or degenerate primary coordinates can produce a non-invertible matrix. Use plausible xy coordinates and verify the matrix output after solving.
6. Transfer functions
+The transfer function section lets you compare how encoded values map to linear light or HDR luminance. The curve canvas draws the selected EOTF with a linear reference.
- sRGB and Display P3: use the sRGB piecewise transfer curve.
- Rec.2020: uses the ITU-R BT.2020-2 transfer curve.
- PQ: uses ST 2084-style absolute luminance mapping up to 10000 cd/m2, shown on a logarithmic vertical scale.
- HLG: uses Hybrid Log-Gamma behavior for broadcast-style HDR. Only the inverse OETF runs, so the Transfer tab marks it as partial.
- Pure gamma: DCI-P3 (2.6), Adobe Wide Gamut and NTSC 1953 (2.2), and PAL/SECAM (2.8) show their gamma labels. Adobe RGB uses its specified 563/256, and ProPhoto RGB uses the ROMM curve, gamma 1.8 with a linear toe.
- Equation panel: prints the active transfer equation or identity rule for quick handoff notes.
7. Volume, overlap, and slices
+- Volume comparison: choose a reference space and a target space, then compute approximate CIELAB volume for both.
- Active space target: the target dropdown can use the current working space so the comparison follows your primary selection.
- Overlap metrics: reports overlap of A, overlap of B, and Jaccard percentage from a Halton-sampled u-prime v-prime triangle comparison.
- Multi-space table: the Compare tab measures every space with the same number of Halton samples and lists white point, Lab volume with its spread, size relative to sRGB, and share of the spectral locus in u-prime v-prime (xy share is kept as a legacy option).
- Gamut slice mode: choose Constant L* in CIELAB or Constant L in OKLab.
- Slice level: controls lightness from 0 to 100. In OKLab mode, the label maps the same slider to 0.00 through 1.00.
- Slice canvas: draws boundary rings for up to five active spaces, making it easier to see how gamut changes at a fixed lightness.
- 3-D wireframe canvas: projects Lab gamut rings and meridians so the volume shape can be compared visually.
8. Exports, share URLs, and library exchange
+- Export PNG: downloads the main diagram canvas as a PNG file.
- Export SVG: wraps the main diagram raster image in an SVG container for easier placement in documents.
- This space (JSON): in the Export tab, previews the active color-space definition, primaries, white point, gamma, matrices, and xy area, then downloads it or copies it to the clipboard.
- The comparison (CSV or JSON): downloads one row per space the diagram is drawing
as
gamut-comparison.csvorgamut-comparison.json. - A link to this view: Copy the link copies a URL with the active runtime state
encoded in the
squery parameter. - Library table: lists standard and custom spaces. Standard rows can be loaded; custom rows can be loaded or deleted.
- Every space and the diagram: export all spaces as one JSON array, or the diagram as SVG or PNG.
- Add to the library: reads JSON from the import text area and stores it as a custom space in browser local storage.
- Library persistence: custom spaces are stored locally in the browser, so they are origin-specific and device-specific.
9. Recommended workflows
+- Display P3 design note: select Display P3, compare it against sRGB and Rec.2020, turn on the spectral locus and labels, then export PNG for design review.
- HDR container study: select Rec.2100 PQ or Rec.2100 HLG, inspect the Rec.2020 triangle, then compare PQ and HLG transfer curves.
- Cinema comparison: compare DCI-P3, Display P3, ACES AP0, and ACES AP1 with all-space overlays and the wireframe canvas.
- Custom gamut experiment: edit primary xy values, click Solve from primaries, verify the matrices, export JSON, and import the result into the local library.
- Volume explanation: compare sRGB with Display P3 or Rec.2020, then use the Lab or OKLab slice to show why triangle area and perceptual volume tell different stories.
- Research handoff: use the Export tab to generate JSON and CSV, then copy a link to this view so another reviewer can reopen the same state.
10. Troubleshooting
+- The diagram is crowded: turn off Show all library spaces and keep only the active comparison spaces visible.
- WebGL fill is not visible: the fill requires WebGL2. The 2D canvas overlays still work without it.
- The custom matrix is blank or strange: check for invalid primary coordinates, duplicate primaries, or a white point outside expected xy ranges.
- Volume takes a moment: Monte Carlo volume uses thousands of samples. Wait for the computing status to finish before changing spaces again.
- The share URL is long: the full state is Base64-encoded in the query string. That is expected for preserving multiple controls in a static page.
- Imported JSON fails: the import needs a
name,primaries,whitePoint, and optionalgammavalue. - Custom spaces disappear in another browser: the local library uses browser local storage. Export JSON when a custom definition needs to move across devices.