Otter dark mode, three tiers

Same component, same text sizes, three surface lightnesses. Nothing below inverts or filters the page, so avatars and screen captures keep their true colour. Contrast figures are measured from the token values with the WCAG 2.1 formula.

PREPARED BY CHRISTIAN SASS · BINARY RANCH · CSASS@BINARYRANCH.COM · 2026-10-27
Otter
Record
Today, Oct 27

Weekly product sync

10:53 AM · 38 min

The team walks through the revised onboarding flow and agrees to drop the second step, which was tripping up first-time users on mobile.

Design review

9:15 AM · 42 min

Shipping the client build Thursday. The remaining blocker is the mail server certificate.

Priya
The certificate is already staged in staging. I can rotate it before the demo if we get the window.
Midnight#000000
OLED panels and late-night reading
Body 17.6:1Secondary 8.8:1Button 7.8:1
Otter
Record
Today, Oct 27

Weekly product sync

10:53 AM · 38 min

The team walks through the revised onboarding flow and agrees to drop the second step, which was tripping up first-time users on mobile.

Design review

9:15 AM · 42 min

Shipping the client build Thursday. The remaining blocker is the mail server certificate.

Priya
The certificate is already staged in staging. I can rotate it before the demo if we get the window.
Dusk#101216
Default, mixed lighting
Body 15.4:1Secondary 8.3:1Button 8.4:1
Otter
Record
Today, Oct 27

Weekly product sync

10:53 AM · 38 min

The team walks through the revised onboarding flow and agrees to drop the second step, which was tripping up first-time users on mobile.

Design review

9:15 AM · 42 min

Shipping the client build Thursday. The remaining blocker is the mail server certificate.

Priya
The certificate is already staged in staging. I can rotate it before the demo if we get the window.
Slate#1B1F24
Bright rooms and daytime
Body 14.3:1Secondary 8.5:1Button 9.3:1