§03 / PRESETS
REF: TG–DOC–03 · REV. 1.7
Presets
Tangent ships with five presets. Each preset is a set of theme settings and five color schemes stored under
presets in config/settings_data.json. Choose one in the theme editor under Theme settings as the theme style.TANGENT 1.7 / SHOPIFY OS 2.0 / UPDATED 2026-10-19
| Preset | Style name |
|---|---|
| Tangent | Editorial |
| Selvedge | Gallery |
| Muslin | Minimal |
| Asphalt | Studio |
| Lumen | Maison |
Comparison
Values marked in each preset page as "Theme default" come from config/settings_schema.json because the preset does not set them. The Tangent preset sets only fonts, heading line height, page width, page margin, section spacing, grid spacing and color schemes, so its other values are theme defaults.
| Setting | Tangent (Editorial) | Selvedge (Gallery) | Muslin (Minimal) | Asphalt (Studio) | Lumen (Maison) |
|---|---|---|---|---|---|
| Industry tag | Clothing and accessories | Clothing and accessories | Health and beauty | Clothing and accessories | Health and beauty |
| Catalog size | Large | Small | Small | Medium | Medium |
| Headings: Font | Archivo Narrow Bold (700) | Playfair Display Regular (400) | Montserrat Regular (400) | Oswald Bold (700) | Playfair Display Regular (400) |
| Headings: Size | 100% | 90% | 75% | 115% | 90% |
| Headings: Letter case | Uppercase | As typed | Uppercase | Uppercase | As typed |
| Headings: Letter spacing | 0% | -2% | 8% | 0% | 0% |
| Headings: Line height | 100% | 104% | 110% | 90% | 106% |
| Body: Font | Archivo Narrow Regular (400) | Raleway Regular (400) | Montserrat Regular (400) | Work Sans Regular (400) | Assistant Regular (400) |
| Body: Size | 15px | 15px | 15px | 15px | 15px |
| Labels: Letter case | Uppercase | Uppercase | Uppercase | Uppercase | Uppercase |
| Page width | 1600px | 1440px | 1440px | Full width | 1440px |
| Page margin | 48px | 32px | 32px | 32px | 32px |
| Space between sections | 100% | 100% | 100% | 100% | 100% |
| Grid spacing | 12px | 10px | 16px | 4px | 16px |
| Primary button style | Solid | Solid | Outline | Solid | Solid |
| Button corner radius | 2px | 0px | 24px | 0px | 24px |
| Input corner radius | 2px | 0px | 12px | 0px | 12px |
| Button letter case | Uppercase | As typed | Uppercase | Uppercase | As typed |
| Product image background | #F2F2F2 | #E8E2D8 | #F2F2EF | #1C1C1C | #F4EAE5 |
| Image ratio | Portrait (4:5) | Tall (2:3) | Portrait (4:5) | Portrait (4:5) | Portrait (4:5) |
| Hover effect | Zoom | Zoom | Zoom | Zoom | Lift |
| Text alignment | Left | Left | Left | Left | Center |
| Show star rating | Off | Off | Off | Off | On |
| Shape | Circle | Circle | Circle | Square | Circle |
| Scheme 1 background | #FFFFFF | #F1EDE6 | #FAFAF8 | #0E0E0E | #FBF6F3 |
| Scheme 1 text | #000000 | #2A2520 | #1F1F1F | #F2F2F2 | #2B1F1F |
| Scheme 1 panel background | #F6F6F6 | #E8E2D8 | #F2F2EF | #171717 | #F4EAE5 |
| Scheme 1 accent | #E2B232 | #8C5A3C | #D9CFC1 | #E2B232 | #E3B5AC |
Letter spacing is a percentage of the font size (for example, 8% renders as 0.08em).
What stays the same
All five presets use the same templates, the same header (sections/header-group.json) and the same collection filter setup. The only differences are the theme settings and color schemes above. See any preset page for details.
Last updated for Tangent 1.7