BRAND Nike 2026 · Page: home

HEADER brand: Nike; design_date: 2026-09; page_type: home; variants: campaign landing pages (/running, /jordan, NikeSKIMS) use the same module set example_urls: https://www.nike.com (US, English); evidence: measured on https://www.nike.com 2026-09-25 (server HTML, home stylesheet d33b5015547e6c8e.css, emotion styles and computed styles) unless marked; content is campaign-driven and changes weekly, the module types and spacing are stable purpose: inspire through current campaigns and route to shopping (collections, products, sports) skeleton: fluid width; 29 visible modules at 1440 (server HTML holds a second copy of each module for mobile, shown below 600px); total height ~12560px desktop, ~10640px mobile; sidebar none overrides: none (header without promo bar; home has an extra pre-footer block) SECTIONS Module spacing (margin-top of each module): 0 when glued to the previous one, 16px between a module and its filmstrip (plus ~26px of top space inside the filmstrip, so filmstrip images start 42px below the module above; 34px on mobile), 48px default, 84px or 120px before a new chapter. Two widths: fluid = full bleed (0-1425px with scrollbar), fixed-fluid = inside 48px margins (x 48, 1329px wide). Mobile: 24px margins, same margin steps but 8px instead of 16px. S0 header / two-tier - as Overview (Recipe nav-mega-menu); 96px fixed (60px on mobile) S1 hero / full-bleed-image-text-bottom-left - lead campaign background: photo, full bleed; height 693px at 1440 (top 96 to 789), mobile 584px (top 60); padding: text block 48px from left and bottom (mobile 24px) layout: image covers the box (object-fit cover); text column max ~40% width (est), bottom left; credit rotated 90 degrees at the top right (right 16px, top 24px est) elements: credit 12px/18px Text Medium 500 white ("Ronald Acuña Jr., Outfielder"); H1 display2 76px/68.4px Nike Futura caps white, 2 lines; body1 16px/24px white, margin-top 8px; one white pill "Shop MLB" 36px (padding 6px 16px) about 30px below the body text (pill row margin 24px + pill margin 6px); whole card is a link (overlay anchor) copy: H1 2-3 words per line, 3 words total; body one sentence ~12 words media: athlete action photo with a warm textured studio background; placeholder: dark warm gradient box motion: image fades in (opacity 500ms, delay 300ms); no text animation responsive: <960 H1 40px/36px; <600 image recropped portrait 390x584, text at 24px, body wraps to 2 lines S2 filmstrip / square-3 - collection links for the hero background: white; margin-top 16px, images start 42px below the hero (34px on mobile); height 531px incl. 30px scrollbar room layout: Recipe filmstrip-carousel, 3 slides 435x435 at x 48 / 495 / 942, 12px gaps elements: 3 square photos; caption under each 16px/24px Text Medium 500 #111111 ("Shop Jerseys", "Shop Lifestyle", "Shop Braves"), 8px below responsive: mobile slides 300px wide, 1.2 visible, swipe S3 chapter-divider / fade-band-logo - opens a new campaign chapter background: 208px tall full-bleed strip with a vertical fade from #F5F5F5 (top) to #FFFFFF (est); then a centered sub-brand logo image (RUN wordmark with swoosh, ~130px wide, 78px module) with ~40px space above (est) margin: 48px to the next module responsive: fade band 137px on mobile; logo ~110px wide note: the same divider repeats before each chapter: ACG (orange triangle mark + "All Conditions Gear" in orange, 44px), a player logo (130px), NikeSKIMS (115px), NFL Rivalries (40px, after a 120px gap without fade band), TRENDING (fade only) S4 video-card / inset-text-bottom-left - product launch film background: autoplaying muted looping video, inside 48px margins, 1329x646 (about 2.06:1), no radius; mobile 342x512 portrait elements: H3 display2 76px/68.4px Futura caps white ("EVERY. DAY. SPEED." on 2 lines); editorial-body1 20px/30px white (16px/24px mobile), margin-top 8px, ~15 words, max width ~520px (est); pills: "Get Notified" (white on-dark primary) and "Watch ▶" (white pill with play triangle 12px), 6px apart motion: video autoplay loop; "Watch" opens the player with sound responsive: <600 portrait crop, text 24px from left and bottom S5 filmstrip / portrait-3-caption - feature details margin-top 16px; 3 slides 435x583 (3:4), 12px gaps; caption body1 16px/24px 400 #111111, 8px below, 2 lines ("A stacked ZoomX foam midsole and exposed Air Zoom unit deliver 18% more energy return.") media: dark macro product shots with glowing details S6 chapter-divider (ACG) - as S3, logo 44px tall S7 image-cards / 2-up-text-bottom-left - two collection teasers margin-top 48px; 2 columns (ncss-col-lg-6), each 658x892 (about 3:4), 12px gap, inside 48px margins elements per card: eyebrow 16px/24px Text Medium 500 white ("ACG Zegama Trail GORE-TEX"); title 24px/1.2 Text Medium 500 white ("Waterproof Cushioning") (est); white "Shop" pill 36px, 18px below; all 48px from left and bottom (est 40px) responsive: <600 cards stack full width 342px, 12px apart S8 text-card / centered-display - athlete signature product margin-top 120px; centered, inside margins; height ~178px elements: H2 display4 48px/43.2px Futura caps #111111, 2 lines ("SAM KERR / MERCURIAL SUPERFLY"); body1 16px/24px #111111 margin-top 8px; two black pills 36px ("Shop Sam Kerr", "Shop Kids'"), 6px apart, 18px below responsive: mobile H2 40px/36px, pills stay inline S9 video / full-bleed-watch - brand film margin-top 48px; full bleed 1425x712 (2:1); only a white "Watch ▶" pill bottom left at 48px responsive: mobile 390x520 S10 product-rail / section-headline - team merchandise margin-top 48px; headline row: H2 title3 24px/28.8px Helvetica Now Display Medium #111111 "Rep Your Team" left at x 48, arrows right (Recipe filmstrip-carousel); rail of cut-out products 300x300 on white/grey squares, no captions, 4.5 visible responsive: mobile swipe, no arrows S11 chapter-divider (player logo) + S12 video / inset (1329x646) with "Watch" pill, margin 16px S13 text-card / centered-display-large - teaser margin-top 84px; H2 display2 76px/68.4px Futura caps #111111, 2 lines ("NOTHING SPECIAL TO / SEE HERE*"); body1 one line; one black pill "Get Notified" S14 chapter-divider (NikeSKIMS logo 115px) S15 video-card / full-bleed-text-below - collection film full bleed 1425x~560 video (est; module 913px incl. text); below it, centered: H2 display2 76px Futura caps #111111 ("BODY OBSESSED"), body1 2 lines centered max ~520px, two black pills "Shop" and "Explore More", 18px below; ~32px padding above the text (est) S16 filmstrip / portrait-athletes - athletes wearing the collection margin-top 16px; 3.x slides 435x566 with vertical white credits (12px 500, rotated) on the right edge of each photo; arrows at the top right (48px circles) S17 chapter-divider (NFL Rivalries logo, margin-top 120px, no fade band) S18 image-card / full-bleed-text-below - league collection margin-top 48px; full-bleed photo collage ~1425x820 (est) then centered body1 16px line and a black "Shop" pill; module 929px S19 product-rail / captions - one shoe per team margin-top 48px; slides 312px (300px images of shoes on light grey), captions 16px/24px Text Medium 500 below ("Detroit Lions"), arrows top right S20 chapter-divider (fade band only) S21 text-card / centered-display + icon-grid - trending shortcuts H2 display2 76px Futura caps ("TRENDING"), body1 one line; then a grid of 16 shortcut tiles in 2 rows of 8 (fixed-fluid, centered, ~96px pitch est): each a small cut-out product image ~60x60 (est) with a 12px/1.3 500 #111111 centered label ("Air Jordan 1", "Air Max", "Graphic Tees", "Dunk", "24.7 Collection" ...), ~36px row gap (est) responsive: mobile grid of 4 per row (est), 416px tall S22 pre-footer / swoosh-links - home only margin-top 84px; centered swoosh image ~40px wide; row of links "Find a Store", "Help", "Join Us", "Sign In" 16px 500 #111111, ~24px apart (est); then 84px below a centered 4-column link index (Featured, Shoes, Clothing, Kids): titles 16px/24px 500 #111111, links 14px/21px 500 #9E9EA0 or #707072 (est), columns ~200px wide S23 footer - as Overview (4 columns, legal row), top rule 1px #E5E5E5 PAGE COMPONENTS image-card: figure with img (object-fit cover), full-card link overlay (absolute, focus-visible border 1px #1151FF), optional text block (eyebrow, headline, body, pill row); text positions: bottom-left over media, or centered below media video-card: same with a Video.js player (autoplay, muted, loop, playsinline, poster); "Watch ▶" pill toggles full playback with sound text-card: centered stack: display headline, body1, pill row (flex, centered, 6px gaps) section-headline: flex row, title3 left, optional cta link (12px 500 underlined) and carousel arrows right, margin-bottom 24px chapter-divider: fade band image + sub-brand logo image, centered INTERACTIONS filmstrips and product rails: Recipe filmstrip-carousel videos: autoplay muted loop in view; Watch pill plays with sound (controls: play/pause, mute, fullscreen, progress in Video.js skin) all cards are single large links; pills inside are separate links with z-index 1 STATES loading: #F5F5F5 image boxes, images fade in (opacity 500ms, delay 300ms) video blocked or reduced motion: poster image with the Watch pill SCREENSHOTS - file: nike_2026_home_d1440_full.jpg shows: full home at 1440, live https://www.nike.com 2026-09-25 with the US region cookie, all lazy images loaded, scroll 0 (header at top) key values: module gaps 16 / 48 / 84 / 120px; filmstrip slides 435px, 12px gaps; display headlines 76px Futura caps; text cards centered; footer 4 columns do not copy: photos, videos, logos (RUN, ACG, NikeSKIMS, NFL, player marks) - file: nike_2026_home_m390_full.jpg shows: full home at 390x844 @1x, live: hero 584px, rails cut at the right edge, stacked ACG cards, text cards with 40px headlines, trending grid, stacked footer; app banner removed