Colour

These are the 11 colour values the site defines, read from the token file in the order it declares them. Every other colour on the site is a mix of these tokens. Each chip is painted with the live token; under it is the contrast of that colour against paper and against ink, graded as normal-size text.

Ratios are floored to two decimals. For normal-size text AA means at least 4.5:1 and AAA at least 7:1; Fail means below 4.5:1. A line or a surface is not meant to pass as text: the role under each chip says what the token is for.

Four roles cover the palette: ink, a warm neutral ramp, one accent family and raw. Each role is shown in use, with its tokens and their OKLCH coordinates, computed from the hex values in the token file.

Two colours carry meaning beyond structure. accent is the one verified signal. In the evidence scenes raw is everything that changed and has not been verified. The token file gives the reason raw exists: with a single colour for meaning, a scene that shows noise and signal reads as a one-colour chart.

Never colour alone.

accent and raw are close in lightness, OKLCH L 0.553 and 0.517, and the contrast between them is only 1.30:1. What separates them is hue. So the scene also separates them by direction, by the shape of the marks and by a label on every mark, and a reader who cannot tell the two hues apart still reads the scene. On a narrow screen the labels move into the key.

The evidence paints the verdict.

The decision scene on the Zero Door page draws one case and leaves its colour to the evidence. The pill is born as an outline in ink-subtle, with no word in it. Each of the 3 failed checks fills one more equal part of it with raw. Each of the 3 neutral checks, which find nothing either way, leaves a notch in ink-subtle on its top edge and adds no colour. As the last part fills, the outline turns raw, and only then does the word, Suspicious, open in paper. raw is never painted before the evidence that earns it.

Every ratio here is computed at build time from the token values with the WCAG 2.x formula and floored to two decimals, so a pair that misses a threshold never displays as passing. The first table lists the main token-on-token text pairs in use, with the file that sets them.

Under the line

ink-subtle on accent-tint reaches 4.44:1, under 4.5:1, so wherever text sits on accent-tint it is ink, ink-muted or accent-deep. Paper on accent reaches 4.38:1, which is why the primary button is filled with accent-deep. Every pair in use reaches 4.5:1, so each of them also passes AAA for large text.

Text on mixed backgrounds

Some backgrounds are not tokens but a token mixed with paper, written in place with color-mix in OKLab. The ratios below are computed from the same expression the component writes, and a test reads that expression from the file.

Lines and the focus ring

Non-text contrast asks for 3:1 where a line or a shape is needed to understand or operate the page. The focus ring is a 2px accent outline, and it clears 3:1 on every surface it can land on, ink included. The fields of the site's forms, in the contact form, the call-to-action band and the glossary filter, have an ink-subtle border, which clears 3:1 against the field's own paper fill and against the paper-2 and accent-tint around it. The hair divider does not reach 3:1, and we do not claim it: it separates content, and the content carries its own meaning in text.

The site has one theme, and it is light. Ink appears as a local panel: the security.txt file in the Trust centre, the hex dump in research, the proof strip on the Zero Door page, tags and stamps on figures. On ink, text is paper; secondary text is mixed from paper and ink; highlighted text is accent-tint. The hex dump is the exception: it marks matched bytes with a raw mix and draws its scan line in accent.

# Zerone Security vulnerability reporting (RFC 9116)# Please do not report security issues in public channels.Contact: mailto:security@zeronesecurity.comEncryption: https://zeronesecurity.com/.well-known/pgp-key.txtAcknowledgments: https://zeronesecurity.com/trust#acknowledgementsPolicy: https://zeronesecurity.com/trust#disclosureExpires: 2027-09-01T00:00:00.000ZPreferred-Languages: en, trCanonical: https://zeronesecurity.com/.well-known/security.txt

Mixed, not tokenised.

No token exists for text on ink, and no mix scale is defined. Each panel derives its steps inline as color-mix(in oklab, var(--color-paper), var(--color-ink) N%); the steps below are the ones in use, each checked against the file that writes it. Text steps run from N = 25 to N = 45, and the weakest of them still reaches 5.17:1 on ink. Higher steps are dots and divider lines, never text.

On ink, the accent is the tint.

On a dark panel the copper green that carries text is accent-tint, at 15.07:1. accent reaches only 3.78:1 on ink and accent-deep 2.49:1, so neither carries text there. accent still draws the focus ring and the hex dump's scan line on ink, where 3:1 is what a line needs.

All three pairs follow one rule, and a test holds it: no component sets text in accent. The primary button also states its half of the rule in a comment: accent-deep, not accent, behind paper text. Button text is 14px at weight 600, which WCAG treats as normal-size text, so 4.5:1 applies.

Filled buttons

Small copper-green text

Highlighted text on ink

The shared controls define their hover and focus states once, in the site stylesheet. Each one is shown below in its forced state, painted with the rule the stylesheet writes, with the ratio of its text on its background. Hover never changes a button's text colour, and focus is the same 2px accent ring on every element. The site stylesheet sets it 3px off the element, and some components set their own offset (see Accessibility).

The primary button's hover darkens accent-deep by mixing it with ink. The ink button's hover lightens ink towards paper, the ghost button's hover fills it with paper-2 and a link's hover turns its text accent-deep.

The tokens are declared once, in a Tailwind @theme block that first wipes the default palette. Components read them with var(--color-name) in their own scoped styles.

