Six libraries in one project. NEW v10 · 12 reusable hero blocks — drop-in above-the-fold sections across offer-bar botanical, illustrated wellness, stone plinth dark, tropical family, hand-held UGC, editorial model, grunge twin-pack, from-this-to-this BA, purple clinical, funky display retro, magazine press, cyber-week countdown. PDP main gallery sets (1:1 panels, big product shots — 13 across spotlight supplement, clinical pain-relief, pastel beauty, annotated spec, adventure moody, bundle-gift, editorial lifestyle, hi-tech showroom, sneaker drop, outdoor utility, AM/PM duo, sky-pastel gadget, clinical confidence). PDP archetypes — six full above/below-the-fold journeys. Advertorials + Listicles for pre-sell traffic (six archetypes including diary fruit story). And 20 section blocks — drop-in modules that mix and match.
Built from the patterns that show up across every high-converting DTC PDP we've torn apart. Each template targets 18/18.
Forest green · yellow CTA · TrustScore 5-star · CSS teapot + canister + 12-pt seal
Sticky white top with leaf-mark wordmark + yellow CTA · forest hero with white TrustScore strip, big sans headline, double yellow CTA (top + bottom) with offset shadow · CSS-drawn teapot scene with cylindrical product canister and rotated yellow C8D star seal. For wellness teas, CPG functional beverages, calming supplements.
Teal + peach + pink CTA · Fraunces serif · 6 floating doodle leaves · 4 Caveat callouts
Peach top promo · teal block-style wordmark + pink shop CTA · cyan trust strip with check-pill icons · serif "Better Health Starts" headline with underline accent · 6 leaf-shape SVG doodles floating in bg · peach pouch product on wood stage with 6 benefit-icon grid · 4 hand-drawn Caveat callouts with curvy SVG arrows. For gummies, greens, daily wellness CPG.
Pure black · Oswald display · red CTA · CSS stone slab + lifetime warranty seal
Red flash-sale top with lightning bolt · black header with framed-X logo + red pill CTA · dark studio stage with CSS slate stone slab (clip-path + repeating-linear stripes) holding a tall black tub with framed logo, big Oswald wordmark, 3 benefit icons · gold radial lifetime-warranty seal with dashed inner ring · Oswald headline with red sub-accent + red shadow CTA. For pre-workouts, men's supplements, recovery devices.
Cyan + sun + yellow CTA · 4 sun-face bottles lineup · 100% natural starburst seal
Dark navy top promo · centered "SOLARA®" mark + yellow CTA · centered stars + uppercase Inter 900 headline · double yellow CTA with offset shadow · cyan sky scene with blurred sun, 3 clouds, sand horizon line, and 4-bottle product family (Ocean Spray · Sun Gummy · Tanning Oil · Aftersun) with CSS sun-faces (conic-gradient rays) and overlapping starburst 100% Natural seal. For sunscreen, body-care, tanning, SPF.
Cormorant italic · sage CTA · CSS hand-holds-bottle silhouette · black trust strip
Black top header with framed wordmark + sage square CTA · creator-photo zone: CSS-drawn figure with hair + face + plaid-shirt + skin-tone arm holding a black-label bottle ("197 Intense") · black trust strip with 3 icons (Satisfaction · Free Shipping · 100% Money Back) · serif italic "(and affordable)" headline + sage-green inline accent + 5ml × 4 Sample Bundle underline + receipt-style order-now check. For fragrance, beauty samplers, men's grooming.
Inter 800 caps · peek-of-adjacent slides · black pill CTA · cream TrustScore bar
Minimal nav with hamburger + centered wordmark + search/heart icons · cream TrustScore 4.9 strip with rating + 27,956 reviews · big lifestyle photo card (CSS golfer with cap + windbreaker + white glove on bokeh grass background) with two peek-of-adjacent slide spines on left/right · Inter 800 caps headline + centered serif body + black pill primary CTA + outline secondary CTA. For apparel, fashion, athleisure, lifestyle.
Oswald display · cream parchment + black + gold + red · 2 product bags · stacked CTA shadow
Gold subscribe-and-save promo · black header with crown logo + white pill CTA · cream parchment background with subtle grunge overlay (repeating-linear-gradient) · 2 black product bags with torn-zip tops (CSS clip-path), gold crown badges, Oswald "THE WHOLE FEAST" titles, 3-pip metric badges, and grunge texture overlay · Oswald 42px headline with gold accent · stacked red CTA with offset black border-shadow. For men's wellness, performance protein, ancestral CPG.
Navy + coral · Caveat annotations · curved SVG arrows · stacked offset CTA shadow
Navy top promo + paper header with double-stacked offset-shadow CTA · uppercase Inter 800 headline with coral "Bold Confidence" accent + underline emphasis copy · BA scene: tilted Polaroid before (thinning scalp gradient) + tilted Polaroid after (thick hair gradient) on either side of a center product canister with coral-dot cap + brand label · 2 hand-drawn SVG curved arrows with Caveat "FROM THIS 😕" / "TO THIS 😀" emoji annotations + dashed "WITH THIS" coupon · 4.8 star pill + big offset coral CTA. For hair growth, BA categories, men's transformation.
Lavender wash · Fraunces italic accent · 3 dropper bottles · scattered green leaves
Slider-card top with prev/next + 4.7-star rating + pager dots · pill avatar trust badge ("4.7/5 · 5,583+ Bottles Sold") · Inter 800 headline with italic underlined Fraunces "This Topical Formula" accent · purple pill CTA with white-arrow chevron disc · 2-up BA strip (4 split-tile pairs with corner tags) · 2-row check bullets · scene: lavender→white gradient with 5 dark forest-green leaf SVGs scattered and a 3-bottle ramp (amber droppers w/ vertical brand text + italic "REVIVA" label). For hair growth, topical treatments, clinically-backed beauty.
Bagel Fat One · mint + black + 3 polka tins · groovy double-line headline · press strip
White header with bouncy Bagel Fat One wordmark + mint square CTA · centered 4.5-star pill · groovy 78px display headline ("FEEL THE TINGLES.") · black-pill CTA with mint mono text · Made in U.S.A · 3-5 days delivery trust row · 3 retro-polka tins (cherry/grape/strawberry) arranged in an arc with smiley faces, F-strength meta numbers, and Bagel Fat One flavor names · "AS SEEN ON" press row with VIRAL + HERB & CO + MARKET DAILY. For functional candy, viral CPG, novelty CPG drops.
Fraunces serif + JetBrains Mono · 4 swatch circles · drop-cap intro · stat-quote card · press row
Minimal nav with shop hamburger + centered "FORAY" wordmark + icon trio · magazine masthead with mono eyebrow + italic issue line + 60px italic-accent Fraunces title · drop-cap editorial intro paragraph · scene: 4 left-rail swatch circles with mono labels, center amber atelier bottle with vertical brand line + italic notes + ml stamp, right white stat-card (92% italic figure + survey caption + mono source) + bottom italic Fraunces pull-quote with mono byline · buy row with $185 + mono perks + black square serif CTA · press row "AS SEEN IN THE EDIT · STYLE · studio daily". For luxury beauty, fragrance, atelier-grade DTC.
Slate + orange · 3-segment HH/MM/SS timer · stadium photo · orange offset CTA · dark social-proof
Slate countdown bar with 3 orange HH/MM/SS chips · orange sub-promo · minimal header with mono wordmark · 5-star pill + italic Fraunces headline + orange offset CTA + 2 perks · big lifestyle photo zone (CSS stadium bleachers w/ blurred crowd + person sitting in red jacket clapping with skin-tone hands and dark jeans + orange seat-warmer ambient glow + slatted floor at base + orange right-edge ribbon) · dark social-proof footer with 4 avatars + mono rating line + bold "Customers who felt the difference" tagline. For ad-traffic LPs, fitness, recovery devices, flash-sale moments.
Archivo Black caps · forest + lime · warehouse SALE ticker · 99-day MBG seal
Six panels: dark forest hero w/ alpaca sock + countdown bar · 4 numbered reasons w/ photo squares · dark stat strip w/ outdoor scene · warehouse SALE ticker + 40% stamp · quote card + 4-up UGC tile · MBG seal + perks + sticky ATC. For outdoor gear, footwear, gritty CPG.
Fraunces italic · coral + apricot + night-navy · dual bottle stack · ritual columns
Six panels: dual-bottle hero w/ coral AM + navy PM bottles · split AM/PM ritual columns w/ numbered 3-step routine · 4 clinical conic-ring percentages · 6-tile real-results grid + italic testimonial · 3-tier duo bundle picker · 60-day glow-guarantee seal. For skincare duos, supplements, anything AM/PM.
Outfit Black · sky + sun + pink pop · CSS shower head · 9:14 viral video grid
Six panels: sky hero w/ CSS shower head + drops · top-5 numbered reasons (cloud bg cards) · 3 TikTok-style 9:14 viral videos w/ view-count + happy-customer stat block · 3-step how-it-works w/ 01/02/03 chips · 5 social-proof reasons · ATC card w/ qty + features + 4-up trust grid. For home gadgets, viral consumer products, beauty devices.
DM Serif italic · navy + amber + cream · 8-grid BA results · dual MD portraits
Six panels: cream hero w/ portrait silhouette + amber bottle stack + 65% stat card · 3 subscription plans (topical / capsules / bundle) + difference strip · navy-dark 8-grid 90-day BA face results · dual MD doctor portraits + signed quote · ingredient stack around amber dropper · what-you-get list + 90-day MBG seal. For hair growth, telehealth, custom-compounded subs.
Cobalt bottle + gold label · DM Serif italic · orbit ingredient pills
Six panels: orbit-pill hero · clinical ingredient grid · 3-stat clinical card · week-by-week timeline · 3-col vs comparison · 60-day MBG with tiered sub & save. For men's wellness, longevity, supplements.
Manrope heavy · hot accent · anatomical callouts · countdown urgency
Six panels: brace hero + flash-sale countdown · anatomy with 5 pain dots · 4 clinical-trial stats · 4-step how-to · size guide with measurements · quantity bundles + 4 trust seals + sticky CTA. For orthotics, recovery, medical.
Cormorant italic · blush + rose · wand on cream · press strip
Six panels: floating wand hero · press logos + pull quotes · 6-up shade/mode swatches · before/after with derm panel stats · dermatologist quote card · 4-step ritual + 90-night MBG. For skincare, devices, fragrance, beauty.
Playfair italic · amber bottle · dashed callouts · kraft labels
Six panels: bottle hero with 4 dashed callouts · 6 scent swatches · ingredient spec table · 3-step ritual · vs-drugstore comparison · refill tiers + 60-day MBG amber seal. For grooming, gadgets, considered-objects.
Bebas Neue caps · forest + mint · full-bleed scene · dip tin hero
Six panels: full-bleed forest hero + chip strip · 4 why-cards on dark · 4 mint-on-black stats + UGC quote · cut-open ingredient list · ribbed tier picker with 4 case sizes · 4 perks + 100% refund seal. For outdoor gear, men's wellness, gritty CPG.
Outfit Black · coral + burgundy · twin-card hero · unlock ladder
Six panels: twin-card hero (product + free-gift) · before/after with −lbs delta · gamified gift-unlock ladder with progress bar · 4 reason grid · 3-tier bundle with gift counts and savings · 30-day refund + 3 perks + gold seal. For weight-loss, fitness, beauty CPG.
Fragrance bottle macro · Fraunces italic · cream + gold
Magazine-spread vocabulary: massive italic masthead hero · ultra-zoom amber macro with press quote · scent pyramid with bottle aside · editorial pull quote · ritual moment with hand silhouette · atelier-style buy panel with $185 price + 30-day return. For luxury beauty, fragrance, premium personal care.
Earbuds case render · Space Grotesk · gradient + neon
Apple-style product page: gradient halo hero · open-case inside view with earbuds extracted · spec grid with big numbers · sound waveform feature panel · 4-colourway lineup · clean price + perks + neon CTA. For consumer electronics, gadgets, audio, smart-home.
Sneaker SVG side-view · Oswald + mono · cream + blaze spot
Catalogue-plate vocabulary: stamped drop hero · 4 anatomy callouts · 4 colourway grid with hue-shifted renders · size guide with measurement + size grid · tech-spec table + flat-lay · countdown drop + $140 CTA. For footwear, apparel, streetwear, fashion drops.
Navy + gold · 4 SVG conic progress rings · glow shadow · independent-study footer
Glassy dark navy card with 4 SVG conic-gradient ring stats (99% / 96% / 97% / 99%), each glowing in gold with the percentage centered and a 2-line caption below. Independent-study footer with publisher + report link. For supplements, recovery devices, anything with clinical proof.
Coral pink · Fraunces italic numerals · 6 alternating photo+copy rows
Header eyebrow ★4.84·25k pill + Fraunces italic headline · 6 numbered reason rows that alternate photo-left/photo-right · 54px italic numerals · gradient face squares with bottom corner stripe tag · inline "Discover →" mono link in coral. For period care, supplements, anything 5-7 reasons.
Navy + amber · 4×2 BA grid · featured quote · stat strip
Deep navy background · 4×2 grid of 8 day-0/day-90 before-after pairs (split-tile, top half before / bottom half after) with name + age + DAY 0/90 mono tags · featured verified-quote card with gold-rim avatar · 3-stat strip (65% gain · 12k journeys · 4.9) · "see all 12,400 stories" amber CTA. For hair/skin/body BA, fitness, weight-loss.
Forest + gold · scrolling marquee ticker · rotated 40% stamp · 3-tier picker
Black scrolling marquee ticker (WAREHOUSE SALE · UP TO 40% OFF) · forest-green hero with Archivo Black "PEAK performance alpaca socks" and rotated bone-paper 40% OFF stamp · 4-segment day/hour/min/sec countdown · 4 feature pills · 3-tier 1/3/6-pack picker with active state + ribbons · gold ATC with offset-shadow. For outdoor utility, flash sales, ad-traffic LPs.
Big 1:1 image · thumb rail · zoom hint · live counter · variant strip
Replaces the sneaker carousel. Mobile-first PDP main media: badges (best seller / restocked), favourite + AR + compare rail, side arrows, 1/7 counter, zoom hint, thin progress bar, then a horizontal thumb rail with one 360° tile and one video tile, title/price/stars, in-stock dot, and 6 shade swatches with one sold-out diagonal.
4-step progress · pick 3 · free gift tier · sticky checkout bar
Burgundy header with 4-step stepper · pick-your-3 product grid with ✓ pickers and "most loved" tag · gold dashed gift unlock card · progress bar with 3 reward marks · sticky black footer with savings pill + Continue CTA.
Mini-bottle pictogram · most-popular ribbon · price-per-day · total summary
Pulsing red dot urgency strip · 4 tier rows with mini-bottle quantity pictograms, ribbons (Most popular, Best value), $/day, was/now pricing · dark total card with savings pill · hot ATC bar · 3-up trust strip (free ship · 60-day · 4.9★).
Yellow + hot orange · drag handle · stat trio · 4-pair carousel
Black "verified" eyebrow pill · Archivo Black display headline · drag-to-scrub slider with skin-tone before/after layers and red corner stamps · dark stat trio (96% · 8.4 · 14d) · horizontal carousel of 4 paired thumbnails with red Before/After tags.
Wine + cream · brand logo cells · ✓/✕ pip pills · bottom-line total row
Editorial wine palette · header row with "F" brand mark vs dashed "?" placeholder · 9 comparison rows with checkered ✓/✕ pip pills or text values (−80%, none, 2/250ml) · wine-deep footer row with per-can $15.60 vs per-bottle $36+ totals · sommelier-lab citation + gold-shadow CTA.
Black + accent yellow · big video card · pip rail · verified bar
Moody black surface with yellow accent · video/written segmented control · italic Fraunces pull-quote callout · big 9:14 video card with live pill, duration, blurred play, gradient-baked portrait silhouette and Hannah K. attribution · pip rail of 6 mini video tiles with star ratings · verified-bar with avatar stack + count.
Olive + cream · benefit chip filters · 2-col product grid · "take the quiz" CTA
Olive palette wrap with editorial Fraunces headline · row of 8 benefit chips (Energy, Sleep, Focus, Mood, Skin, Hormones, Recovery) with item counts and selected state · selected-bar showing "Energy & stamina" + clear · 4 product cards with mini-bottle, #1 ribbon, % reorder, was/now price · dark olive CTA to the quiz.
Coral + burgundy · big progress card · "you are here" marker · 4 tier cards
Centered display headline · large burgundy progress card with $41.80-to-next callout, gold→coral bar with 4 ring nodes (hit / hit / next-pulsing / locked) and a "you · $58" speech tooltip · 4 tier cards (Free ship · Shaker · Travel tin · Hoodie) with hit/next/locked states · dark nudge CTA.
Purple + gold · sparkle field · CSS bow-wrapped gift · italic reveal CTA
Deep purple radial with sparkle dots · members-only eyebrow + countdown timer chips · centered italic Fraunces headline · 240px CSS gift box with vertical/horizontal gold ribbon, CSS-drawn bow knot, glowing "?" disc · 3 odds rows · gold gradient reveal-button pill with gold-shadow drop · members-only terms.
Navy + hot red · shimmer bar · live-event row · countdown timer
Hot-red sticky top alert with pulsing dot · mini PDP line with bottle thumb, was/now price · stock card with pulsing live dot, big "14 of 100 left" and animated shimmer fill on a hot-red bar · 3 live-event rows (Hannah bought, Adam added, Lia reviewed) · dark countdown card + qty stepper + hot ATC.
Cream + amber · conic-gradient story rings · 9:14 viewer · shop-the-look pills
Cream surface with 7 stories rail (4 unviewed conic-gradient rings, 3 grey viewed, 1 LIVE flag) · big 9:14 IG viewer with 5 progress bars, sender header, italic Fraunces pull-quote, white shoppable product tag with mini bottle and Shop+ button, and a backdrop-blurred Reply box · footer "Shop the looks" with 4 product pills.
Forest + lime · 5-segment progress · 5 single-select cards · live match meter
Deep-forest stage with Bricolage Grotesque · 5-segment quiz progress with current segment shimmer · "Step 3 of 5 · 60s left" eyebrow · 5 single-select answer cards with icon, title, track-name and lime ring picker · row of "+ pigmentation / + texture" multi-chip refinements · dashed lime match-meter ("62% matched to Veil + Rose Mist") + back/next nav.
Cobalt + gold · CSS conic wheel · pointer triangle · DM Serif italic
Modal popup over dim cobalt backdrop · 8-segment CSS conic wheel (FREE ship, 25% off, $25 off, FREE gift…) with gold pointer triangle, gold-rimmed hub, sparkle field · DM Serif italic headline ("Drop your email, spin to win") · email field row + giant gold-gradient Spin CTA · "no thanks, I'll pay full price" decline.
Kraft + amber · perforated ticket · dashed code · 3 stackable mini coupons
Kraft-paper feel with horizontal receipt stripes · returning-customer top strip · Playfair italic "Your coupon, on the house" · big black perforated coupon with kraft-dashed WELCOME20 code and Copy button · 3-row meta strip (★4.9, used 28x, 1/customer) · 3 small dashed mini-coupons (FREESHIP, SUBSAVE10, MYMINI) + "stack at checkout" footer note.
White SaaS · grip handle · gift progress bar · "often added together" rail
iOS-style cart drawer with grip handle and 3-items pill · green free-ship reward bar at 78% with "$22 to next gift" · 2 line items with qty steppers and Remove · "Often added together" horizontal upsell rail with 3 add cards (Eye Tonic +18%, Cleansing Oil pairs, Sleep Drops try) · sticky totals with $24.60 insider discount + dark Continue → $98.40 checkout button + Shop Pay icons.
Cream + amber · 7 circular thumbs · featured drop hero · 2×2 sub grid
Editorial Fraunces "Browse the full house" headline · scroll rail of 7 gradient-coloured circular thumbnails (Skin, Body, Scent, Tools, Hair, Men, Sleep) with style counts · featured "Spring edit" hero card with amber gradient · 2×2 sub grid of category cards (Scent library, Tools & devices, Body rituals, Skin essentials) with arrow chips · "See everything" dark CTA.
Vocabulary: VITALYS / Daily Multi / NAD+
Dark cobalt hero with ingredient pills orbiting a centered bottle. DM Serif uppercase headline, tiered Buy 1 / 2+1 / 3+2 bundle, Save-25%-with-Refills callout. For men's wellness, longevity, hormone support.
Vocabulary: FLEXLINE / Reflex Co. / Compression Co.
White utility surface, pain-point pill chips, countdown urgency strip, low-stock warning. 3-up quantity selector with Most Popular/Best Value tabs, blunt black ATC. For orthotics, braces, recovery, medical.
Vocabulary: AURAGLO / Refined / Sera
Soft blush gradient hero, floating product, Cormorant italic title, press-logo strip, Benefits/How-to/FAQ tabs. Six-up shade swatch grid, rose ATC. For skincare, fragrance, candles, beauty devices.
Vocabulary: STAG & ROOT / Refined Glow / REGROWTH CO.
Diagrammatic dashed callouts radiating from a centered product to feature labels. Six-up scent/finish swatches, Playfair italic, amber CTA pill. For gadgets, tools, beauty tools, grooming.
Vocabulary: RIDGELINE / NightCo / POV Cam
Full-bleed dark forest hero, product as circular cut-in with scene inside. Bebas Neue display caps, mint accent, value-pill chip strip, ribbed tier picker. For outdoor gear, men's wellness, gritty brand worlds.
Vocabulary: SHAPEX / ShapeCore / ShapeMax
Twin-card hero with FREE-GIFT stacked panels, coral + burgundy palette. Outfit display, key-feature icons, UNLOCKED gift cards, 30-day MBG seal. For weight-loss, fitness gadgets, before/after categories.
Vocabulary: NewHealth / HealthFocus / ShapeMax
Clean white editorial. Source Serif headlines + Inter body. Senior-editor byline, citation block, breadcrumb, sticky ATC. The neutral "magazine" container that disappears behind the story.
Vocabulary: Hannah B / EllaOla / Mama Notes
Diary-tone first-person story with Cormorant italic. Before/after with social-share row mimics the iconic Facebook-style screenshot. Built for parenting, kids, family DTC.
Vocabulary: Lifespan Foundation / Wellness Report
Dark editorial hero with DM Serif italic accent in hot red-orange. MD byline + bio, mechanism breakdown, citation reel. For circulation, longevity, men's-health categories.
Vocabulary: Women's Health Review / Top Picks 2025
Magazine masthead, Playfair italic, burgundy accent. Ranked test table, #1 pick spotlight card, dropcap intro. Built for fragrance, beauty, fashion, lifestyle DTC.
Vocabulary: Resilia / NuChew / Sakoon
Brand-first dark green + lime accent. 5 hero-card reasons, vs-them comparison, FAQ, science strip, 180-day seal. For supplements, oral-care, functional foods.
Vocabulary: HelloNancy · The Lem · soft-launch women's wellness
Space Grotesk + Caveat handwriting · vibrant pink + lemon + acid-green palette · sticker-stamp highlights · diary postit notes · raw illustrated scenes · winner table · CSS lemon-in-hands hero · sticky $89 ATC. For women's wellness, intimate goods, soft-launch DTC.
Skincare PDP vocabulary · ingredient-led
Glassy peach, ice-blue and pearl. Marine collagen serum. Full-bleed gradient zones simulate droplet macros, skin close-ups, cellular details. Built for ingredient-heavy beauty brands.
Cellar/wine PDP vocabulary · craft beverage
Deep wine and warm bone with rose script accents. Zero-proof apéritif. Nine numbered reasons, each on its own full-bleed photo zone. Built for craft beverage, kombucha, ferments.
Athletic supplement PDP vocabulary · spec-led
Deep olive + lime green + bone. Pre-workout tub. Slab Anton headlines, condensed all-caps, milligram-led specs. Built for fitness, sports nutrition, energy.
v1. Editorial wellness direction. Image-slot boxes rather than full-bleed gradient zones — lower imagery integration.
v1. Sticker-pop functional food direction. Card-box image slots; needs full-bleed treatment.
v1. Considered-objects direction. Same imagery limitation — held back from 18/18 by card-only imagery.