# pliability // #1 mobility, stretching + recovery app — Design Reference

Schema: Design Details DESIGN.md v3.2
Source: https://pliability.com/
Captured: 2026-10-24
CSS measured: 2026-10-24T08:09:07.343Z at 1440×1000 — https://pliability.com/
Values come from computed CSS; role labels are AI judgments. Live CSS may differ from an older screenshot.
Status: AI analysed; curator review pending
Rubric: 3.2
Observer: google/gemini-3.1-pro-preview
Judge: anthropic/claude-sonnet-5

## Design direction

Pliability features a dark, athletic aesthetic with scroll-triggered animations to demonstrate app functionalities. The UI pairs a modern sans-serif (FK Grotesk) with monospace elements, layered on solid black backgrounds. High contrast is achieved through white text and a vivid yellow-green accent color. Features are presented in rounded glassmorphic or dark-gradient cards. The site blends editorial full-screen visuals with detailed product mockups.

## Classification

- Industry: health
- Site type: Landing, Store
- Business model: Shopping, Software
- Styles: bold, minimal, corporate, dark-mode-athletic, tech-forward
- Platform: Framer
- Technology: Not identified

## Typography

- Display: FK Grotesk Regular — weight 400; size 60px; line-height 60px; tracking -1.8px; Regular (95% role confidence, computed values)
- Heading: FK Grotesk Regular — weight 400; size 40px; line-height 46px; tracking -1.2px; Regular (90% role confidence, computed values)
- Body: FK Grotesk Regular — weight 400; size 16px; line-height 24px; tracking -0.2px; Regular (90% role confidence, computed values)
- Mono: FK Grotesk Mono Medium — weight 500; size 12px; line-height 12px; tracking 1.9px; uppercase (90% role confidence, computed values)

## Functional palette

- Canvas — canvas #000000: color-1: computed rgb(0, 0, 0); AI role: Solid black rgb(0, 0, 0) used as the primary background color across most sections. (95% role confidence, computed values)
- Text — text #FFFFFF: color-4: computed rgb(255, 255, 255); AI role: White rgb(255, 255, 255) used for primary headings and body copy. (95% role confidence, computed values)
- Primary Action — primary action #EDFD3A: color-3: computed rgb(237, 253, 58); AI role: Vivid yellow-green rgb(237, 253, 58) used for 'Start Free' buttons and highlights. (95% role confidence, computed values)
- Muted Text — muted text #8F8F92: color-2: computed rgb(143, 143, 146); AI role: Gray rgb(143, 143, 146) used for secondary text and placeholders. (90% role confidence, computed values)
- Surface — surface #1C1C1E: color-16: computed rgb(28, 28, 30); AI role: Dark gray rgb(28, 28, 30) used for floating bars and some button backgrounds. (85% role confidence, computed values)

## Exact computed CSS inventory

The browser extracted these declarations from rendered DOM at capture time. They are facts, not visual guesses. Image and video pixels are outside this inventory.

### Font configurations

