Navbar
The shared Superpower navbar used across LP templates. It mirrors the live site behavior: fixed positioning, desktop scroll morph into the dark blurred pill, centered logo scale, dotted hamburger control, and the right-side mobile menu.
The shared Superpower navbar used across LP templates. It mirrors the live site behavior: fixed positioning, desktop scroll morph into the dark blurred pill, centered logo scale, dotted hamburger control, and the right-side mobile menu.
Figma source: Node 2-1200
Each option is one responsive JSX block — desktop has wider layouts, larger headlines, and side-by-side CTAs; mobile stacks vertically with full-width buttons.
| Variant | Node ID | Layout |
|---|---|---|
| Option 1 | 986-5750 | Two-column copy, CTA row, USP row, square media card |
| Option 2 | 7-302 | Centered copy, CTA row, USP row, large media block |
| Option 3 | 7-299 | Inset background-media hero, centered white content |
| Option 4 | 7-300 | Inset background-media hero, left-aligned white content |
| Option 5 | 8-664 | Left-aligned copy with horizontal media rail |
| Option 6 | 8-719 | Centered copy with horizontal media rail |
| Option 7 | 8-807 | Two-column copy and staggered media grid |
| Option 8 | 665-3574 | Content/stat row with large media block below |
| Hero with Quote | Reference page | Quote-led doctor endorsement hero |
| Hero with Quote (Inverted) | Reference page | Quote hero with image left and copy right |
| Hero Podcast 1 | Reference page | Podcast endorsement hero (quote layout, text pill, editable host image) |
| Hero Podcast 2 (Description) | Reference page | Podcast hero with a plain description paragraph instead of a quote |
| Hero Influencer Special | Aoki live LP | Full-bleed rounded card, copy left, bottom KPI row, desktop+mobile bg |
| Hero Partnerships | 1429-4082 | Partner mark above headline, 4:5 composite media column, centred copy |
Your doctor spends 8 minutes with you and your insurance company decides what bloodwork you're allowed to get. That's not health care. With Superpower, you have control.
Joe Rogan
Host of The Joe Rogan Experience
Start with 100+ biomarkers
Screen 1,000+ conditions
Access diagnostics and select Rx
*Pricing may vary for members in New York and New Jersey
Ported 1:1 from the live wf.superpower.com/landing/steve-aoki section_sp2-home-hero.is-aoki-hero.
A near-full-viewport rounded card: background photograph, copy left, and a KPI row pinned to the
bottom. Built for portraits shot with the subject on the right and negative space on the left, which
is what keeps the headline legible.
Two background uploads. The live page ships one pre-overlaid .avif; this variant takes a
desktop image AND a mobile image, because the composition that works in landscape does not survive a
portrait crop. The markup authors them loading="lazy", but at render time the shared media policy
(live-media-policy.ts) flips hero-role images to eager, strips the img-level priority hint, and
the server emits a media-qualified high-priority head preload per crop — the viewport's crop
fetches first and at full priority; the hidden crop costs one low-priority duplicate download.
A gradient scrim sits above both so white copy stays legible on any upload — the live
Aoki asset has that gradient baked in, which a fresh upload will not.
The KPI row sits bottom left, under the copy, exactly as the reference renders it. To move it
right instead, add self-end and swap pl for pr on that row.
Ladder measured at 1512 / 900 / 700 / 390: card height 100dvh - 5.5rem with a 5.5rem top margin
on desktop, full 100dvh and no margin below 992; inner padding 4rem → 3rem → 1.5rem bottom
with the left inset dropping to 0 at ≤767 (the copy carries 1.5rem/1.25rem of its own there);
radius 0.75rem on desktop, square below 992 where it goes edge to edge.
Built from Kevin's co-branded frame (Co-branded Landing Pages, node 1429-4082). Differs from
Partnership Hero in three ways that matter, which is why it is its own variant rather than an
edit of that one:
superpower | partner lockup at 15px. Superpower's own wordmark is carried by the navbar. A 15px
slot suits a pure wordmark like VAST's; it strands any logo that has a symbol in it (YPO's
triangle rendered 39x15 against Superpower's 151x22).The media slot takes a single composite export — the digital twin with its annotation callouts is one flattened image, not rebuilt as DOM. Leader lines and floating value cards depend on exact positions against the render; reproducing them in markup would drift the moment the image is swapped, and the whole point of the slot is that partners swap it.
The opener of the Doctor / Paid Ads layout. Ported 1:1 from Figma
Paid-Ads-LPs → Latest,
desktop node 796:72 (1512 × 972) and mobile node 847:11094 (393 × 855).
An editorial hero: a byline under the headline puts a named clinician's authority on the page before anything else does. Copy left and portrait right on desktop; on mobile the portrait goes first, full-width, and the copy follows — that inversion is in the reference and it is what makes the face the first thing on a paid-traffic mobile landing.
No navbar sits above this. The reference frame starts at y=0 with the hero, which is
deliberate for paid traffic. The template ships without a navbar section rather than with a hidden
one.
Tint add-on. addOns.heroTint repaints this section warm with white copy and a white CTA, per
Figma Hero_V2 — 798:1446;
addOns.heroTintColor sets the base colour (hex only). It is CSS scoped to
[data-lp-hero-tintable] and driven by --lp-hero-tint, so the future three-stop control needs no
change here. The builder shows the toggle only on pages that carry this variant.
Pair it with a cut-out portrait — the light hero's asset has its own pale studio backdrop, which
reads as a panel floating on the tint rather than a subject standing in it.
Two portrait uploads, desktop and mobile, for the same reason as Hero Influencer Special: the
desktop crop is a 624 × 780 portrait and mobile is a 345 square, and one file cannot serve both.
Both are loading="lazy" so exactly one downloads per device, and fetchpriority="high" keeps the
visible one an LCP candidate. Unlike the Aoki hero there is no scrim — the copy sits beside the
photo, not on it.
Measured ladder: section padding 1.6875rem/1.5rem block on mobile → 6rem at 992; copy column
32.1875rem wide against a 39rem × 48.75rem visual, justify-between inside the 80rem
container; child gap 1rem → 1.5rem. Type steps 40/42 → 60/64 on the headline, 16/22 → 18/26 on
the body, and both carry -0.005em/-0.025em tracking measured off the reference rather than the
type-* ladder, which steps at different sizes.
Deleting any row is safe: the copy column spaces its children with gap, never margins, so removing
the eyebrow, the byline or the paragraph closes the space instead of leaving a hole.
Figma source: Node 8-864
Ten independent feature sections. Each is one responsive JSX block — desktop and mobile share the same content (same number of steps, same copy, same icons), only the layout reflows.
| Variant | Node ID | Notes |
|---|---|---|
| Feature V1 | 666-135 | 4-card numbered "How it works" layout |
| Feature V2 | 666-885 | Membership value section, rating badge, quote, and 4 feature rows |
| Feature V3 | Live page | Dr. Connealy lab-results sticky price + 5 step rows |
| Feature V4 | 779-79 | Heart-guideline banner: pretitle + 3 stat columns |
| Feature V5 | 667-1514 | "See your health" with phone mockup |
| Feature V6 | 667-1540 | Vetting criteria with branded product image |
| Feature V7 | 770-52 | "From draw to plan in days" with 4 numbered step rows |
| Feature V8 | Webflow | Fathers Day health changes drag slider |
| Feature V9 | Webflow | VAST "How Superpower Works" four-card section |
| Feature V10 | Webflow | VAST partnership claim gift section |
It starts with an advanced health check, then so much more.

