Shade

Shade employs a stark, high-contrast visual language with a focus on functional typography and precise spacing. The design uses a dominant neutral palette relieved by a single vibrant violet accent. Components feature sharp edges or large, bold radii, often with strong box shadows for emphasis, conveying a sense of directness and polished utility. Surfaces are generally flat, with subtle elevation coming from shadows rather than color shifts. Prioritize Canvas White (#ffffff) for primary backgrounds and Coal Black (#131315) or Midnight Ink (#000000) for primary text to maintain high contrast. Use Inter Display for all headings, leveraging its full range of sizes and letter-spacing for visual impact and hierarchy. Apply a 20px border-radius for primary buttons and 14px for cards, ensuring consistent application of these distinct rounded corners. Emphasize interactive elements and call-to-actions with Digital Violet Bold (#6941c6) for borders or text, or Coal Black (#131315) for filled backgrounds. Maintain a clear elementGap of 10px for vertical rhythm between individual UI components. Employ the hard 8px 8px 0px 0px F1F1F1 shadow for buttons to give them a distinct, almost debossed appearance. Use Ghost Neutral buttons (transparent background, Midnight Ink border and text) for less prominent actions, reserving filled or accented buttons for key interactions. Avoid using multiple chromatic colors; restrict accents primarily to the Digital Violet palette. Do not introduce soft or subtle shadows where a hard, offset shadow is expected; adhere to the distinct shadow style on buttons. Refrain from using generic font families or weights when Inter Display or Aux Mono Regular are available for specific roles. Do not deviate from the established border radii of 0px for some interactive elements and 14px/20px/35px for others, as these are signature elements. Avoid introducing background gradients outside of the specified conic-gradient for special accent areas. Do not use generic gray scales for text when Steel Gray (#717173), Deep Gray (#444444), or Dark Gray (#333333) are available for semantic text roles. Do not use transparent or blurry backgrounds when solid color surfaces are the default. Sharp contrasts are key.