```json
[
  {
    "id": "font-1",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "46px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 25,
    "contexts": [
      {
        "tag": "h2",
        "text": "stretch",
        "top": 2401,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "move",
        "top": 2449,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "recover",
        "top": 2497,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-2",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "24px",
    "lineHeight": "27.6px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 19,
    "contexts": [
      {
        "tag": "span",
        "text": "increase flexibility +",
        "top": 2433,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "mobility",
        "top": 2461,
        "property": "font"
      },
      {
        "tag": "h5",
        "text": "DailyRoutines",
        "top": 13609,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-3",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "60px",
    "lineHeight": "60px",
    "letterSpacing": "-1.8px",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "h1",
        "text": "Daily mobility for everyone.",
        "top": 398,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Join",
        "top": 5574,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "thousands worldwide",
        "top": 5574,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-4",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "48px",
    "lineHeight": "51.8px",
    "letterSpacing": "-1.4px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h3",
        "text": "91",
        "top": 24828,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "83",
        "top": 24828,
        "property": "font"
      },
      {
        "tag": "h3",
        "text": "56",
        "top": 24828,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-5",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "20px",
    "lineHeight": "26px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "h6",
        "text": "%",
        "top": 24849,
        "property": "font"
      },
      {
        "tag": "h6",
        "text": "%",
        "top": 24849,
        "property": "font"
      },
      {
        "tag": "h6",
        "text": "%",
        "top": 24849,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-6",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "48px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "Create your own unique routine with pliability",
        "top": 6487,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "with pliability",
        "top": 6485,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "Mobility that adapts to you.",
        "top": 13485,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-7",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "60px",
    "lineHeight": "69px",
    "letterSpacing": "-1.8px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "h2",
        "text": "What people",
        "top": 21628,
        "property": "font"
      },
      {
        "tag": "h2",
        "text": "are saying",
        "top": 21688,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-8",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "16.1px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 34,
    "contexts": [
      {
        "tag": "p",
        "text": "Login",
        "top": 67,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Start Free",
        "top": 67,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Explore teams",
        "top": 26066,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-9",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "13px",
    "lineHeight": "14px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 24,
    "contexts": [
      {
        "tag": "p",
        "text": "Upper Body Intensive",
        "top": 13807,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Full Body",
        "top": 13821,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Lower Body",
        "top": 13821,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-10",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "13px",
    "lineHeight": "16px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 24,
    "contexts": [
      {
        "tag": "p",
        "text": "12 min",
        "top": 13837,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "22 min",
        "top": 13837,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "12 min",
        "top": 13837,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-11",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "9px",
    "lineHeight": "14px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 24,
    "contexts": [
      {
        "tag": "p",
        "text": "Today",
        "top": 13735,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Monday",
        "top": 13735,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Today",
        "top": 13735,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-12",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 16,
    "contexts": [
      {
        "tag": "p",
        "text": "Tailored stretching routines that help you recover faster, move better, and stay ahead of injury.",
        "top": 622,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Expert-led mobility sessions combine stretching, breath work and recovery science to erase tightness",
        "top": 1252,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "show improved performance",
        "top": 24829,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-13",
    "family": "FK Grotesk Mono Medium",
    "fontStack": "\"FK Grotesk Mono Medium\", \"FK Grotesk Mono Medium Placeholder\", monospace",
    "weight": "500",
    "size": "12px",
    "lineHeight": "12px",
    "letterSpacing": "1.9px",
    "traits": "uppercase",
    "count": 13,
    "contexts": [
      {
        "tag": "p",
        "text": "Relieve pain",
        "top": 6757,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "GOLF",
        "top": 6757,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "deskbound",
        "top": 6757,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-14",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 13,
    "contexts": [
      {
        "tag": "p",
        "text": "Sciatica-friendly mobility routine",
        "top": 6809,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Neck and shoulder mobility to reduce tightness",
        "top": 6809,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Lower back stretch session for daily relief",
        "top": 6809,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-15",
    "family": "FK Grotesk Mono Medium",
    "fontStack": "\"FK Grotesk Mono Medium\", \"FK Grotesk Mono Medium Placeholder\", monospace",
    "weight": "500",
    "size": "10px",
    "lineHeight": "20px",
    "letterSpacing": "2px",
    "traits": "Regular",
    "count": 12,
    "contexts": [
      {
        "tag": "p",
        "text": "{ PERFORMANCE }",
        "top": 27712,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "{",
        "top": 27715,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "}",
        "top": 27715,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-16",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "19.6px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 9,
    "contexts": [
      {
        "tag": "p",
        "text": "HYROX",
        "top": 65,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Mobility Test",
        "top": 65,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Relief + Recovery",
        "top": 65,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-17",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "15.6px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 8,
    "contexts": [
      {
        "tag": "p",
        "text": "First Week Free. Cancel Anytime.",
        "top": 6029,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Shannon K.",
        "top": 22845,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Ari B.",
        "top": 22221,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-18",
    "family": "FK Grotesk Mono Medium",
    "fontStack": "\"FK Grotesk Mono Medium\", \"FK Grotesk Mono Medium Placeholder\", monospace",
    "weight": "500",
    "size": "12px",
    "lineHeight": "19.8px",
    "letterSpacing": "1.2px",
    "traits": "Regular",
    "count": 8,
    "contexts": [
      {
        "tag": "p",
        "text": "TRAINING",
        "top": 27712,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "SPORTS",
        "top": 27712,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "FOR YOU",
        "top": 27712,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-19",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "18px",
    "lineHeight": "27.9px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 7,
    "contexts": [
      {
        "tag": "p",
        "text": "\"I've been with pliability since before the rebrand. I also have been a CrossFit instructor since 20",
        "top": 22893,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "\"This blows everything and anything I've ever done for mobility out of the water! The subscription i",
        "top": 22269,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "\"The pliability app has been a game-changer for me—not just for the stretches, but for the quiet mom",
        "top": 23285,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-20",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "18px",
    "lineHeight": "23.4px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "p",
        "text": "Free trial, cancel online",
        "top": 25949,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Access over 2000+ routines",
        "top": 25949,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Personalized onboarding",
        "top": 25949,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-21",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "p",
        "text": "Pre-Race SessionDay 1",
        "top": 13770,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Pre-Race SessionDay 2",
        "top": 13856,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Pre-Race SessionDay 3",
        "top": 13942,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-22",
    "family": "FK Grotesk Mono Regular",
    "fontStack": "\"FK Grotesk Mono Regular\", \"FK Grotesk Mono Regular Placeholder\", monospace",
    "weight": "400",
    "size": "12px",
    "lineHeight": "13.8px",
    "letterSpacing": "1px",
    "traits": "Regular",
    "count": 4,
    "contexts": [
      {
        "tag": "p",
        "text": "APPLE APP STORE AND GOOGLE PLAY RATINGS",
        "top": 25849,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "APPLE APP STORE AND GOOGLE PLAY STORE",
        "top": 25849,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "THAT'S 6.5 YEARS OF RECOVERY EVERY MONTH",
        "top": 25849,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-23",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "10px",
    "lineHeight": "14.9px",
    "letterSpacing": "1.6px",
    "traits": "uppercase",
    "count": 4,
    "contexts": [
      {
        "tag": "p",
        "text": "RUNNING",
        "top": 13725,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Tempo Run",
        "top": 13769,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "cooldown",
        "top": 13872,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-24",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "12px",
    "lineHeight": "15.6px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "Try free for 7 days.",
        "top": 356,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Trusted by athletes + everyday people",
        "top": 5537,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "thousands of members in 100+ countries love us",
        "top": 22145,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-25",
    "family": "FK Grotesk Mono Regular",
    "fontStack": "\"FK Grotesk Mono Regular\", \"FK Grotesk Mono Regular Placeholder\", monospace",
    "weight": "400",
    "size": "12px",
    "lineHeight": "14.4px",
    "letterSpacing": "0.5px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "10,000+",
        "top": 5843,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "5 STAR",
        "top": 5843,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "REVIEWS",
        "top": 5843,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-26",
    "family": "FK Grotesk",
    "fontStack": "\"FK Grotesk\", \"FK Grotesk Placeholder\", sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "17.4px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 3,
    "contexts": [
      {
        "tag": "p",
        "text": "26 min",
        "top": 13806,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "26 min",
        "top": 13892,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "26 min",
        "top": 13978,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-27",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "16px",
    "lineHeight": "24px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "Users who stretched a minimum of 3x a week saw a 30% increase in their mobility after just 2 weeks o",
        "top": 3131,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Contact support.",
        "top": 26454,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-28",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "14px",
    "lineHeight": "20px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "Get 7 Days free",
        "top": 1007,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "Then C$14.16/month",
        "top": 1029,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-29",
    "family": "FK Grotesk Mono Medium",
    "fontStack": "\"FK Grotesk Mono Medium\", \"FK Grotesk Mono Medium Placeholder\", monospace",
    "weight": "500",
    "size": "10px",
    "lineHeight": "20px",
    "letterSpacing": "1px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "p",
        "text": "#1 MOBILITY APP",
        "top": 854,
        "property": "font"
      },
      {
        "tag": "p",
        "text": "#1 MOBILITY APP",
        "top": 5797,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-30",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "16px",
    "lineHeight": "20px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Start Your Free Trial",
        "top": 5953,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-31",
    "family": "FK Grotesk Mono Regular",
    "fontStack": "\"FK Grotesk Mono Regular\", \"FK Grotesk Mono Regular Placeholder\", monospace",
    "weight": "400",
    "size": "12px",
    "lineHeight": "13.8px",
    "letterSpacing": "0.2px",
    "traits": "uppercase",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Our Data says",
        "top": 3107,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-32",
    "family": "FK Grotesk",
    "fontStack": "\"FK Grotesk\", \"FK Grotesk Placeholder\", sans-serif",
    "weight": "400",
    "size": "12px",
    "lineHeight": "16px",
    "letterSpacing": "-0.1px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Currently available on iOS.",
        "top": 15137,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-33",
    "family": "FK Grotesk Mono Medium",
    "fontStack": "\"FK Grotesk Mono Medium\", \"FK Grotesk Mono Medium Placeholder\", monospace",
    "weight": "500",
    "size": "10px",
    "lineHeight": "17.4px",
    "letterSpacing": "-0.1px",
    "traits": "uppercase",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "Your custom HYROX program",
        "top": 13731,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-34",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "24px",
    "lineHeight": "28.8px",
    "letterSpacing": "-0.2px",
    "traits": "Regular",
    "count": 31,
    "contexts": [
      {
        "tag": "div",
        "text": "Power through every station",
        "top": 1966,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "Power through",
        "top": 1964,
        "property": "font"
      },
      {
        "tag": "div",
        "text": "Stronger starts with mobility",
        "top": 1966,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-35",
    "family": "FK Grotesk Medium",
    "fontStack": "\"FK Grotesk Medium\", \"FK Grotesk Medium Placeholder\", sans-serif",
    "weight": "500",
    "size": "12px",
    "lineHeight": "14.4px",
    "letterSpacing": "normal",
    "traits": "Regular",
    "count": 15,
    "contexts": [
      {
        "tag": "span",
        "text": "HYROX",
        "top": 1565,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "TRAINING",
        "top": 1565,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "RUNNING",
        "top": 1565,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-36",
    "family": "FK Grotesk Regular",
    "fontStack": "\"FK Grotesk Regular\", \"FK Grotesk Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "46px",
    "letterSpacing": "-1.2px",
    "traits": "italic",
    "count": 5,
    "contexts": [
      {
        "tag": "span",
        "text": "targeted routines",
        "top": 14346,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "over time",
        "top": 14346,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "instant feedback",
        "top": 14346,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-37",
    "family": "FK Grotesk Variable Variable Regular",
    "fontStack": "\"FK Grotesk Variable Variable Regular\", \"FK Grotesk Variable Variable Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "14px",
    "lineHeight": "14px",
    "letterSpacing": "0.3px",
    "traits": "uppercase",
    "count": 3,
    "contexts": [
      {
        "tag": "span",
        "text": "PERFORMANCE",
        "top": 1456,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "RECOVERY & RELIEF",
        "top": 1456,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "LIFESTYLE",
        "top": 1456,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-38",
    "family": "FK Grotesk Variable Variable Regular",
    "fontStack": "\"FK Grotesk Variable Variable Regular\", \"FK Grotesk Variable Variable Regular Placeholder\", sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "46px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 2,
    "contexts": [
      {
        "tag": "span",
        "text": "For people who want to",
        "top": 1117,
        "property": "font"
      },
      {
        "tag": "span",
        "text": "move better, every day.",
        "top": 1163,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-39",
    "family": "FK Grotesk Italic",
    "fontStack": "\"FK Grotesk Italic\", \"FK Grotesk Italic Placeholder\", sans-serif",
    "weight": "400",
    "size": "60px",
    "lineHeight": "60px",
    "letterSpacing": "-1.8px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "everyone.",
        "top": 449,
        "property": "font"
      }
    ]
  },
  {
    "id": "font-40",
    "family": "FK Grotesk Italic",
    "fontStack": "\"FK Grotesk Italic\", \"FK Grotesk Italic Placeholder\", sans-serif",
    "weight": "400",
    "size": "40px",
    "lineHeight": "48px",
    "letterSpacing": "-1.2px",
    "traits": "Regular",
    "count": 1,
    "contexts": [
      {
        "tag": "span",
        "text": "to you.",
        "top": 13483,
        "property": "font"
      }
    ]
  }
]
```

