HLC Colour Picker

Meaning of the Output Values

Every input in this tool is automatically snapped to a valid atlas reference. This reference in the form Hxxx_Lxxx_Cxxx is the actual color identity. All other values describe the snapped entry, but they do not replace it.

Atlas ID / Snapped HLC

The atlas ID, for example H260_L065_C045, is the binding reference of the color. H stands for Hue, L for Lightness, and C for Chroma. The values are displayed in HLC order so the reference remains easy to read.

ΔE00

ΔE00 shows the distance between your input and the snapped atlas entry. The smaller the value, the closer the selected atlas value is to the original input. In this system, ΔE00 (D50 / 2°) is used as the primary snap metric.

HEX / RGB

HEX and RGB are display values for web, user interfaces, and digital preview. They support screen representation, but they are not the color identity itself. In the enriched data, these values are treated as derived or supplemented display attributes.

Lab

Lab values describe the color in the CIE Lab system. In the atlas, they are derived from HLC using: L*=L, a*=C·cos(H°), b*=C·sin(H°). Lab is therefore the technical comparison layer behind the snap.

λ*_V2

λ*_V2 is the energetic balance point of the reflectance spectrum. It describes the wavelength at which absorption and reflection reach structural balance. In the atlas, this value is defined using Brent root finding.

λ*_EE

λ*_EE is the spectral center of gravity of the reflected energy. It serves as the reference center for the further structural moments.

Δλ*

Δλ* is the difference between λ*_V2 and λ*_EE. Positive values indicate a structural pull toward higher wavelengths, negative values toward lower wavelengths. Values near zero indicate a balanced spectral position.

μ₂

μ₂ describes the spectral width around λ*_EE. Smaller values indicate a compact structure, larger values a broader spectral structure. Unit: nm².

σ*

σ* is the square root of μ₂ and therefore the more directly readable spread scale. The larger the value, the more widely the spectrum is distributed. Unit: nm.

μ₃

μ₃ describes the asymmetry of the spectrum. Positive values indicate a longer reflectance tail toward higher wavelengths, negative values a longer tail toward lower wavelengths. Unit: nm³.

γ₁

γ₁ is the normalized skewness of the spectrum. It makes asymmetric spectral distributions comparable without units.

Provenance / Gamut

Additional notes such as provenance or gamut indicate where a value comes from and how it can be represented digitally. They improve traceability, but they do not change the atlas identity of the color.

Important for Interpretation

HEX, RGB, Lab, and other input values are treated as requests in this system. The result is always a snapped, valid atlas entry. Without Hxxx_Lxxx_Cxxx, there is no color in the system.

CSS Land Tools

Interaktive CSS-Helfer für deine Website. Inspiriert von css.land, erweitert um atlas-only Snap auf gültige Hxxx_Lxxx_Cxxx-Referenzen.

Atlas Snap Input

Alle Eingaben sind nur Anfragen. Das Ergebnis wird sofort auf den nächsten gültigen Atlas-Eintrag gesnappt und ausschließlich als reale Referenz ausgegeben.

HEX wird nach Lab umgerechnet und dann per ΔE00 auf den Atlas gesnappt.

RGB wird als sRGB interpretiert, nach Lab überführt und dann auf den Atlas gesnappt.

Lab wird direkt per ΔE00 auf die nächste gültige Atlas-Referenz gesnappt.

ARBE ist hier eine attributbasierte Atlas-Selektion. Es werden nur vorhandene Referenzen verglichen; es wird keine freie Farbe erzeugt.

Snapped H: 260 Snapped L: 65 Snapped C: 45 Alpha: 100% Input-Modus: HLC
Atlasdaten werden geladen…
Atlas-ReferenzWird geladen…
Snapped HLC
Snap-Metrik
HEX
RGB
Lab
λ*_V2
λ*_EE
Δλ*
μ₂
σ*
μ₃
γ₁
HEX Provenienz
RGB Provenienz
sRGB vor Clip

Die Ausgabe verwendet immer den gesnappten Atlas-Eintrag. Der C-Wert wird nie interpoliert, nie gebrochen und nie aus einem Zwischenwert übernommen.

Alle Werte des gesnappten Atlas-Eintrags

Die folgende Anzeige kommt vollständig aus dem aktuellen Atlas-Eintrag. Identität und Attribute bleiben getrennt.

Wird geladen…

Linear Range Mapper

Mappt einen Eingabewert linear auf einen CSS-Ausgabewert.

Steigung a
Offset b

Beispiel: Setze --progress per CSS oder inline auf einen Wert zwischen X min und X max.

Specificity Battle

Vergleicht zwei CSS-Selektoren anhand ihrer Spezifität.

Selektor A 0,0,0
Selektor B 0,0,0
Bereit zum Vergleich

Unterstützt gängige Selektoren, Attribute, Pseudo-Klassen und viele moderne Spezialfälle wie :is(), :not(), :has() und :where().

Box Model

Visualisiert Content, Padding, Border und Margin.

content
Gesamtbreite
Gesamthöhe