Preview image. Unlock full-res
Midnight Command Center. Imagine a high-tech dashboard glowing softly in a dark room, with frosted glass elements reflecting subtle light.
AuthKit's design evokes an 'internal dashboard' feel — polished and functional without being sterile. Dark, translucent surfaces glow with subtle inner shadows and a restrained use of soft, muted blues. The sharp contrast between the deep Midnight Abyss background and crisp white text, paired with a limited palette of nearly achromatic blues, creates a sense of digital precision. The deliberate mix of round (Pill) and subtly rounded (Subtle) corners on different elements adds a tactile quality to the otherwise sleek, high-tech aesthetic, hinting at user-friendliness within a complex system.
Prioritize Midnight Abyss (#05060f) as the primary background color for all main page sections and large surface areas.
Use aeonikPro (sub. Space Grotesk) for all marketing headlines (28-48px) and Untitled Sans (sub. Inter) for all body copy and UI elements (12-24px).
Apply Pill (999px) radius to all primary and secondary action buttons, and Subtle (12-16px) radius to cards and containers.
Employ the complex inner shadow rgba(199, 211, 234, 0.12) 0px 1px 1px 0px inset, rgba(199, 211, 234, 0.05) 0px 24px 48px 0px inset, rgba(6, 6, 14, 0.7) 0px 24px 32px 0px on elevated cards to create visual depth.
Reserve Neon Violet (#663af3) exclusively for critical call-to-action buttons, maintaining its impact.
Use subtle linear gradients for decorative elements, such as linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(186, 215, 247, 0.12), rgba(0, 0, 0, 0)) for dividers or highlights.
Avoid using highly saturated, non-brand colors outside of the designated Neon Violet accent.
Do not use generic drop shadows; instead, utilize the specified inset shadows and soft outer glows to achieve depth.
Do not deviate from the specified font families; their visual distinction is core to the brand identity.
Do not apply standard rectangular shapes to buttons; all interactive buttons should use Pill (999px) radius.
Avoid using flat, opaque background colors for cards; instead, use translucent backgrounds with subtle inner shadows to maintain the 'frosted glass' effect.
Do not use letter-spacing on display headings; aeonikPro should maintain normal letter spacing at larger sizes, while Untitled Sans uses a subtle negative spacing.