### Color configurations

```json
[
  {
    "id": "color-1",
    "hex": "#000000",
    "alpha": 1,
    "cssValue": "rgb(0, 0, 0)",
    "count": 61,
    "contexts": [
      {
        "tag": "body",
        "text": "html body { background: var(--token-e1bc9e3a-bc04-42e7-a0e8-02510d5c00d9, rgb(0, 0, 0)); }LoginStart",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "div",
        "text": "LoginStart FreeHYROXMobility TestRelief + RecoveryTeamsStoriesShopTry free for 7 days.Daily mobility",
        "top": 0,
        "property": "background"
      },
      {
        "tag": "p",
        "text": "Start Free",
        "top": 67,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-2",
    "hex": "#8F8F92",
    "alpha": 1,
    "cssValue": "rgb(143, 143, 146)",
    "count": 106,
    "contexts": [
      {
        "tag": "span",
        "text": "For people who want to",
        "top": 1117,
        "property": "text"
      },
      {
        "tag": "p",
        "text": "Expert-led mobility sessions combine stretching, breath work and recovery science to erase tightness",
        "top": 1252,
        "property": "text"
      },
      {
        "tag": "div",
        "text": "",
        "top": 6758,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-3",
    "hex": "#EDFD3A",
    "alpha": 1,
    "cssValue": "rgb(237, 253, 58)",
    "count": 49,
    "contexts": [
      {
        "tag": "a",
        "text": "Start Free",
        "top": 54,
        "property": "control-background"
      },
      {
        "tag": "p",
        "text": "Try free for 7 days.",
        "top": 356,
        "property": "text"
      },
      {
        "tag": "button",
        "text": "Start Free",
        "top": 713,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-4",
    "hex": "#FFFFFF",
    "alpha": 1,
    "cssValue": "rgb(255, 255, 255)",
    "count": 213,
    "contexts": [
      {
        "tag": "p",
        "text": "Login",
        "top": 67,
        "property": "text"
      },
      {
        "tag": "h1",
        "text": "Daily mobility for everyone.",
        "top": 398,
        "property": "text"
      },
      {
        "tag": "span",
        "text": "move better, every day.",
        "top": 1163,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-5",
    "hex": "#FFFFFF",
    "alpha": 0.10196078431372549,
    "cssValue": "rgba(255, 255, 255, 0.1)",
    "count": 10,
    "contexts": [
      {
        "tag": "div",
        "text": "Tempo Run",
        "top": 13764,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-6",
    "hex": "#FFFFFF",
    "alpha": 0.7490196078431373,
    "cssValue": "rgba(255, 255, 255, 0.75)",
    "count": 6,
    "contexts": [
      {
        "tag": "span",
        "text": "Join",
        "top": 5574,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-7",
    "hex": "#000000",
    "alpha": 0.4,
    "cssValue": "rgba(0, 0, 0, 0.4)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "LoginStart FreeHYROXMobility TestRelief + RecoveryTeamsStoriesShop",
        "top": 40,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-8",
    "hex": "#000000",
    "alpha": 0.5490196078431373,
    "cssValue": "rgba(0, 0, 0, 0.55)",
    "count": 15,
    "contexts": [
      {
        "tag": "div",
        "text": "HYROX",
        "top": 1550,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-9",
    "hex": "#FFFFFF",
    "alpha": 0.30196078431372547,
    "cssValue": "rgba(255, 255, 255, 0.3)",
    "count": 14,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 2401,
        "property": "background"
      },
      {
        "tag": "p",
        "text": "Sciatica-friendly mobility routine",
        "top": 6809,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-10",
    "hex": "#FFFFFF",
    "alpha": 0.7019607843137254,
    "cssValue": "rgba(255, 255, 255, 0.7)",
    "count": 4,
    "contexts": [
      {
        "tag": "span",
        "text": "everyone.",
        "top": 449,
        "property": "text"
      },
      {
        "tag": "p",
        "text": "Interested in pliability for your organization? Plans start as low as $6.95 / user per month.",
        "top": 26080,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-11",
    "hex": "#1C1C1E",
    "alpha": 0.9019607843137255,
    "cssValue": "rgba(28, 28, 30, 0.9)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Get 7 Days freeThen C$14.16/monthGet Started",
        "top": 992,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-12",
    "hex": "#000000",
    "alpha": 0.23921568627450981,
    "cssValue": "rgba(0, 0, 0, 0.24)",
    "count": 1,
    "contexts": [
      {
        "tag": "form",
        "text": "#input-ro::placeholder { color: var(--token-e8072887-f0ee-478a-926f-c07e34addb41, rgb(143, 143, 146)",
        "top": 706,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-13",
    "hex": "#FFFFFF",
    "alpha": 0.9019607843137255,
    "cssValue": "rgba(255, 255, 255, 0.9)",
    "count": 15,
    "contexts": [
      {
        "tag": "button",
        "text": "",
        "top": 1550,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-14",
    "hex": "#161617",
    "alpha": 1,
    "cssValue": "rgb(22, 22, 23)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "feeling stiffness in lower bodyfeeling stiffnes",
        "top": 6834,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-15",
    "hex": "#FFFFFF",
    "alpha": 0.12156862745098039,
    "cssValue": "rgba(255, 255, 255, 0.12)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "thousands of members in 100+ countries love us",
        "top": 22129,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-16",
    "hex": "#1C1C1E",
    "alpha": 1,
    "cssValue": "rgb(28, 28, 30)",
    "count": 3,
    "contexts": [
      {
        "tag": "button",
        "text": "RECOVERY & RELIEF",
        "top": 1444,
        "property": "control-background"
      },
      {
        "tag": "div",
        "text": "Trusted by athletes + everyday people",
        "top": 5531,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-17",
    "hex": "#000000",
    "alpha": 0.5019607843137255,
    "cssValue": "rgba(0, 0, 0, 0.5)",
    "count": 16,
    "contexts": [
      {
        "tag": "div",
        "text": "Monday",
        "top": 13733,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-18",
    "hex": "#000000",
    "alpha": 0.7019607843137254,
    "cssValue": "rgba(0, 0, 0, 0.7)",
    "count": 1,
    "contexts": [
      {
        "tag": "p",
        "text": "NO PAYMENT REQUIRED. CANCEL ANYTIME.",
        "top": 25836,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-19",
    "hex": "#1A1A1A",
    "alpha": 1,
    "cssValue": "rgb(26, 26, 26)",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "Explore teams",
        "top": 26058,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-20",
    "hex": "#EBFF3C",
    "alpha": 0.2,
    "cssValue": "rgba(237, 253, 58, 0.2)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "Try free for 7 days.",
        "top": 350,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-21",
    "hex": "#3A3A3C",
    "alpha": 1,
    "cssValue": "rgb(58, 58, 60)",
    "count": 6,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 26440,
        "property": "background"
      },
      {
        "tag": "line",
        "text": "",
        "top": 1056,
        "property": "svg-stroke"
      }
    ]
  },
  {
    "id": "color-22",
    "hex": "#A5A5A5",
    "alpha": 0.2,
    "cssValue": "rgba(165, 165, 165, 0.2)",
    "count": 1,
    "contexts": [
      {
        "tag": "a",
        "text": "Login",
        "top": 54,
        "property": "control-background"
      }
    ]
  },
  {
    "id": "color-23",
    "hex": "#FFFFFF",
    "alpha": 0.2,
    "cssValue": "rgba(255, 255, 255, 0.2)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 2118,
        "property": "background"
      }
    ]
  },
  {
    "id": "color-24",
    "hex": "#FFFFFF",
    "alpha": 0.1607843137254902,
    "cssValue": "rgba(255, 255, 255, 0.16)",
    "count": 4,
    "contexts": [
      {
        "tag": "form",
        "text": "#input-ro::placeholder { color: var(--token-e8072887-f0ee-478a-926f-c07e34addb41, rgb(143, 143, 146)",
        "top": 706,
        "property": "border"
      }
    ]
  },
  {
    "id": "color-25",
    "hex": "#333333",
    "alpha": 1,
    "cssValue": "rgb(51, 51, 51)",
    "count": 8,
    "contexts": [
      {
        "tag": "span",
        "text": "{",
        "top": 27715,
        "property": "text"
      }
    ]
  },
  {
    "id": "color-26",
    "hex": "#D1D1D6",
    "alpha": 1,
    "cssValue": "rgb(209, 209, 214)",
    "count": 1,
    "contexts": [
      {
        "tag": "div",
        "text": "",
        "top": 25509,
        "property": "background"
      }
    ]
  }
]
```

