Slate Harbour

Reference

Design system

Every ratio was computed with tools/a11y/contrast.py against all three grounds. This page is noindex: it documents the template for whoever builds with it.

The team is a list, not a grid of faces

Nine people, each with a “come to me for” sentence instead of a job title. A headshot tells a visitor nothing about who to email and a title tells them slightly less than the sentence does. This is also the third template running with no photographs, and the reason differs each time: day 108's game was fictional, day 109's screen slots are drawn briefs, and here the missing images are portraits of nine people who do not exist — stock faces as fake employees would be inventing identities rather than inventing a product.

Schema.org, third mapping in three days

Days 103–108 settled for Person plus a Wikidata additionalType because schema.org models no freelance creative discipline. Day 109 is a VideoGame with a real offers block. This is an Organization with foundingDate and numberOfEmployees. Picking the type from what the page actually is, rather than inheriting whatever the scaffold carried, is a per-template decision every time.

Paid and unpaid are words first

Each crunch entry prints “Paid” or “Unpaid” as text with a glyph from a data-glyph ::before, and only then takes a colour. --mark-good and --mark-bad are separate from the accent, because on a record of when a studio asked people to work late, “unpaid” must not share a colour with a heading.

The uncomfortable sections are the load-bearing ones

Published bands, a dated crunch record including the unpaid one, and five things the studio cannot offer. All three are checkable claims, which is the only kind worth putting on a careers page — “we do not crunch” is unverifiable, and “three times in seven years, here is when, one of them was our own fault” is something a candidate can hold you to at an interview.

Type

Besley — slab display

Commit Mono — $102k – $124k · 6 weeks

Body is Geologica. The mono carries the bands, the dates and the week counts, which have to align down a column. None of the three appears in days 1–109.

Tokens

Colour tokens with measured contrast ratios
SwatchTokenValueMeasured
--color-bg #FBF9F4 Warm cream
--color-bg-alt #EFEBE1 Banding
--color-surface #FFFFFF Cards
--color-text #1A1814 16.85 / 14.89 / 17.73:1 · AAA
--color-text-muted #706A5F 5.10 / 4.51 / 5.36:1 · AA
--color-border #8F8676 3.42 / 3.02 / 3.60 — non-text only
--color-accent #4D7413 Hue 84 — 5.22 / 4.61 / 5.49:1 · AA
--mark-good #267197 Paid — 5.13 / 4.53 / 5.40:1
--mark-bad #A33417 Unpaid, cannot offer — 6.52 / 5.76 / 6.86:1
--color-band #1A1814 Inverted band
--color-on-band #FBF9F4 16.85:1 on band · AAA
--color-on-band-muted #A9A398 7.07:1 on band · AAA
--color-accent-on-band #81BA2C 7.59:1 on band · AAA

The border token clears 3:1 against all three grounds, which is what WCAG 1.4.11 asks of a non-text boundary. It is never used for text.