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.

Nav Light Mode

Nav Dark Mode

Hero Header

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.

Node Inventory

VariantNode IDLayout
Option 1986-5750Two-column copy, CTA row, USP row, square media card
Option 27-302Centered copy, CTA row, USP row, large media block
Option 37-299Inset background-media hero, centered white content
Option 47-300Inset background-media hero, left-aligned white content
Option 58-664Left-aligned copy with horizontal media rail
Option 68-719Centered copy with horizontal media rail
Option 78-807Two-column copy and staggered media grid
Option 8665-3574Content/stat row with large media block below
Hero with QuoteReference pageQuote-led doctor endorsement hero
Hero with Quote (Inverted)Reference pageQuote hero with image left and copy right
Hero Podcast 1Reference pagePodcast endorsement hero (quote layout, text pill, editable host image)
Hero Podcast 2 (Description)Reference pagePodcast hero with a plain description paragraph instead of a quote
Hero Influencer SpecialAoki live LPFull-bleed rounded card, copy left, bottom KPI row, desktop+mobile bg
Hero Partnerships1429-4082Partner mark above headline, 4:5 composite media column, centred copy

Option 1

Option 2

Option 3

Option 4

Option 5

Option 6

Option 7

Option 8

Hero with Quote

Hero with Quote (Inverted)

Partnership Hero

Hero Podcast 1

As heard on The Joe Rogan Experience podcast

Superpower members take health into their own hands

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

Hero Podcast 2 (Description)

Hero Influencer Special

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 4rem3rem1.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.

Hero Partnerships

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:

  • The partner mark stands alone above the headline at ~45px, instead of sitting in a 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 column is 4:5 portrait and sized larger than the copy column (624 vs 515 in the design), for a full-bleed composite rather than a square product shot.
  • The copy column is vertically centred against that taller media, not stretched to match it.

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.

Hero Author

The opener of the Doctor / Paid Ads layout. Ported 1:1 from Figma Paid-Ads-LPsLatest, 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 1rem1.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.

Features

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.

Node Inventory

VariantNode IDNotes
Feature V1666-1354-card numbered "How it works" layout
Feature V2666-885Membership value section, rating badge, quote, and 4 feature rows
Feature V3Live pageDr. Connealy lab-results sticky price + 5 step rows
Feature V4779-79Heart-guideline banner: pretitle + 3 stat columns
Feature V5667-1514"See your health" with phone mockup
Feature V6667-1540Vetting criteria with branded product image
Feature V7770-52"From draw to plan in days" with 4 numbered step rows
Feature V8WebflowFathers Day health changes drag slider
Feature V9WebflowVAST "How Superpower Works" four-card section
Feature V10WebflowVAST partnership claim gift section

Feature V1

How it works

It starts with an advanced health check, then so much more.

1Appointment confirmed health check

Test your baseline

One simple blood draw to measure 100+ biomarkers.

2Health data dashboard

Results explained

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

3Personalized health protocol

Build your protocol

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

4Superpower diagnostics and clinic access

Access everything

Take action, access everything you need, then retest. You're in control.

Feature V2

Feature V3

Feature V4

Feature V5

Feature V6

Feature V7

Feature V8

Feature V9

Feature V10

Biomarkers

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.

Biomarkers

WHAT WE TEST

See what your annual physical is missing

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.

questgrail
See what we test

Heart & Vascular Health

17 biomarkers

  • Atherogenic Coefficient
  • Cholesterol/HDL Ratio
  • LDL Cholesterol
  • LDL C / ApoB
  • Neutrophil to HDL Cholesterol Ratio
  • Non-HDL Cholesterol
  • Apolipoprotein B (ApoB)
  • Cholesterol, Total
  • HDL Cholesterol
  • LDL Cholesterol / Total Cholesterol Ratio
  • LDL/HDL Ratio
  • Non-HDL Cholesterol / Total Cholesterol Ratio

Liver Health