### Extraction limits

- Font families are computed CSS declarations, not optical font identification.
- Colors are computed CSS converted by the browser to sRGB; image/video pixels and gradient stops are not sampled.
- Transparent colors are recorded with alpha but excluded from opaque palette role assignments.
- Only currently rendered DOM elements are sampled; closed shadow roots and iframe contents are excluded.

## Type, spacing, and shape language

- Spacing rhythm: Generous vertical padding between main sections, often leveraging full-viewport heights to accommodate scroll-linked narratives.
- Corner style: Rounded corners are prominent on interactive elements (buttons, inputs) and product cards.
- Radius: Buttons appear fully rounded (pill-shaped). Cards have medium border radii (e.g., product cards, testimonials).
- Borders: Mostly borderless designs relying on background contrast. Occasional subtle semi-transparent white borders (color-24) on inputs or cards.
- Buttons: Solid fill (color-3) with contrasting dark text for primary actions. Pill shape.
- Content width: Centered layouts with constrained widths for text readability, expanding to full-width for media and grids.
- Density: Low density. High reliance on negative space to draw focus to central animations and large typography.
- Evidence: Visual inspection of the crops shows pill buttons, full-width dark backgrounds, and centered alignments.

## Sections

Gallery section count: 10. Each entry corresponds to one gallery capture.

