{"id":"04f6cb02-de90-4d78-9c5f-0eb52f826484","name":"Mike Matas","source":{"name":"Refero","url":"https://styles.refero.design/","kind":"public-design-reference"},"contributors":[{"name":"Refero","role":"reference-helper","url":"https://styles.refero.design/"}],"attributionLabel":"Referenced with help from Refero","sourceUrl":"https://styles.refero.design/style/04f6cb02-de90-4d78-9c5f-0eb52f826484","originalSiteUrl":"https://mikematas.com","capturedAt":"2026-04-11T16:39:06.283Z","colors":[{"name":"Canvas White","hex":"#FFFFFF","role":"Page backgrounds, overall dominant background. Provides a pristine, high-contrast surface for text.","group":"neutral","cssVariable":"--color-canvas-white"},{"name":"Ink Black","hex":"#000000","role":"Primary text, headings, icons, interactive elements. Represents the core informational content.","group":"neutral","cssVariable":"--color-ink-black"},{"name":"Muted Gray","hex":"#999999","role":"Secondary text, subtle details, meta-information. Lowers the visual prominence without losing readability.","group":"neutral","cssVariable":"--color-muted-gray"}],"typography":[{"role":"The sole typeface, spanning all content from body text to headlines. The use of a custom sans-serif with a prominent thin (100) weight for main branding sets a tone of quiet sophistication and technical precision.","sizes":"18px, 20px, 40px","family":"Lab Grotesque","weight":"100, 400, 600","lineHeight":"1.20","substitute":"system-ui, sans-serif","letterSpacing":"normal"}],"spacing":{"radius":{"none":"0px"},"elementGap":"","sectionGap":"","cardPadding":"","pageMaxWidth":"900px"},"radius":{"none":"0px"},"guidelines":{"do":["Prioritize text as the primary visual element; every textual unit should be considered and precise.","Maintain a high-contrast ratio between Ink Black (#000000) text and Canvas White background.","Use Lab Grotesque consistently across all type roles, adhering to specified weights and sizes.","Employ generous negative space, particularly horizontal and vertical margins (72px, 36px), to create a sense of calm and focus.","Use a 0px border-radius for all elements, maintaining crisp, sharp edges.","Confine body and main content to a max-width of 900px, centered on the page."],"dont":["Avoid decorative elements, borders, or background colors that detract from body copy or visual clarity.","Do not introduce additional typefaces or weights beyond Lab Grotesque 100, 400, 600.","Refrain from using shadows or gradients; depth is achieved primarily through spacing and content hierarchy.","Do not use color for emphasis; use changes in type size, weight, or the Muted Gray (#999999) secondary color.","Avoid unnecessary icons or imagery that don't directly convey essential information.","Do not break the strict achromatic palette with any brand or accent colors on the main content page."]}}