Bastien Allard

Bastien Allard's design system creates a 'digital canvas' aesthetic: a stark white background accented by deep black typography and subtle greys, evoking the precision of architectural blueprints. The dominant characteristic is a compact, dense arrangement of content, with an emphasis on strong typographic forms. UI elements are rendered with fine borders rather than heavy fills, giving an airy yet structured feel. The visual language prioritizes information density and clarity through a high-contrast monochrome palette, with subtle hints of interaction through border changes, suggesting a lean, content-focused experience. Prioritize high contrast between text and background: use Midnight Graphite (#000000) or Storm Gray (#333333) on Canvas White (#ffffff). Maintain a compact information density across layouts, minimizing excessive whitespace between content blocks. Use subtle border treatments for interactive elements: 1px solid borders in Silver Haze (#e5e5e5) or Storm Gray (#333333) for states and definitions. Apply Diatype Variable (or Inter) at 16px for all primary body text, ensuring consistent weight 540. Keep all corners sharp with a 0px border-radius, reflecting a precise, structured aesthetic. Use Midnight Graphite (#000000) for all prominent headings and labels to establish visual hierarchy. Ensure all text links are styled with Strom Gray (#333333) and hint interaction through border-bottom changes, not color changes. Avoid using saturated colors for backgrounds or large areas; maintain an achromatic base palette. Do not introduce soft shadows or excessive elevation – rely on borders and negative space for component separation. Do not use rounded corners on any UI elements; maintain a strict 0px border-radius. Avoid large, widely spaced content blocks; maintain a dense, information-rich visual experience. Do not use multiple font families for body text; stick to Diatype Variable (Inter) for primary text. Do not introduce heavy gradient overlays or background images that detract from content clarity. Avoid large-scale photography or illustrations that aren't tightly integrated into a structured grid or content block.