Preview image. Unlock full-res
monochromatic editorial precision
Smiling Wolf employs a minimalist, high-contrast aesthetic reminiscent of print editorial design. A stark visual dialogue between near-black and off-white creates a sense of gravitas and directness. Typography, featuring custom fonts, is treated with precision, utilizing subtle letter-spacing adjustments and specific ligatures to convey detail and craft. The UI is largely monochromatic, relying on robust typographic hierarchy and precise spacing to define structure rather than color or extensive visual ornamentation. Components are understated, often presented as text-based interactive elements or subtle outlined cards.
Use Ink Black (#000000) for primary text on Paper White (#f7f3f0) backgrounds and Paper White (#f7f3f0) on Charcoal (#131713) backgrounds to maintain high contrast.
Apply Bagoss Standard letter-spacing: -0.0100em for all large headings (59px and 63px) to create a tight, editorial feel.
Maintain a default border radius of 4px for all interactive elements and media containers.
Implement consistent vertical spacing of 60px between major sections to ensure ample breathing room.
Use General Grotesque Mono with letter-spacing: 0.1000em for small utilitarian text like tags or meta information to enhance legibility at small sizes.
Utilize a ghost button style with a 1px Ink Black (#000000) border for secondary actions, avoiding filled buttons unless explicitly defined.
Avoid arbitrary color usage; stick to the defined black, white, and gray palette for UI elements.
Do not use generic sans-serif fonts for headlines; Bagoss Standard is essential for brand identity.
Resist adding unnecessary shadows or complex gradients; the design relies on flat surfaces and high contrast.
Do not vary border radii; a consistent 4px radius is applied across all shapely elements.
Avoid tight vertical spacing in sections; ensure a minimum sectionGap of 60px.
Do not introduce strong accent colors for interactive elements unless proven by explicit brand guidelines outside this system. The system uses achromatic feedback.
