Logo
ScienceStack
Table of Contents
Fetching ...
Sign In

HELMLAB: An Analytical, Data-Driven Color Space for Perceptual Distance in UI Design Systems

Gorkem Yildiz

TL;DR

HELMLAB, a 72-parameter analytical color space for UI design systems, is presented, with competitive cross-dataset performance and Gamut mapping, design-token export, and dark/light mode adaptation utilities are included for use in web and mobile design systems.

Abstract

We present HELMLAB, a 72-parameter analytical color space for UI design systems. The forward transform maps CIE XYZ to a perceptually-organized Lab representation through learned matrices, per-channel power compression, Fourier hue correction, and embedded Helmholtz-Kohlrausch lightness adjustment. A post-pipeline neutral correction guarantees that achromatic colors map to a=b=0 (chroma < 10^-6), and a rigid rotation of the chromatic plane improves hue-angle alignment without affecting the distance metric, which is invariant under isometries. On the COMBVD dataset (3,813 color pairs), HELMLAB achieves a STRESS of 23.22, a 20.4% reduction from CIEDE2000 (29.18). Cross-validation on He et al. 2022 and MacAdam 1974 shows competitive cross-dataset performance. The transform is invertible with round-trip errors below 10^-14. Gamut mapping, design-token export, and dark/light mode adaptation utilities are included for use in web and mobile design systems.

HELMLAB: An Analytical, Data-Driven Color Space for Perceptual Distance in UI Design Systems

TL;DR

HELMLAB, a 72-parameter analytical color space for UI design systems, is presented, with competitive cross-dataset performance and Gamut mapping, design-token export, and dark/light mode adaptation utilities are included for use in web and mobile design systems.

Abstract

We present HELMLAB, a 72-parameter analytical color space for UI design systems. The forward transform maps CIE XYZ to a perceptually-organized Lab representation through learned matrices, per-channel power compression, Fourier hue correction, and embedded Helmholtz-Kohlrausch lightness adjustment. A post-pipeline neutral correction guarantees that achromatic colors map to a=b=0 (chroma < 10^-6), and a rigid rotation of the chromatic plane improves hue-angle alignment without affecting the distance metric, which is invariant under isometries. On the COMBVD dataset (3,813 color pairs), HELMLAB achieves a STRESS of 23.22, a 20.4% reduction from CIEDE2000 (29.18). Cross-validation on He et al. 2022 and MacAdam 1974 shows competitive cross-dataset performance. The transform is invertible with round-trip errors below 10^-14. Gamut mapping, design-token export, and dark/light mode adaptation utilities are included for use in web and mobile design systems.
Paper Structure (41 sections, 14 equations, 6 figures, 4 tables)

This paper contains 41 sections, 14 equations, 6 figures, 4 tables.

Table of Contents

  1. Introduction
  2. Design Goals and Metrics
  3. Color-difference accuracy (stress).
  4. Achromatic integrity.
  5. Hue-angle alignment.
  6. Round-trip accuracy.
  7. Munsell uniformity.
  8. The Helmlab Color Space
  9. Forward Transform
  10. Stage 1: Cone response (9 params).
  11. Stage 2: Power compression (3 params).
  12. Stage 3: Lab projection (9 params).
  13. Stage 4: Hue correction (8 params).
  14. Stage 5: Helmholtz--Kohlrausch embedding (6 params).
  15. Stage 6: Lightness refinement (8 params).
  16. ...and 26 more sections

Figures (6)

  • Figure 1: The Helmlab forward transform pipeline. Blue: linear operations; yellow: nonlinear corrections; green: structural guarantees (NC, rotation). All 72 parameters are jointly optimized.
  • Figure 2: stress on COMBVD (3,813 pairs). Lower is better.
  • Figure 3: Predicted vs observed color differences on COMBVD.
  • Figure 4: Cross-dataset validation on held-out data.
  • Figure 5: Left: neutral ramp step uniformity. Right: achromatic chroma leakage. Helmlab's NC guarantees $C < 10^{-6}$ for all grays.
  • ...and 1 more figures