thisdesign.space

5 colours · dark

Halation cinema

Deep film black + cream paper + warm halation bleed.

From the halation design — film stock at low light. The ground is a deep film-black (not pure black, slightly warm). Cream paper is the foreground for type. The red halation glow leaks around bright highlights; the orange is the light-leak version of the same colour. Use for portfolios with photography, or for any sheet that should feel late-evening and cinematic.

Swatches · click any hex to copy

bgFilm black
inkCream paper
accentHalation red
highlightLight leak
mute

In use · the palette applied to three mocks

Chapter 01

A confident heading set in the ink.

Body text runs in the ink-2 role at a comfortable measure. Accent earns its keep on links and nowhere else.

Aside · in the mute

Card

Sample card with a strong call to action.

Short supporting text that explains what the action does.

PrimarySecondary →
~/notes.md
function greet(name) {
  // the lab said hi
  return `hello, ${name}`;
}

Contrast · WCAG 2 ratios for key role pairs

PairSampleRatioRating
bginkSample text15.77 : 1AAA
bgaccentSample text4.65 : 1AA
bgmuteSample text2.70 : 1fail

AAA ≥ 7 · AA ≥ 4.5 · AA Large ≥ 3 · fail < 3

Exports · copy-paste ready

CSS variables

:root {
  --bg: #0A0807;
  --ink: #EAE4D6;
  --accent: #C9554D;
  --highlight: #E07A52;
  --mute: #5A554D;
}

Tailwind config

// tailwind.config
theme: {
  extend: {
    colors: {
      "bg": "#0A0807",
      "ink": "#EAE4D6",
      "accent": "#C9554D",
      "highlight": "#E07A52",
      "mute": "#5A554D",
    },
  },
},

Hex array

["#0A0807", "#EAE4D6", "#C9554D", "#E07A52", "#5A554D"]

Links