Where does alpha go in an eight-digit CSS HEX code?

The original control

We authored an RGBA PNG with two equal-width swatches. The left stored (21, 127, 124, 128), and the right stored (244, 123, 82, 64). Our script serialized the bytes in CSS order and also constructed an alpha-first control string from the very same source channels. The PNG pixels themselves were not changed for the string comparison.

CSS: red, green, blue, then alpha — Results from our authored fixture and the exact comparison described below.

What the saved files measured

The teal source serialized as #157F7C80. The alpha-first control was #80157F7C, which reads as CSS channels (128, 21, 127, 124). The coral source serialized as #F47B5240; its alpha-first control #40F47B52 reads as (64, 244, 123, 82). The table records raw byte parsing, not visually estimated swatches.

Original test file	Detected format / mode	Dimensions	Bytes	Distinct decoded RGBA values
alpha-byte-order.png	PNG / RGBA	240 × 120	450	2

These are source-file measurements made with Python 3.12.14, Pillow 12.3.0 and libwebp 1.6.0. The manifest records complete file hashes, decoded RGBA hashes and the relevant coordinates. File sizes are measured bytes for these inputs, not forecasts for other images.

How to interpret this comparison

Checking only string length would miss this error: both representations contain eight hexadecimal digits. The receiving syntax decides which channel each pair means. We compare the full RGBA tuple so a changed alpha byte cannot hide behind a familiar-looking RGB prefix. The CSS specification confirms the last pair is alpha; the original test supplies the concrete channel examples.

Original experiment file previews on white, with detected formats and dimensions — These are previews of authored test files, composited on white for the diagram where necessary. They are not screenshots of a browser test.

Repeat this exact test

Read the source RGBA samples and their css_hex strings in the experiment JSON.
Split each alpha-first control into pairs and compare its CSS interpretation against the original tuple.
Keep all eight digits when alpha matters. A six-digit HEX code alone cannot preserve that source alpha byte.

Download and unpack the ZIP. With Python and Pillow installed, run the command below. Compare the generated measurements.json with the included report. The script regenerates fixtures and computes the measurements; it does not obtain values from this article.

python reproduce.py --case css-eight-digit-hex-alpha --out rerun

Scope and limits

This is source-byte serialization and parsing, not a browser rendering test or a new export feature in the picker. Apparent appearance also depends on the background. We do not describe alpha 128 as an exactly half-opacity value.

Our own sample is a diagnostic control. Applying its conclusion to another file requires checking that file and the operations performed on it. We have not measured a global error rate or established that an automatic palette is an exhaustive list of image colors.

Can I identify byte order just because the code has eight digits?

No. Confirm the destination format. This page tests CSS order, with alpha at the end.

Watch the source-file comparison

Original diagrams and synthetic English narration. Caption sentence timings are approximate.