Test your baseline
One simple blood draw to measure 100+ biomarkers.

Results explained
Get a complete picture of your health data in one secure location.

Build your protocol
AI builds evidence-backed protocols, informed by your data.

Access everything
Take action, access everything you need, then retest. You're in control.
Figma source: Node 5601-1469 (desktop) · 5601-3128 (mobile)
The live Figma node is named ↳ Biomarkers. One responsive layout: 3-col × 2-row grid on desktop with photographic anatomy icons; 2-col × 3-row text-only cards on mobile.
WHAT WE TEST
Standard bloodwork checks ~15 markers. Superpower checks over 100 to give you a complete picture of your health across hormones, heart health, metabolism, inflammation, and more.
Heart & Vascular Health
17 biomarkers
Liver Health
13 biomarkers
Kidney
9 biomarkers
Sex Hormones
8 biomarkers
Nutrients
19 biomarkers
Thyroid Health
4 biomarkers
Panel biomarker grid with membership-focused copy. It keeps the same editable lab-logo, CTA, and biomarker-category layout as the primary Biomarkers section.
Live source: welcome-v2 section_marquee-scroll
Conditions marquee: centered headline + tube image with two infinite text rows moving in opposite directions. The tube image reveals from below with blur and opacity as it enters the viewport.
Figma source: Node 7-308
Two responsive variants. Each is one JSX block — desktop uses a single horizontal row, mobile stacks the headline above and reflows logos to wrap.



