Mother Design

Mother Design operates with a high-contrast, starkly typographic visual system, channeling the precision of an architectural drawing onto a white canvas. Its deliberate use of un-styled text as clickable elements, minimal decorative elements, and strong grid lines defines a no-frills, functional aesthetic. Typography carries the primary visual weight, with large, confident headlines and tightly tracked text emphasizing clarity and directness. The overall feeling is one of structural rigor and intentional simplicity, where content and interaction are prioritized over visual embellishment. Prioritize Ink Black text (#000000) on Canvas White (#ffffff) backgrounds for maximum contrast and essential information. Use Basis font for all textual content, adjusting weights and letter-spacing for hierarchy as defined in the typography section. Define interactive areas primarily through 1px Ink Black (#000000) borders and text-based links, rather than strong background fills. Maintain a default border-radius of 0px across all components to reinforce the sharp, precise aesthetic. Employ Smoke Grey (#f4f4f4) sparingly for subtle section breaks or secondary surface differentiation, always contrasting with Ink Black text. Use Muted Stone (#808080) for helper text, disabled states, or less prominent links. Implement the 20px elementGap consistently for horizontal and vertical spacing between most elements. Avoid using gradients or shadows; the design relies on flat, high-contrast surfaces and sharp edges. Do not use background colors on primary buttons; rely on borders and text color for interaction cues. Refrain from introducing decorative imagery that deviates from the grid-like, monochromatic aesthetic. Do not use rounded corners on any elements; all corners should be sharp 0px radius. Avoid excessive use of color; the system is built on a neutral palette with minimal accentuation. Do not vary line-height significantly from the defined values in the typography section; maintain tight leading. Avoid large internal padding on interactive elements; content should often sit close to implied borders.