Standardvision
Marquee Hero




Click any value to copy. Roles are suggestions, not gospel.
Read off the live site. Treat it as reference, not a recipe.
| Role | Family | Size | Weight | Leading | Tracking | Sample |
|---|---|---|---|---|---|---|
| h1 | GD Trio Display | 179px | 400 | 0.88 | -1.7856px | Aa Bb Cc |
| h2 | GD Trio Display | 28px | 400 | 1.04 | -0.14px | Aa Bb Cc |
| h3 | GD Trio Display | 50px | 400 | 0.96 | 0 | Aa Bb Cc |
| body | GD Gaio VF | 16px | 400 | 1.2 | 0 | Aa Bb Cc |
| button | GD Gaio VF | 14px | 500 | 1 | 0 | Aa Bb Cc |
:root {
--color-dominant: #f4740a;
--color-surface: #f9b77f;
--color-ink: #5c2c04;
--color-accent: #7e6653;
--color-detail: #c6c4c2;
}
/* CSS variables exposed by source */
:root {
--secondary--steel: #2f3133;
--secondary--aluminium: #c0c3c3;
--secondary--titanium: #51585c;
--secondary--paper: #e9e9e2;
--secondary--concrete: #707575;
--secondary--leather: #131516;
--primary--white: #fcfcfc;
--primary--black: black;
--_sematic---text--teitrary: #707575;
--_button---button--text-hover: #fcfcfc;
--_ui---margins--scroll-offset: 2.625rem;
--_sematic---border--teitrary: #c0c3c3;
--_button---button--background: black;
--_sematic---background--secondary: #c0c3c3;
--_sematic---border--secondary: #707575;
--_button---button--text: #fcfcfc;
--_sematic---text--secondary: #51585c;
--_button---button--border-radius: 2px;
--_sematic---background--teitrary: #707575;
--_button---button--bg-hover: #2f3133;
--_ui---margins--main: 1rem;
--_ui---margins--gutter: .75rem;
--_sematic---background--primary: #fcfcfc;
--_sematic---border--primary: black;
--_sematic---border--transparent: #0000;
--_state---interaction: 0;
--_sematic---text--primary: black;
}Drop-in prompt
Build a landing page in the visual style of NGLM · Companies.
Reference design system (extracted from the live site):
- Palette: #f4740a, #f9b77f, #5c2c04, #7e6653, #c6c4c2
- Typefaces: GD Trio Display, GD Gaio VF
- Macrostructure: Marquee Hero
Use the dominant colour for surfaces, the accent sparingly,
and lean on type weight + scale rather than colour for hierarchy.
Full DESIGN.md: https://inspomcp.dev/api/design/nglm-com--companies