Built by the world’s top doctors and scientists
Figma source: Node 325-1115
Three responsive table concepts. Each is one JSX block — desktop renders the full layout with side-by-side columns; mobile reflows columns into stacked cards.

The standard physical
Superpower membership
10 minutes with a doctor
Wait weeks for an appointment, then get 10 minutes of face time.
On-demand care team
Message care team anytime. No appointment, no waiting room.
Limited bloodwork
Standard panels test ~15 biomarkers.
Comprehensive Testing
Baseline panel covers 100+ biomarkers.
Scattered care
Meds from one doctor, labs from another, no one connects the dots.
All your health data, in one place
Labs, medications, history, results in one dashboard.
Reactive
Wait until you feel discomfort before anyone will take action.
Proactive
Detect shifts early and screen for risk factors before symptoms show up.
Another prescription
Default to more medication as the first line of care.
Root cause focus
Identify what's driving the symptoms, then build a plan around it.
Figma source: Node 316-4416
Seven families of trust-building sections. Each is one responsive JSX block; the toggle resizes the preview frame so you can see desktop and mobile renderings of the same code.
60% of members said Superpower identified something previously missed or overlooked by a doctor.

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money

Camelia, 29
“I left the appointment feeling like I was being dramatic. I wasn’t being dramatic. I was being responsible.”
Doctors refused to test her fertility, so she took control of her health

Thach, 37
“They told me I was overthinking my genetic risk of diabetes but when I tested with Superpower I found my A1c was really high.”
His Superpower test caught risks that two doctors missed

Carissa, 38
“I spent almost a year thinking something was wrong with me. Turns out a simple blood test could have told me in a week.”
Uncovered the hormone imbalances behind bloating and weight gain

Teva, 28 and Cole, 29
“I got my boyfriend a Superpower blood test. And it opened his eyes to things that seriously needed to change.”
The gift that changed how they think and talk about health

Joel, 55
“I was putting in so much effort to improve my health. But nothing was working, until I got testing that actually showed me what to focus on.
Superpower gave him a supplement plan that saved him time and money
Figma source: Paid-Ads-LPs → Latest → 807:8219
(mobile 847:14388). Part of the Doctor / Paid Ads layout.
Three member quotes side by side on desktop, one at a time on mobile, with the prev/next buttons centred underneath. Round portrait, centred quote, name and role — no card, no border, just the column on the page background.
Runs on the same MemberStoryCarousel as the story-02 payload rather than a third carousel
implementation: that component takes slidesPerView={3} for the three-up row and
arrows="below" to move its buttons out from over the slide.
Figma source: Node 665-5967 (desktop) · 665-5899 (mobile)
Clean white card with image left + content right (desktop) or stacked image-top, content-below (mobile). Pagination dots indicate the image is part of a 4-image carousel.

Everything you need to take care of your health, in one centralized place.
*Pricing may vary for members in New York and New Jersey
Figma source: Node 5601-1469 (desktop) · 5601-3128 (mobile)
The live Figma node is named ↳ Biomarkers. One responsive layout: 3-col × 2-row grid on desktop with photographic anatomy icons; 2-col × 3-row text-only cards on mobile.
Panel biomarker grid with membership-focused copy. It keeps the same editable lab-logo, CTA, and biomarker-category layout as the primary Biomarkers section.
Live source: welcome-v2 section_marquee-scroll
Conditions marquee: centered headline + tube image with two infinite text rows moving in opposite directions. The tube image reveals from below with blur and opacity as it enters the viewport.

Landing-page FAQ sections using the Dr. Leigh Connealy blood draw content. Two accordion variants for page body layouts.
Mandatory final section for every landing page. One variant, no selection needed. Logo + newsletter signup, live Superpower link groups, App Store + Ask-AI badges, CEO video lightbox, and copyright bar.
Figma source: Paid-Ads-LPs → Latest → 807:8644
(mobile 847:14539).
The closing block of the Doctor / Paid Ads layout: one muted paragraph at container width, sitting
between the offer and the site footer. Kept as its own section rather than folded into Footer so a
page can carry the disclaimer without the full footer, or the footer without the disclaimer.