The HUBIQ theme.

The values and house laws that make a site look like HUBIQ. Part of hiq-design, branch v2. The shared rules every theme follows are in hiq-core-design.md; how a theme plugs into the kit, and the contract every theme must meet, is KIT.md section 0. The values themselves are in theme.css, beside this file.

Used by hubiq.co.uk (hubiq-web-v2) and atomiq.digital (atomiq-web). ATOMIQ's leased green is the house green, so ATOMIQ wears this theme rather than one of its own.

Everything below was moved here unchanged from hiq-core-design.md section 1 on 23 October 2026, when the system split into a shared core and themes. It reads as it did: "our ink", "the house green" and "the system" mean HUBIQ's.

---

Ground and text (dark, the shipped system)

--ink:    #000614;              /* page ground; also the foreground on an accent fill, nowhere else */
--panel:  #040B1C;              /* raised surfaces, drawer, dropdown, field containers */
--paper:  #EEF3FA;              /* primary text — the one full-contrast voice per surface */
--muted:  #98A6BC;              /* body copy and leads — the default reading colour */
--muted2: #8494AC;              /* meta, mono labels, captions. Never a full paragraph */
--line:   rgba(226,238,255,.08);/* hairlines, card borders. Decorative only, cannot carry state */
--line2:  rgba(226,238,255,.16);/* stronger dividers, section breaks, field borders */
--wash:      12%;               /* accent wash strength */
--wash-fade: 68%;               /* accent wash fade stop */

Two surfaces, four text values: that was the v1 rule, and on a v1 page it still holds. v2 replaces it with the ground ladder below. A v2 page changes ground in chapters, and each ground carries its own four roles.

Grounds, v2

Added at 3.0. The light grounds lean blue, towards our ink (hue 255 against the ink's 253), rather than sitting neutral. Values in theme.css, beside this file.

Ground	Token	Hex	When
Paper	--ground-paper	#F1F5FA	The default reading ground. Heroes, arguments, anything with a long read.
Mist	--ground-mist	#DEE3EB	The second light chapter: inventories, stat rows, a ground ladder.
Grey	--ground-grey	#CAD2DC	Column bands, where the columns are the content (cards).
Grey deep	--ground-grey-deep	#ACB5C1	The darkest light ground. A call to action, often over the lattice (7.26).
Ink	--ground-ink	#000614	The drama chapter: display words, figures, the footer.
Panel	--ground-panel	#040B1C	Raised surfaces on ink, as before. Never a chapter of its own.
Forest	--ground-forest	#1B330B	The house-green chapter. Chosen over olive #3F6B0A on 25 September 2026: on olive only paper text passed and a green line fell to 4.64:1.
House	--house	#A9F20C	The anchor: house green as a whole band, the page's one moment of full colour (Gideon, 7 October 2026, the Foundry's "why now"). Once a page at most. Ink on it, 14.86:1; ink-body 8.59:1; ink-label 7.36:1. Hairlines are ink. Nothing green is drawn on it, so the mark inverts: an ink fill, green words.

Never the same ground twice in a row. Sections separate by ground, so two adjacent bands on one ground read as one band. A page usually runs light, light, ink, light, green, ink, with the footer on ink.

The text roles on each ground

Every ground sets the same four roles, --fg, --body, --label and --rule, so a component written against the roles works on any ground.

Ground	Heading --fg	Running text --body	Label --label	Hairline --rule
The four light grounds	--ink	--ink-body #2C394A	--ink-label #364355	--rule-light, ink at 16%
Ink, panel	--paper	--muted	--muted2	--rule-dark, or --house
Forest	--paper	--muted	--muted (muted2 is 4.47:1 here, a fail)	--rule-dark, or --house

--ink-body and --ink-label were chosen on the darkest light ground, grey deep, where they measure 5.66:1 and 4.85:1, so they pass on all four without a per-ground override. Ratios for every pairing are in section 11.

--lead-start #6D7C8F is the grey a scrubbed lead begins from (section 5). It is 3.89:1 on paper and 3.30:1 on mist: large text only, those two grounds only, and never a resting state.

The green rule

House green #A9F20C is the single accent, and v2 puts it on light grounds for the first time. On those it measures 1.06 to 1.52:1, which cannot carry a line, a label, a border or a focus ring. So:

• On a light ground, green is a fill. Pill buttons, the lattice's dots, a large solid mark. Anything sitting on the fill is ink (14.86:1). Structure is ink hairlines.
• On ink, panel and forest, green may be the line. Column rules, bullets, the scroll cue, a figure's strokes: 14.86:1 on ink, 10.09:1 on forest. This is where "neon lines providing structure" lives.
• Deep green #3F6B0A as text: 5.78:1 on paper, 4.91:1 on mist, and a fail on grey. Paper and mist only.

No yellow, anywhere. The reference site's accent was yellow; ours plays the same role.

The second highlight: 5Di

--house-2, orange #F78A20, added 7 October 2026 (Gideon). It is reserved for 5Di: wherever 5Di and its five dimensions appear, they carry it, so the method reads as one thing across pages. The 5Di mark, the five dimension nodes, the five words lit in a line of copy, and the ring that holds them. Green stays the house accent; nothing but 5Di takes orange, and orange is not leased to an initiative while it holds this role.

It follows the green rule exactly. On ink and forest it may be a line or text (8.31:1 on ink, 5.65:1 on forest). On a light ground it is a fill only (2.19:1 on paper), with ink on it (8.31:1); text there takes its deep pair #8A4600. Lighting a part in it is 7.32 with --lit-to: var(--house-2).

Never blend green into orange. Every blend between the two passes through yellow, which the system bans. When a part changes from one to the other, swap at a moment it shows no colour: edge-on in a flip, or faded out. The Foundry's 5Di key flips (7 October 2026).

Why orange and not a blue: every blue is leased (MEDIQ cyan, SITEIQ indigo), so a blue 5Di would read as an initiative on any surface that lists them. Known clash, unresolved: the TRAFFIQ form-error fallback is also orange (see Forms).

QUIET is content, not chrome

QUIET #A8B6CC marks an initiative that is real, funded in thinking, and waiting for a leader. It is a vacancy notice, not a disabled state and not a lower tier of ambition.

Consequence: grey may never be used for chrome, disabled controls, or a decorative wash. Disabled uses --muted2 at reduced weight plus aria-disabled, never QUIET.

Contrast, measured

The full table of ratios for this theme is hiq-core-design.md section 11, which was written against these values. The build checks the pairings the kit relies on, from theme.css, every time a site builds.