Preview image. Unlock full-res
Secure Airlock Behind Glass. A system that moves from the protective dark of an airlock to the bright clarity of a control room.
The design feels like a high-security airlock transitioning into a well-lit control room. An immersive, deep-space dark hero (#1D1D21) establishes a serious, secure atmosphere, which gives way to crisp white (#FFFFFF) content sections focused on informational clarity. The signature brand blue (#145FE4) is used exclusively for calls-to-action and active states, acting like an indicator light confirming interaction. Typography is a key differentiator; the custom font agileSans at large sizes with tight negative letter-spacing creates dense, architectural headlines. Buttons are distinctly full-pill (9999px radius), contrasting with the generally sharp, un-rounded cards, creating a focused tension between interactive and container elements.
Use Brand Blue (#145fe4) exclusively for primary CTAs, links, and active state indicators.
Apply tight negative letter-spacing (-1px to -2px) to all headlines (48px and larger).
Employ 9999px radius for all buttons to create the signature pill shape.
Contrast fully-rounded buttons with modestly rounded cards (16px) and list items (8px).
Use the Deep Space (#1d1d21) to Brand Blue gradient solely for hero sections.
Maintain a clear visual hierarchy with generous vertical spacing between sections (80px+).
Use Agile Sans for all typography to maintain brand consistency.
Do not use Brand Blue for static headlines or body text.
Avoid using rounded corners on main layout containers; reserve rounding for interactive elements and cards.
Do not apply shadows to buttons or in-line elements.
Avoid introducing new saturated colors; the palette is intentionally monochrome with a single blue accent.
Do not use system fonts for headings; the custom font is a critical brand element.
Avoid small padding on cards; use a minimum of 24px to ensure they feel spacious.
Do not use outlines on primary filled buttons.
