Pentagram
Split Studio
Quiet, warm earth tones; precise sans-serifs; spacious, subtly textured minimalism.




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 | General Sans | 128px | 700 | 1 | -3.2px | Aa Bb Cc |
| h2 | General Sans | 34px | 700 | 1.1 | -0.86px | Aa Bb Cc |
| h3 | General Sans | 26px | 900 | 1.05 | -0.66px | Aa Bb Cc |
| body | General Sans | 16px | 400 | 1.5 | -0.16px | Aa Bb Cc |
| caption | General Sans | 14px | 400 | 1.43 | -0.16px | Aa Bb Cc |
| button | General Sans | 16px | 400 | 1.5 | -0.16px | Aa Bb Cc |
Max content width 1440px
:root {
--color-dominant: #968868;
--color-surface: #c8c1b0;
--color-ink: #4e4636;
--color-accent: #848474;
--color-detail: #c4bcaa;
}
/* CSS variables exposed by source */
:root {
--font-serif: "Newsreader","Newsreader Fallback";
--font-mono: "IBM Plex Mono","IBM Plex Mono Fallback";
--tw-ring-offset-shadow: 0 0 #0000;
--tw-ring-shadow: 0 0 #0000;
--tw-skew-x: 0;
--tw-shadow: 0 0 #0000;
--tw-translate-x: 0;
--tw-ring-offset-width: 0px;
--tw-scroll-snap-strictness: proximity;
--tw-border-spacing-x: 0;
--tw-scale-x: 1;
--tw-shadow-colored: 0 0 #0000;
--tw-border-spacing-y: 0;
--tw-scale-y: 1;
--tw-skew-y: 0;
--tw-ring-color: #3b82f680;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-ring-offset-color: #fff;
}Drop-in prompt
Build a landing page in the visual style of Home.
Reference design system (extracted from the live site):
- Palette: #968868, #c8c1b0, #4e4636, #848474, #c4bcaa
- Typefaces: General Sans
- Macrostructure: Split Studio
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/synapserstudio-com