Preview image. Unlock full-res
A Machinist's Blueprint. Precision and function are paramount, with every element serving a clear purpose on a clean, technical surface.
The design feels like a functional schematic on a stark white drafting table. Its nearly monochrome palette — #FFFFFF, #FAFAFA, #EAEAEA, #171717 — creates a utility-first atmosphere where user input is the only source of color. Typography is the main architectural element; a custom sans-serif is used everywhere, with tight negative letter-spacing at large sizes creating dense, impactful headlines. The UI is built from simple primitives: solid black CTAs with an 8px radius and subtly bordered white chips, distinguishing primary commands from secondary suggestions. Use GeistSans for all text, without exception. Apply aggressive negative letter-spacing to headings 24px and larger. Adhere strictly to the achromatic palette; all color comes from content, not chrome. Use 8px radius for buttons and 12px for cards and inputs. Use 1px solid #eaeaea for all visual dividers. Differentiate action hierarchy using fills and borders: solid for primary, bordered for secondary, text-only for tertiary. Maintain generous whitespace (min. 96px) between content sections. Do not introduce any saturated colors to the UI chrome. Do not use system fonts or other brand fonts. Do not use shadows on interactive elements like buttons or inputs; reserve them for cards. Do not use any border-radius values other than 6px, 8px, 12px, or 9999px (for pills). Do not use gradients or background images. Do not use bold (700+) font weights; rely on 600 weight and size for emphasis. Do not create dense layouts; prioritize clarity and space.
