CURATED · OPEN · FREE

Heartaerospace

A premium, clean aerospace brand showcasing electric aviation hardware with restrained typography and large-scale imagery.

01

Identity DNA

Clean, restrained aerospace engineering documentation.

02

Color

High-contrast monochrome base with a single, vibrant deep blue accent for interactive elements.

03

Typography

neue-haas-grotesk-display · neue-haas-grotesk-text

• display50px · 500
• body18px · 400
• caption14px · 400

Use Neue Haas Grotesk Display for all major display text. · Use Neue Haas Grotesk Text for all body and UI text. · Maintain tight letter-spacing for headlines.

04

Spacing

Strict 4px base grid with generous 64px section padding.

05

Surfaces

Subtle 1px borders using rgba(20,20,20,0.15) or black with low opacity.

0 32px 68px rgba(0, 0, 0, 0.3)

06

Layout

Full-width hero images with centered, large-scale typography overlays.

07

Motion & Interaction

Subtle opacity transitions on hover. · Color transitions for primary buttons. · Filter transitions for images.

Slight opacity reduction or color shift on interactive elements. · Immediate visual feedback with no bouncy scaling.

08

Components

• button Solid deep blue (#1032CF) rectangles with white text and rounded corners (lg radius).
• card Simple white or transparent surfaces with no visible borders.
• chip Minimal pill-shaped toggles for cookie consent.
• input Clean text inputs with subtle bottom borders.
• hero Full-width photographic background with large white overlay typography.

09

Voice & Don'ts

• Tone Professional, visionary, and forward-looking.
• Headlines Large, bold, sentence-case statements.
• CTAs Clear, action-oriented text on solid blue backgrounds.

• Don't use decorative fonts — screenshot shows clean, geometric grotesque sans-serif typography.
• Don't use busy backgrounds behind text — screenshot shows clear text overlays on imagery or solid white backgrounds.
• Don't use multiple accent colors — screenshot shows a single dominant deep blue used consistently.
• Don't use sharp, aggressive corners — screenshot shows consistently rounded corners (up to 32px) on major elements.
• Don't use dark mode for the main interface — screenshot shows a predominantly white and light-themed layout.
• Don't use low-contrast text — screenshot shows high-contrast black or white text against its background.
• Avoid: Overly technical jargon without context.
• Avoid: Aggressive or hype-driven marketing language.
• Avoid: Visually cluttered interfaces.
• Avoid: Use of multiple bright colors.

10

Inside the pack — real screenshots

Captured from the live site · real computed styles

11

System prompt

en · zh-CN · zh-TW · ja · ko