social-preview.png: text contrast falls below WCAG 3:1 large-text minimum at the gradient's pink end

[isaacschepp]

Summary

The white text on .github/social-preview.png falls below the WCAG 2.x large-text contrast minimum (3:1) where it crosses the pink end of the diagonal gradient. Measured against the rendered gradient (WCAG relative-luminance formula, white text vs background within each text line's bounding box):

Text line	Min contrast	Mean contrast	WCAG 3:1 (large text)
GENEALOGIX wordmark (96px bold)	2.61:1	3.26:1	fail at right end
Tagline (32px)	2.45:1	3.11:1	fail at right end
Bullets line (26px)	2.54:1	3.15:1	fail at right end

The bottom-right corner of the gradient reaches 2.12:1 vs white. The gradient start (top-left, #0657FF) is fine at 5.50:1.

All three lines qualify as "large text" (≥24px regular / ≥18.66px bold), so the applicable AA minimum is 3:1 — and each line dips below it precisely where it matters most: the tagline's last words ("data standard") and the bullets' last item ("Version controlled") sit on the lightest background. Social cards are usually viewed as small thumbnails in feeds/chat clients, which makes marginal contrast worse in practice.

Related layout note while editing the text block: the tagline runs to x≈1215 on a 1280px canvas (~65px from the edge). The cross-platform convention for og:image reuse is to keep critical text in the central safe zone (platforms other than GitHub crop 2:1 toward 1.91:1, and some compact previews center-crop harder), so pulling the text block's right edge in — or fixing contrast by ending the gradient darker — both help if this asset is later reused as the website's og:image (#281).

Reproduce

# WCAG relative luminance of the pure gradient under each text bbox,
# contrast = (L_white + 0.05) / (L_bg + 0.05)
# regions: wordmark (500,1145,245,325), tagline (500,1215,335,365), bullets (500,1140,385,410)

Fix options (pick one)

1. Darken the gradient end stop for the preview only (e.g. keep hue, drop lightness so the whole canvas stays ≥3:1 vs white). Simplest; one constant in scripts/generate-social-preview.py.
2. Scrim: draw a subtle dark translucent panel or vertical darkening behind the text block.
3. Text shadow/outline on the three lines.
4. Constrain the text block so it ends before the gradient gets light (loses horizontal space).

Whichever is chosen: regenerate, commit, and re-upload via Settings → Social preview (the upload is manual; the currently uploaded image is byte-identical to the committed file, SHA256 48E7FEB8…, so they should be kept in sync).