Skip to content
WindgramDocs

Defaults and tokens

Windgram ships one reference look. Configure scene behaviour through SceneOptions and visual values through the renderer’s --wg-* CSS tokens.

build-reference-scene.ts
import type { WindgramProfile } from "windgram/contract";
import { buildScene, DEFAULT_OVERLAYS } from "windgram/scene";


export function buildClubScene(profile: WindgramProfile) {
  return buildScene(profile, {
    timeZone: profile.site.timeZone ?? "Etc/UTC",
    smooth: false,
    overlays: {
      ...DEFAULT_OVERLAYS,
      thermalIndex: true,
    },
  });
}

DEFAULT_OVERLAYS exposes the package defaults when a control must enumerate every layer. Omit overlays when the reference defaults are sufficient.

Read token authorities

Section titled “Read token authorities”

windgram/svg exports four maps:

  • TOKEN_DEFAULTS contains every non-stability renderer token;
  • STABILITY_TOKEN_DEFAULTS contains the ordered eight-class stability ramp;
  • SERIES_TOKENS maps key-entry ids to the token that themes each line ("wg-series-cloud-base" → cloud-base); and
  • FIELD_STYLE_DEFAULTS carries each field-overlay class’s fill token and opacity for legend chips built outside SVG.

Token keys omit the CSS prefix: surface maps to --wg-surface, and stable maps to --wg-stab-stable. Read the maps for legends and swatches; override CSS custom properties on an ancestor for a downstream presentation. This page does exactly that — every default below is imported from the package when the site builds:

Every default, read from the package

Token keys omit the CSS prefix: surface maps to --wg-surface, stable to --wg-stab-stable.

The package's exported defaults rendered as swatches and values: the 8-class stability ramp, all 65 renderer tokens, the CAPE class thresholds, and which of the 26 overlays default on.

Stability ramp — STABILITY_TOKEN_DEFAULTS

  • very-unstable#d95f52
  • unstable#de8f3a
  • conditional-strong#c67eb6
  • conditional#aeaad9
  • near-neutral#d7b29b
  • stable#768bb9
  • inverted#9aa19d
  • strong-inversion#b3b9b6

Scene defaults — DEFAULT_CAPE_CLASSES · DEFAULT_OVERLAYS

CAPE strip classes: watch from 300, risk from 800, severe from 1500 J/kg; a cell dims when CIN ≤ -50 J/kg.

Overlays defaulting on (20): temperature, wind, clouds, thermalStrength, stability, cape, gusts, pblHeight, cloudLayers, smoke, observedIrradiance, observedAot, pressure, precipitation, boundaryLayerTop, cloudBase, usableLiftTop, launch, selectedHour, surfaceTemperature.

Defaulting off (6): thermalIndex, windShear, buoyancyShear, dewPoint, relativeHumidity, verticalVelocity.

Renderer tokens — TOKEN_DEFAULTS (65)

  • Aafont"IBM Plex Sans", ui-sans-serif, system-ui, sans-serif
  • Aafont-mono"IBM Plex Mono", ui-monospace, monospace
  • Aatext-strip-name10.5px
  • Aatext-strip-unit9.5px
  • Aatext-strip-scale8px
  • Aatext-row-tag7.5px
  • Aatext-tick10.5px
  • Aatext-hour-tick11px
  • Aatext-gust9.5px
  • Aatext-series-label10.5px
  • Aatext-launch10.5px
  • Aatext-surface-temp9.5px
  • Aatext-key-title9px
  • Aatext-key-boundary8px
  • Aatext-key-group8px
  • key-group-ink#ffffff
  • key-group-halo#00000066
  • surface#fffdf8
  • strip-bg#f2f4f1
  • rule#776956
  • ink#152529
  • ink-soft#2f454a
  • ink-mute#40565a
  • halo#fffdf8
  • halo-seriestransparent
  • halo-barb#355963
  • accent#913b0c
  • selection#913b0c
  • temp#913b0c
  • pressure#963f36
  • rain#207a83
  • cloud#5b6969
  • lift#9a7500
  • bs#6d597a
  • cape#8a4a08
  • cape-calm#dde3d5
  • cape-watch#e7c46c
  • cape-risk#d98243
  • cape-severe#c04f3a
  • gust#355963
  • pbl#56609b
  • smoke#8c5a3c
  • sun#b07a1a
  • sun-dim#43404a
  • ti-weak#f4e3c0
  • ti-fair#ecc57e
  • ti-good#de9b4e
  • ti-strong#c96a33
  • shear-light#cfc3de
  • shear-moderate#a58ec4
  • shear-strong#7b5ea7
  • rh-60#d3e0e3
  • rh-80#a9c7cf
  • rh-95#7fadbb
  • omega-lift#8dc2a0
  • omega-lift-strong#56a377
  • omega-sink#d3a68f
  • omega-sink-strong#bd7d5c
  • boundary#a46b10
  • cloud-base#355963
  • cloud-marker#f8f3d8
  • usable#2179ad
  • freezing#2b748f
  • dewpoint#3a7d4f
  • wind#ffffff
Rendered at build time from TOKEN_DEFAULTS, STABILITY_TOKEN_DEFAULTS, DEFAULT_CAPE_CLASSES, and DEFAULT_OVERLAYS. A release that changes any default changes this figure with it.Units colors hex · type sizes px · CAPE J/kg
stability-swatches.ts
import { STABILITY_TOKEN_DEFAULTS } from "windgram/svg";


export const stabilitySwatches = Object.entries(STABILITY_TOKEN_DEFAULTS).map(
  ([name, color]) => ({ name, color }),
);

The reference renderer keeps the stability field pale so lines, markers, labels, and white wind barbs remain foreground. The stability-ramp research article records the measured palette constraints.

Display windows, overlay choices, CAPE classes, sink rates, and local colour overrides belong to the downstream publisher. Pass them directly to buildScene or the consuming stylesheet.