1. **Hero — Daily Mobility Signup Hero** (Home)
   AI suggestion (98% confidence): Complete full-bleed hero with integrated navigation, bold mobility imagery, value proposition, email CTA, and app-ranking trust mark.
   Capture: 1440×963px; page bounds 39–1002px of 26954px; source section ID: `aa4af055-9c18-49cc-a873-199dc5c8646d`; image: https://media.designdetails.io/library/63ef5dbfb558b596bf516d2de84259d646e669aa13c4476e7a23c1a04cabf62c/aa4af055-9c18-49cc-a873-199dc5c8646d.webp
   SECTION.md v3.2: `aa4af055-9c18-49cc-a873-199dc5c8646d` (deterministic evidence; editorial review pending)
2. **Features — Mobility Goals Card Carousel** (Home)
   AI suggestion (93% confidence): Complete use-case discovery section with headline, explanatory copy, category tabs, large image cards, and carousel controls.
   Capture: 1440×1155px; page bounds 1005–2160px of 26954px; source section ID: `a31004d8-7f3c-4bca-aa4e-0d2749e23bf0`; image: https://media.designdetails.io/library/1b0cbe0b43cdbeff0f6f7959f4855b1f84f50a40d433483d381e87079e458f22/a31004d8-7f3c-4bca-aa4e-0d2749e23bf0.webp
   SECTION.md v3.2: `a31004d8-7f3c-4bca-aa4e-0d2749e23bf0` (deterministic evidence; editorial review pending)