13 biomarkers

  • Albumin
  • Alkaline Phosphatase (ALP)
  • Bilirubin, Direct
  • Bilirubin, Total
  • GGT to HDL Cholesterol Ratio
  • Globulin
  • Alanine Aminotransferase (ALT)
  • Albumin/Globulin Ratio
  • Aspartate Aminotransferase (AST)
  • Bilirubin, Indirect
  • Bilirubin to Albumin Ratio
  • Gamma Glutamyl Transferase (GGT)
  • Indirect to Direct Bilirubin Ratio

Kidney

9 biomarkers

  • Blood Urea Nitrogen (BUN)
  • Carbon Dioxide (CO2)
  • Creatinine
  • BUN/Creatinine Ratio
  • Calcium
  • Chloride
  • Estimated Glomerular Filtration Rate (eGFR)
  • Sodium

Sex Hormones

8 biomarkers

  • Estradiol
  • Sex Hormone Binding Globulin (SHBG)
  • Testosterone, Bioavailable
  • Testosterone, Total
  • DHEA Sulfate (DHEA-S)
  • Free Androgen Index (FAI)
  • Testosterone / Estradiol Ratio (T:E2)
  • Testosterone, Free

Nutrients

19 biomarkers

  • Vitamin D
  • Aspartate Aminotransferase (AST)
  • Calcium
  • Corrected Calcium (Albumin-adjusted)
  • High-sensitivity CRP
  • hsCRP-to-Albumin Ratio (CAR)

Thyroid Health

4 biomarkers

  • T3 Uptake
  • Thyroxine (T4), Total
  • Free T4 Index (T7)
  • Thyroid Stimulating Hormone (TSH)

Panel 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.

Conditions

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.

Logos

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.

Style=Doctors

dr-vinjamoori
dr-connealy
dr-lufkin

Built by the world’s top doctors and scientists

stanfordharvarducsfoxford

Style=PR

Partnership Marquee

Tables

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.

Table V1

You deserve a better standard of care

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.

Start my health check

Table V2

Table V3

Social Proof

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.

Doctors V1

Doctors V2

Testimonials

4.7 out of 5Trustpilot

Changing outcomes and lives across the nation

60% of members said Superpower identified something previously missed or overlooked by a doctor.

camelia

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

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

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

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-cole

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

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

1 / 5

Influencers

Reviews

Partnership Testimonial

Single Testimonial KPI

Quote Carousel

Figma source: Paid-Ads-LPsLatest807: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.

Membership

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.

Membership

Membership slide 1
1 / 4

Your membership starts here

Everything you need to take care of your health, in one centralized place.

  • Annual 100+ biomarker panel
  • Data dashboard and digital twin
  • Upload past labs and connect wearables
  • Personalized health protocol
  • 24/7 care team access
  • AI companion for all health questions
  • Marketplace with supplements and select Rx
$199
/year*Billed annually
Start my health check
HSA/FSA eligibleCancel anytimeResults in a week

*Pricing may vary for members in New York and New Jersey

Partnership Membership

Biomarkers

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.

Biomarkers

Panel 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.

Conditions

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.

Superpower tests for early signs of 1000+ conditions

See what we test
Thyroid FunctionCardiovascular RiskMetabolic HealthLiver FunctionKidney HealthHormone BalanceInflammation MarkersVitamin DeficienciesIron StudiesBlood SugarCholesterol PanelCortisolTestosteroneEstrogenThyroid FunctionCardiovascular RiskMetabolic HealthLiver FunctionKidney HealthHormone Balance
Cancer ScreeningAutoimmune MarkersNutrient LevelsGut HealthSleep DisordersBone HealthOxidative StressHeavy MetalsDiabetes RiskHeart DiseaseProstate HealthFertilityCancer ScreeningAutoimmune MarkersNutrient LevelsGut HealthSleep DisordersBone HealthOxidative StressHeavy Metals

FAQ

Landing-page FAQ sections using the Dr. Leigh Connealy blood draw content. Two accordion variants for page body layouts.

FAQ Accordion

FAQ Accordion 2

Frequently asked questions