@theme {
  --color-*: initial;
  --color-transparent: transparent;
  --color-current: currentColor;
  --color-paper: #fdfaf6;
  --color-paper-2: #f6f3ee;
  --color-hair: #e2dfdb;
  --color-hair-2: #cdcac6;
  --color-ink: #0f1c26;
  --color-ink-muted: #5c5753;
  --color-ink-subtle: #736d69;
  --color-accent: #00847e;
  --color-accent-deep: #006560;
  --color-accent-tint: #d9f5f3;
  --color-raw: #a9432c;
}

body {
  background: var(--color-paper);
  color: var(--color-ink);
}

.btn-ink {
  background: var(--color-ink);
  border-color: var(--color-ink);
  color: var(--color-paper);
}

.link:hover {
  color: var(--color-accent-deep);
}

The @theme block also generates utility classes such as text-ink-muted and bg-paper-2. No component uses them today: every colour in a component is a var(--color-*) reference or a mix of them. Where a component needs a step the palette does not have, it mixes one in place with color-mix in OKLab, as the dark panels do.

Download the token file, tokens.css

A rule on this page is either checked by a test that runs on every change or labelled as one that review keeps.

• The 11 colour values are pinned.

  WhyA colour changes only on purpose. The test lists every token with its exact value, so changing the palette means changing the test, in review.

  TestEnforced by a test on every change.

• No pure black or white in the token file.

  Whyink and paper stand in for them: the cool ink and the warm paper are part of how the language looks. The test rejects the hex forms, the keywords and the rgb() and oklch() forms of both.

  TestEnforced by a test on every change.

• No pure black or white in any shipped stylesheet.

  WhyThe gate reads every CSS file in the build output and the inline <style> blocks of every HTML page, one declaration at a time. It catches the keywords black and white, hex in three, four, six or eight digits, the rgb(), hsl(), hwb(), lab(), lch(), oklab(), oklch() and color() forms and the colours inside inline SVG images. A fully transparent colour does not count. One framework default, Tailwind's ring-offset colour, is excluded in the two places it is declared. Inline style attributes are not read: the design pages paint the product's own colours there.

  TestEnforced by a test on every change.

• The default Tailwind palette is reset.

  WhyWith the palette wiped, the stock colour utilities, such as bg-red-500, do not exist. An arbitrary value in a class name would still work; no component writes one.

  TestEnforced by a test on every change.

• Copper-green text uses accent-deep, never accent.

  Whyaccent-deep holds 4.5:1 on paper and on paper-2; accent does not (4.38:1 on paper). The test reads every component and stylesheet and fails if any of them sets text, or SVG text, in accent. It skips only the components of these design pages, which draw the counter-examples on purpose.

  TestEnforced by a test on every change.

• Each text pair in the contrast tables is checked against the rule that sets it.

  WhyThe tables are data, and the test reads the same data. It finds the rule that sets the text colour and the rule that sets the background in the file the table cites, and checks the ratio: pairs in use reach 4.5:1, and the pairs under the line stay under it. A citation that stops being true fails the run.

  TestEnforced by a test on every change.

• axe finds no contrast violation on any page.

  WhyToken ratios are half of the work. axe checks every built page as it renders, where text sits on the surface it really has, and the run must end with zero violations. axe does not see text inside figures marked as images, such as the decision scene and the hex dump; for those, the tables on this page are the check.

  TestEnforced by a test on every change.

• Components never write a literal colour value; they use var(--color-*).

  WhyOne source means a token change reaches every component. Token values are copied only where the token file cannot be read: the browser theme colour, the build-time social card renderer, the logo SVG files and the record list of the separately deployed form service. The resources page lists those files, and a test keeps the list complete.

  ReviewKept by review, not by a test.

• Colour is never the only signal.

  Whyaccent and raw differ mainly in hue, only 1.30:1 apart in luminance. Scenes separate them by direction, mark shape and a label as well, so the meaning survives without colour.

  ReviewKept by review, not by a test.

The Zero Door interface speaks the calm register of the same language. It has its own tokens, written in OKLCH, with a light and a dark theme, and it opens in the dark theme. Below are 10 of its 15 colour tokens, with the values in its token file, which last changed on 2026-08-23. Contrast is computed here against the three surfaces of each theme.

The light theme

The dark theme

Brand as link text

brand also colours links in the interface. In the dark theme it reaches 4.36:1 on the raised surface, under 4.5:1. Neither the product's contrast test nor the check here lists brand, so the swatch above shows the miss instead of hiding it.

Where the two meet.

Of the product's light tokens, 6 resolve to exactly the same sRGB value as a site token; the table computes it from both files. Primary text is where they part: the site sets it in ink, the product in a warm near-black, and the product keeps its brand colour, close to the site ink, for actions.

Download the product token snapshot, product-tokens.json

Borders are hairlines.

The product's border tokens are hairlines, like the site's, and sit well under 3:1 against the surface: 1.27:1 in the light theme and 1.35:1 in the dark one. We do not claim 3:1 for them.

• The product's text and signal tokens reach 4.5:1 on all three surfaces, in both themes.

  WhyThe values on this page are a synced snapshot of the product token file. The test re-checks the snapshot for fg, fg-muted, fg-subtle and the four signal colours, so a sync that breaks one of those pairs fails here as well as in the product. brand is not on the list.

  TestEnforced by a test on every change.

• No 3:1 claim for product borders.

  WhyThe test pins the border token under 3:1 against the surface, so a page that claimed otherwise would contradict a passing test.

  TestEnforced by a test on every change.

• Chart series that are not severities never borrow the severity colours.

  WhyThe product token file keeps a separate categorical palette for them and says why: two neighbouring charts would otherwise paint a high alert and a modified file the same amber.

  ReviewKept by review, not by a test.