v7 swatch

Hidden page for Danny: v7 colour and type check. Not linked anywhere. Updated after your choice of the bright emerald: fills are #14A36F with black text; small emerald text on white uses #0B6B4B; on black everything is #14A36F.

Panel 1: on white

Emerald#14A36F · --myn-emerald (fills, black text)Black text on it: 6.50:1 AA pass
Emerald bright#14A36F · --myn-emerald-brightBlack text on it: 6.50:1 AA pass
Warm grey#F2F1EE · --myn-greyBlack text on it: 18.59:1 AA pass

EXPLORE THE WORKS

.myn-title, #0B0B0B on white: 19.68:1 AA pass

.myn-pill white on black 21:1, hover black on emerald 6.50:1. --emerald black on #14A36F 6.50:1, hover white on black 21:1. --outline black on white 21:1. All AA pass

See all cases

.myn-link #0B0B0B on white 19.68:1, hover #0B6B4B (--myn-emerald-text) on white 6.52:1, AA pass

Set of 3: 15% off, applied at checkout

.myn-offer #0B6B4B (--myn-emerald-text) on white, 13px: 6.52:1 AA pass

.myn-progress active #0B6B4B (--myn-accent on white) vs white 6.52:1, vs inactive #E6E4DF 5.13:1, UI 3:1 pass

Cursor square, 14px

.myn-cursor-demo #14A36F vs white 3.23:1, UI 3:1 pass (cursor only, never text)

Body text in emerald (--myn-emerald-text). Made to be handled every day, printed edge to edge.

#0B6B4B on white: 6.52:1 AA pass

Small text in emerald (--myn-emerald-text), 12px

#0B6B4B on white: 6.52:1 AA pass

Muted body text, #5F6368

#5F6368 on white 6.05:1, on #F2F1EE 5.36:1, AA pass

Black on warm grey tile

#000 on #F2F1EE 18.59:1 AA pass

Emerald text on warm grey tile

#0B6B4B on #F2F1EE 5.78:1 AA pass

Not used as text: #14A36F on white 3.23:1 (fails 4.5:1 body; large text or UI only)

Panel 2: on black

Emerald#14A36F · fills with black textBlack on it: 6.50:1 AA pass
Emerald bright#14A36F · accents on black#14A36F on black: 6.50:1 AA pass

EXPLORE THE WORKS

.myn-title, white on black: 21:1 AA pass

--white black on white 21:1, hover black on #F2F1EE 18.59:1. --emerald black on #14A36F 6.50:1. --outline white on black 21:1. All AA pass

See all cases

.myn-link white on black 21:1, hover #14A36F on black 6.50:1, AA pass

Set of 3: 15% off, applied at checkout

.myn-offer #14A36F on black, 13px: 6.50:1 AA pass

.myn-progress active #14A36F vs black 6.50:1, vs inactive #333 3.91:1, UI 3:1 pass

Cursor square, 14px

.myn-cursor-demo #14A36F vs black 6.50:1, UI 3:1 pass

Body text in emerald bright. Made to be handled every day, printed edge to edge.

#14A36F on black: 6.50:1 AA pass (on #0B0B0B: 6.09:1)

Small text in emerald bright, 12px

#14A36F on black: 6.50:1 AA pass

Not used as text: #0B6B4B on black 3.22:1 (fails 4.5:1 body). Use emerald bright on black.