The Electrified Garage
- Pages (5)
- Style sheet
- Measured from 5 Pages
- Captured Oct 26, 2026
- Built with Custom code
Summary
Across 5 measured Pages: 8 colours, 2 typefaces and one corner radius. Not every Page uses all of them.
- Colours
- 8coloursBackground, Text, Accent and 2 more
- Typefaces
- 2typefacesMontserrat + Open Sans
- Base unit
- 8pxbase unit5 of 5 paddings on it
- Corner radii
- 1radiusPill
01 · Colour
Colour
Named by the job each colour does
The page behind everything
5/5 PagesMost of the text
5/5 PagesButtons and links
5/5 PagesBands and cards on the page
4/5 PagesBands and cards on the page
2/5 PagesSecondary text
2/5 PagesBands and cards on the page
1/5 PagesBands and cards on the page
1/5 Pages
Contrast
Text on background 5.6 : 1 · AA
Text on surface 3 : 1 · large text only
Accent on background 3 : 1 · large text only
02 · Type
Type
Drawn in the Site's fonts if your browser has them
Headings
Montserrat
The Electrified Garage
5/5 Pages
Body
Open Sans
The quick brown fox jumps over the lazy dog.
5/5 Pages
03 · Spacing
Spacing
Measured as drawn on the desktop Capture
Section padding
8px base · 5 of 5 on the grid
- 144px5/5 Pages
The typical space at the top of a Section, one value per Page.
04 · Radius
Radius
The corner most buttons, fields and cards share
Pill 5/5 Pages
05 · Export
Export
Take the system with you
/* Design tokens from The Electrified Garage (https://www.electrifiedgarage.com), https://designly.sh/style-sheets/the-electrified-garage, via Designly. Credit the business if you use them. */
:root {
--color-background: #F5F3EE;
--color-text: #59616B;
--color-accent: #FC5017;
--color-surface: #0A0F17;
--color-surface-2: #161F2C;
--color-muted: #202A37;
--color-surface-3: #18202A;
--color-surface-4: #0E1620;
--font-display: "Montserrat", sans-serif;
--font-body: "Open Sans", sans-serif;
--radius: 9999px;
--spacing: 8px;
--spacing-section: 144px;
}
Values only: Designly never copies a Site's font files or images. Fonts are named so you can license them.