3. **CTA — Join Thousands Worldwide Trial CTA** (Home)
   AI suggestion (98% confidence): Complete, self-contained conversion section with athlete imagery, social proof, app ratings, a bold headline, and a prominent free-trial button.
   Capture: 1440×1059px; page bounds 5251–6310px of 26954px; source section ID: `36a132c3-3994-4f42-bf74-0e1a373f7998`; image: https://media.designdetails.io/library/3c823f403d9f1518f61874c06fc5bff002eb7c73bc896abf9693c778edadee87/36a132c3-3994-4f42-bf74-0e1a373f7998.webp
   SECTION.md v3.2: `36a132c3-3994-4f42-bf74-0e1a373f7998` (deterministic evidence; editorial review pending)
4. **Features — Favorites Library** (Home)
   AI suggestion (90% confidence): Self-contained feature section explaining saved favorites through a heading and a coordinated visual library of session cards; the repeated lower arrangement is part of the overall showcase.
   Capture: 1440×1419px; page bounds 11828–13247px of 26954px; source section ID: `5971bb66-a5ff-4edc-9e97-f3ceb84591b2`; image: https://media.designdetails.io/library/9716a3d7588ab57ae45b2586533f8aa93802f6b6efe51a184d78c1b3e976603d/5971bb66-a5ff-4edc-9e97-f3ceb84591b2.webp
   SECTION.md v3.2: `5971bb66-a5ff-4edc-9e97-f3ceb84591b2` (deterministic evidence; editorial review pending)
5. **Feature Grid — Mobility Routines** (Home)
   AI suggestion (96% confidence): Complete three-card grid presenting daily routines, smart routines, and custom programs under a shared heading.
   Capture: 1440×726px; page bounds 13480–14206px of 26954px; source section ID: `1ba36f80-c758-4376-85e4-d5d07784ed8b`; image: https://media.designdetails.io/library/a252a1fdaacbae7c4d0eb7cd4b82021ba6cbad3103ca7863c3a888304f8f221c/1ba36f80-c758-4376-85e4-d5d07784ed8b.webp
   SECTION.md v3.2: `1ba36f80-c758-4376-85e4-d5d07784ed8b` (deterministic evidence; editorial review pending)
