Google Fonts Nexa May 2026

.card-title font-family: 'Nexa', sans-serif; font-weight: 800; font-size: 1.9rem; letter-spacing: -0.02em; margin-bottom: 1rem; color: #F5C542;

.quote-author font-family: 'Nexa', sans-serif; font-weight: 400; margin-top: 1.5rem; font-size: 1.2rem; color: #BCC6E0; letter-spacing: 2px; google fonts nexa

.weight-label font-family: monospace; font-weight: 400; width: 100px; font-size: 1rem; color: #9aa5c0; Used in modern interfaces, branding, and editorial design

.hero-sub font-family: 'Nexa', sans-serif; font-weight: 400; font-size: clamp(1rem, 4vw, 1.6rem); letter-spacing: 0.3em; text-transform: uppercase; color: #BCC6E0; background: rgba(20, 25, 35, 0.6); backdrop-filter: blur(4px); padding: 0.5rem 1.5rem; border-radius: 60px; display: inline-block; margin-top: 1rem; border: 1px solid rgba(255,255,255,0.2); Used in modern interfaces

.nexa-card:hover transform: translateY(-8px); border-color: rgba(245, 197, 66, 0.4); box-shadow: 0 30px 45px -12px rgba(0,0,0,0.6);

<div class="section-title">✦ solid pieces | nexa in action</div> <div class="cards-grid"> <div class="nexa-card"> <div class="card-icon">⬛️</div> <div class="card-title">Heavy weight</div> <div class="card-text">Nexa Heavy (800) defines solidity. Perfect for headlines that demand attention, authority, and presence. No compromise, only structure.</div> <div class="bold-demo">ARCHITECTURE OF FORM</div> </div> <div class="nexa-card"> <div class="card-icon">🔲</div> <div class="card-title">Bold presence</div> <div class="card-text">Bold (700) balances power with readability. Used in modern interfaces, branding, and editorial design. A robust piece of the Nexa ecosystem.</div> <div class="bold-demo">STRENGTH IN EVERY CURVE</div> </div> <div class="nexa-card"> <div class="card-icon">▣</div> <div class="card-title">Solid geometry</div> <div class="card-text">Geometric precision meets humanist warmth. Nexa's letterforms feel solid like cast metal — each character stands as an unshakeable piece.</div> <div class="bold-demo">ENDURING · TIMELESS</div> </div> </div>

/* Each card = a solid piece of Nexa expression */ .nexa-card background: #12161C; border-radius: 2rem; padding: 2rem 1.8rem; transition: transform 0.25s ease, box-shadow 0.3s ease; border: 1px solid rgba(255,255,255,0.08); box-shadow: 0 20px 35px -15px rgba(0,0,0,0.5);