DesignX
Core@paxeer/core/typographyimplemented

LTWave typography

LTWave and LTWaveMono typeface hooks. Font files are optional; CSS variables are required.

tokens

Install

$pnpm exec designx add @paxeer/core/typography

Source code

styles/designx-typography.csscss
/*
  DesignX typefaces
  Brand / plain: LTWave
  Mono: LTWaveMono
  Font files are optional — drop woff2 files next to this CSS or rely on local()/fallback.
*/

@font-face {
  font-family: "LTWave";
  src: local("LTWave"), local("Inter"), local("Geist");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "LTWaveMono";
  src: local("LTWaveMono"), local("Geist Mono"), local("ui-monospace");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  --md-ref-typeface-brand: "LTWave", var(--font-ltwave-fallback, ui-sans-serif), system-ui,
    sans-serif;
  --md-ref-typeface-plain: "LTWave", var(--font-ltwave-fallback, ui-sans-serif), system-ui,
    sans-serif;
  --md-ref-typeface-mono: "LTWaveMono", var(--font-ltwave-mono-fallback, ui-monospace),
    monospace;

  --md-sys-typescale-display-large-size: 3.5625rem;
  --md-sys-typescale-display-medium-size: 2.8125rem;
  --md-sys-typescale-display-small-size: 2.25rem;
  --md-sys-typescale-headline-large-size: 2rem;
  --md-sys-typescale-headline-medium-size: 1.75rem;
  --md-sys-typescale-headline-small-size: 1.5rem;
  --md-sys-typescale-title-large-size: 1.375rem;
  --md-sys-typescale-title-medium-size: 1rem;
  --md-sys-typescale-title-small-size: 0.875rem;
  --md-sys-typescale-body-large-size: 1rem;
  --md-sys-typescale-body-medium-size: 0.875rem;
  --md-sys-typescale-body-small-size: 0.75rem;
  --md-sys-typescale-label-large-size: 0.875rem;
  --md-sys-typescale-label-medium-size: 0.75rem;
  --md-sys-typescale-label-small-size: 0.6875rem;
}

Dependencies

Registry dependencies