--- version: alpha name: Wise landing-page reference description: A bold international-money landing page using heavy uppercase display typography, bright lime green, pill-shaped actions, a globe-and-coins hero, transfer calculators and editorial lifestyle photography. Captured in the English Germany variant. colors: primary: '#9FE870' secondary: '#163300' surface: '#FFFFFF' on-surface: '#0E0F0C' tint: '#E2F6D5' typography: headline-display: fontFamily: Wise Sans fontSize: 105.428px fontWeight: 900 lineHeight: 89.6142px headline-md: fontFamily: Inter fontSize: 45.4572px fontWeight: 600 lineHeight: 57px letterSpacing: -1.36372px headline-mobile: fontFamily: Wise Sans fontSize: 50.9092px fontWeight: 900 lineHeight: 43.2728px body-md: fontFamily: Wise Sans fontSize: 40px fontWeight: 900 lineHeight: 34px --- # Wise landing-page reference ## Overview Observed at https://wise.com/ on 2026-09-18 at 1440px desktop and 390px mobile widths. A bold international-money landing page using heavy uppercase display typography, bright lime green, pill-shaped actions, a globe-and-coins hero, transfer calculators and editorial lifestyle photography. Captured in the English Germany variant. This is an independent visual reference, not an official brand specification. ## Colors The palette above records key sampled CSS colors, with approximate neutral conversions explicitly noted where relevant. Use the primary color for the observed emphasis and acquisition hierarchy; keep surface and text roles distinct. Artwork, photography and gradients add colors beyond these tokens. Maintain strong ink-on-lime contrast and the distinction between expressive display headings and readable interface labels. ## Typography The visible display sample uses "Wise Sans", 105.428px size, 89.6142px line height and weight 900. Tracking is normal. The frontmatter records measured display, secondary-heading and mobile-heading samples, not an exhaustive scale. Body tokens, when present, are one observed paragraph sample rather than a universal paragraph rule. Preserve supplied font assets when licensed; fallback font metrics will differ. ## Layout Start with an oversized centered promise and globe illustration, then use bright green full-width transfer and fee-comparison sections. Continue through account feature cards, a dark-green business panel, alternating photo-and-copy stories, country motifs, an app-download promotion, supported-country grid and extensive legal/footer content. The desktop hero region is about 1240px wide with 100px side margins. At 390px the header retains signup and a menu. The hero uses approximately 50.9px display text with tight 43.3px line height and about 16px side gutters. The primary action expands to full width and the secondary link sits below it. The globe is intentionally cropped within the mobile composition. Both inspected widths measured no horizontal document overflow. Intermediate breakpoints and the full mobile scroll sequence were not inspected. Desktop section spacing and card arrangement are visual observations; no complete spacing scale was inferred. ## Elevation & Depth White calculator panels float above the lime canvas with soft shadows. Photographs and rendered coins add realism; dark-green panels create strong sectional depth without requiring extra borders. Exact shadow and artwork lighting values were not measured. ## Shapes Use fully rounded action pills, generously rounded calculator and content cards, flag circles, globe/coin artwork and large editorial photographs with rounded corners. Heavy condensed-looking display type creates the sharp contrast to these soft shapes. Radius descriptions are visual estimates unless explicitly measured elsewhere. ## Components The hero pairs a lime open-account button with an understated transfer link. Transfer input cards and fee comparison tables make pricing tangible. Country flags, photographed payment cards, feature links and an oversized app-download panel support the global-money story. No financial transaction was initiated. ## Do's and Don'ts Maintain strong ink-on-lime contrast and the distinction between expressive display headings and readable interface labels. Keep calculator numbers legible. Do not reuse the sample rates, availability or country-specific claims as timeless product facts. - Do retain the reference-specific layout and responsive hierarchy, not only its palette. - Do verify readable content when substituting your own assets and copy. - Don't infer hover, keyboard focus, validation or open-menu states: those were not exercised. - Don't treat the static screenshot as a complete animation or carousel specification.