Vanta

Vanta

Preview image. Unlock full-res

Regal Clarity on White Canvas

Industrysaas
Palette
#ffffff
#f7f8fa
#eaeaf1
#dfdfe9
#9e9fb7
#6d6e87
#484960
#181822
#260048
#5e05c4
#8f47d5
#ddd6ff

Vanta projects a refined, authoritative presence through a primarily achromatic palette accented by deep, vivid violets. Stark white backgrounds provide a sense of expansive clarity, acting as a clean canvas for content. Typography is precise and impactful, balancing a custom sans-serif for functional elements with a sophisticated serif for headlines. Components are lightweight and well-defined by subtle borders, emphasizing content over heavy ornamentation. Elevation is minimal, achieved through soft borders and contained interactions rather than prominent shadows. Use Midnight Ink (#181822) for all primary body text and main headings to ensure strong contrast and readability. Apply Canvas White (#ffffff) as the default background for most content sections and interactive components. Utilize Vanta Purple (#5e05c4) exclusively for primary calls to action, such as 'Get a demo' buttons. Maintain a 999px border-radius for all interactive elements like buttons and input fields to ensure a consistent friendly, modern feel. Establish hierarchy in headings by using Reckless font, applying its smaller letter-spacing values (-0.0180em to -0.0120em) for larger sizes. Use Border Fog (#dfdfe9) or Muted Ash (#9e9fb7) for all hairline borders and subtle dividers. Prioritize Inter Variable for all functional text, maintaining -0.0020em letter-spacing for consistency. Do not introduce strong shadows; rely on subtle borders or background color shifts for element separation. Avoid using highly saturated colors for large background areas; reserve them for accents and interactive elements. Do not deviate from the full-rounded (999px) radius for buttons and input fields; this is a signature shape. Never use Reckless font for body text or other small functional elements; it is reserved for headlines. Do not use generic blue for links or interactive elements; all brand interaction should use Royal Violet (#8f47d5) or Vanta Purple (#5e05c4). Avoid dense stacking of information; provide ample white space, leveraging Cloud Gray (#eaeaf1) or Background Snow (#f7f8fa) for breathing room. Do not use bright or vibrant photography; imagery should be understated, product-focused, or abstract to allow UI to dominate.

More like this