Style guide

Design system.

Colour styles, text styles and components used across the template. Edit a style in Assets and every page updates.

Colour

Surface / Base

#0A0D12

Surface / Raised

#10161D

Surface / Elevated

#171F28

Text / Primary

#F3F6F8

Text / Secondary

#A6B1BC

Text / Muted

#788592

Brand / Accent

#63D8F2

Brand / Accent Soft

#A4EDF8

Brand / Accent Ink

#0A7590

Line / Dark

#28333E

Surface / Light

#F1F4F5

Text / Ink

#121A22

Typography — Inter + IBM Plex Mono

Display / Page

Engineered to keep

Heading / H2

Cooling infrastructure

Heading / H3

Liquid Cooling Systems

Body / Lead

Advanced liquid cooling and thermal infrastructure.

Body / Default

THERMGRID focuses on the cooling systems, engineered components and supporting infrastructure.

Label / Eyebrow

Engineered systems

Label / Fig

Fig. 06 — Liquid cooling loop

Buttons — one component, variants in the panel

Motion — layer-name tags

[reveal] [delay:N]

Fade-up on scroll; delay in milliseconds

[words]

Word-by-word mask reveal for headings

[decode]

Label text decodes like an instrument readout

[image] [parallax] [zoom]

Image clip reveal, scroll parallax, slow zoom

Reduced motion

All non-essential motion is disabled automatically