6. **Feature Card — Track Your Progress Over Time** (Home)
   AI suggestion (91% confidence): Complete product-feature showcase with its own heading, progress analytics UI, circular visual system, and supporting workout imagery; stronger and more distinctive than the repeated routine-tracking pattern below.
   Capture: 1440×927px; page bounds 16239–17166px of 26954px; source section ID: `0ecb8dc0-356d-4431-bb5a-43aacffadb45`; image: https://media.designdetails.io/library/6c5ba10540319e9eede46691c7fe65d7f7bcbdcd9bc82aaebb07c188b5104545/0ecb8dc0-356d-4431-bb5a-43aacffadb45.webp
   SECTION.md v3.2: `0ecb8dc0-356d-4431-bb5a-43aacffadb45` (deterministic evidence; editorial review pending)
7. **Testimonials — What people are saying** (Home)
   AI suggestion (96% confidence): Complete testimonial showcase with a clear heading, social-proof badges, customer quotes, and varied member video imagery, ending before the data section begins.
   Capture: 1440×1596px; page bounds 21628–23224px of 26954px; source section ID: `3bb6bdc5-fb9d-4dc3-9664-9415933160e9`; image: https://media.designdetails.io/library/6fec59b9cb900d8147fde742d9b460e5ce6daa053246163fba0dd72cee385566/3bb6bdc5-fb9d-4dc3-9664-9415933160e9.webp
   SECTION.md v3.2: `3bb6bdc5-fb9d-4dc3-9664-9415933160e9` (deterministic evidence; editorial review pending)
8. **CTA — Begin Your Mobility Journey** (Home)
   AI suggestion (96% confidence): Complete conversion section with a free-trial headline, credibility metrics, prominent Get Started card, benefit strip, and teams option.
   Capture: 1440×789px; page bounds 23985–24774px of 26954px; source section ID: `14c2201c-26a4-4d51-a521-9fc7cd73d101`; image: https://media.designdetails.io/library/149d0cd482adc164e5d07205e238667cace7cf87a59957cc08cb3001ff6e8782/14c2201c-26a4-4d51-a521-9fc7cd73d101.webp
   SECTION.md v3.2: `14c2201c-26a4-4d51-a521-9fc7cd73d101` (deterministic evidence; editorial review pending)
9. **FAQ — Frequently Asked Questions** (Home)
   AI suggestion (98% confidence): Complete two-column FAQ component with support prompt and six clearly bounded accordion questions.
   Capture: 1440×855px; page bounds 24930–25785px of 26954px; source section ID: `1021527a-3fc7-4039-8100-a317fae68312`; image: https://media.designdetails.io/library/da6b6f5bf99951bb21dca1d11983e9bc3f103630a12a05073ffdd6ab5c493096/1021527a-3fc7-4039-8100-a317fae68312.webp
   SECTION.md v3.2: `1021527a-3fc7-4039-8100-a317fae68312` (deterministic evidence; editorial review pending)
10. **Footer — Pliability Mega Footer** (Home)
   AI suggestion (97% confidence): Complete page footer with an oversized brand wordmark, organized navigation link groups, branded performance/lifestyle/recovery graphic, and copyright line.
   Capture: 1440×954px; page bounds 26000–26954px of 26954px; source section ID: `d394ee4c-b709-4c3f-b5f7-6fbbd8d4c33e`; image: https://media.designdetails.io/library/8837b07ef1f7eda18a5ecf6b7bbf2106abe9c199079f0942436696e3cf77a71f/d394ee4c-b709-4c3f-b5f7-6fbbd8d4c33e.webp
   SECTION.md v3.2: `d394ee4c-b709-4c3f-b5f7-6fbbd8d4c33e` (deterministic evidence; editorial review pending)

## Capture and motion evidence

- Desktop screenshot: https://media.designdetails.io/library/f7503a9a807eea3b1ac9ff20c2255ab175f3ac31775980bdf4cf8ca01311fbad/desktop_full-0f06ccbe-2026-10-24T08-09-07-367Z.jpg
- Mobile screenshot: https://media.designdetails.io/library/f6e626cd0b246aff09f93d1b465bfae3c920e4dc808768f5582207e7f8b88854/mobile_full-0f06ccbe-2026-10-24T08-10-12-193Z.jpg
- Open Graph image: https://media.designdetails.io/library/6fcc1d2f406c02c5aa22d227e3a296ad7ac4e3e0ad48ac087b30d527afcf740e/og_image-0f06ccbe-2026-10-24T08-09-16-156Z.webp
- Full-page video: https://media.designdetails.io/library/33e85665a0ffec41af48a8ec2fea01e4d85321bebc267889de9915e770ea81a7/motion-1792830479681.mp4
- Video poster: https://media.designdetails.io/library/042ef80bc76b2349798d2fcb969abe097835e578a7d72d2520396d273e55f161/motion-poster-1792830479681.webp
- Motion status: Recording attached. Consult the motion score and section motion records; do not infer exact easing from frames alone.

## Implementation contract

