Preview image. Unlock full-res
Strategic blueprint on polished steel. Organized hierarchy and vibrant violet accents against a muted canvas.
This design system projects a high-tech, enterprise feel through its stark contrasts and precise typography. Dominant dark and vivid violet accents create a sense of digital sophistication, while a meticulous hierarchy of grays and precise spacing ensure clarity. The interplay of strong, weighted headlines against more muted body text establishes authority, characteristic of B2B SaaS platforms.
Use Violet Impulse (#693edf) exclusively for primary CTAs and active states.
Apply Midnight Ink (#171717) for all primary text, ensuring maximum contrast against light backgrounds.
Maintain 4px radius for all general UI elements like cards and secondary buttons.
Ensure input fields use Cloud Burst (#f6fafb) background and Slate Echo (#e4edf1) borders for consistent form styling.
Prioritize ABC Normal font for all display headings to leverage its distinctive letter spacing and authoritative presence.
Implement -0.0200em letter spacing for ABC Normal headlines at 48px and larger sizes.
Do not use shadows for elevation; emphasize depth through varied background colors and precise spacing.
Avoid using Violet Impulse (#693edf) for body text or non-interactive elements, to preserve its impact as an accent.
Do not introduce additional border radii; consistently use 4px or 0px.
Refrain from using Inter for major headlines. Its role is for functional and extended text.
Do not deviate from the established spacing unit; use multiples of 4px for all padding and margins.
Avoid introducing additional visual accents or graphical elements that compete with the brand's violet spectrum.