- Treat computed CSS values, screenshot dimensions, and section bounds as measured evidence.
- Treat typography roles, palette roles, style labels, quality scores, and prose analysis as model or curator judgments.
- Rebuild the page in the listed section order. Request SECTION.md v3.2 using the listed ID. Promoted IDs include editorial observation and judgment; raw gallery IDs still return deterministic geometry, site design facts, media treatment, and explicit evidence gaps.
- Do not invent exact responsive behavior, motion curves, or hidden interaction states when they were not captured.

## Reusable components

- Navigation Bar
- Hero With Background Imagery
- Input Field
- Primary Button
- Product Card
- Feature Collection
- Testimonial Card
- Footer
- Floating Product Card
- Badge
- Media Bar
- Split Screen Video Comparison
- Scroll Linked Narrative Sequence
- Floating Parallax Grid

## Quality rubric

Overall: 57.8/100 (Competent)
Evidence coverage: 100%
Judge tier: Competent
Verdict: Pliability executes a polished, internally consistent dark-athletic marketing site: a disciplined type and color system, a reusable card component, and an ambitious sequence of scroll-linked narrative animations that map onto the product's real feature set. But every major device—the FK Grotesk/mono pairing, the single accent-on-black palette, the scroll-scrubbed video comparisons, the circular score visualizations, the parallax testimonial wall—belongs to an already well-established app-marketing template shared by close competitors. The result is competent, professional, and content-integrated, but it doesn't introduce a hard-to-substitute idea in any axis, keeping it at the 'competent' tier rather than 'good' or above.

- Typography (15%): 63 — A single family (FK Grotesk) is stretched across Regular/Medium/Italic weights and a dedicated Mono variant to create a legible role hierarchy (60px display, 40px heading, 16px body, 12px uppercase mono labels) with consistent negative tracking at large sizes. Execution is clean and restrained, but the system itself (tight-tracked display sans + uppercase mono data labels) is a familiar contemporary SaaS/app convention rather than a distinctive typographic idea.
- Color (10%): 55 — Palette is disciplined and high-contrast: solid black canvas, white text, a single vivid yellow-green accent (#EDFD3A) reserved for CTAs/highlights, with gray (#8F8F92) for secondary text and #1C1C1E for surfaces. This is executed consistently but is a now-ubiquitous 'dark mode + one punch accent' formula with little internal color nuance or secondary palette tension.
- Layout (20%): 62 — The page runs through a conventional but well-assembled marketing sequence (hero → feature narrative → routine builder cards → mobility-score visualization → testimonial grid → footer), with a reusable card component (routine/favorite cards with Goal/Time metadata) recurring across sections and generous negative space throughout. Structurally this is coherent, but the overall scaffolding (hero, feature stack, testimonial wall, mega-footer with link columns) is standard app-marketing architecture rather than an unconventional composition.
- Motion (20%): 66 — Motion is the most developed axis: a vertical-line video-mask comparison tied to word-by-word text highlighting, a multi-stage input→thumbnail→card reveal sequence mirroring the app's actual user flow, a separate UI feature-reveal sequence (video-in-circle to score dashboards), and a parallax testimonial grid with elements moving at different speeds — all reversible on scroll-up per the observation. This is a reasonably coherent multi-section scroll-narrative system, though its building blocks (split-screen reveal, parallax cards, scroll-linked progress circles) are common in contemporary product sites and no frame-rate/smoothness evidence is available to confirm top-tier polish.
- Originality (25%): 45 — Every signature move here — FK Grotesk/mono pairing, black-canvas-with-one-accent palette, scroll-scrubbed video-mask comparisons, circular mobility-score rings, parallax testimonial walls — is now a recognizable convention across fitness/health/app marketing sites (including direct peers like Whoop, which is even cross-linked in the footer). The execution is competent but nothing here constitutes a hard-to-substitute idea; it reads as a well-produced instance of an established genre template rather than a distinct point of view.
- Content (10%): 60 — Content and design are reasonably fused: the routine/favorite card component carries real app metadata (Goal, Time, category tag) and is reused consistently; the mobility-score visualization directly stages the product's actual measurement feature; testimonials mix text quotes and short video clips. The footer's four-category link taxonomy (Training/Sports/For You/Relief) is systematically organized and mirrors the product's own content structure.

Coverage: 100% of the current weighted rubric. Compare overall scores only at similar evidence coverage.

Formula: weighted mean of scored axes — Typography 15%, Color 10%, Layout 20%, Motion 20%, Originality 25%, Content 10%. Inconclusive and not-assessed axes are excluded and coverage is shown explicitly.

## Verification checklist

- [x] Score evidence
- [x] Design tokens
- [x] Functional palette
- [x] Normalized sections
- [x] Reusable components
- [x] Typography roles

## Curator notes

A near black palette with one punchy yellow accent keeps focus on the full bleed training photo and the italic 'everyone' headline, giving the page an athletic, confident mood. Category tabs and a scrollable row of photo cards let visitors quickly scan HYROX, running and recovery use cases instead of reading paragraphs.

## Usage guidance

Use this record as design evidence. Combine it with other references and create an original implementation; do not reproduce the source website or its proprietary copy and assets.