Live capture at 1440px, 2026-10-24
How it’s built
- Layout
- A rounded white product page sits within a blue-violet gradient surround. A compact header aligns brand, product links, docs and account actions. Centered dark headline/support lead to paired buttons; below, a wide gradient panel contains pill category labels and a large cropped product-dashboard image. Whether the surround belongs to the site canvas is uncertain.
- Type
- Large centered dark sans heading, compact sans nav/body and small labels; exact fonts unknown.
- Color and surface
- White page, dark navy text, violet actions, blue-violet surround and blue-green light in gradient product panel.
- Components
- Product header, centered proposition/support/actions, gradient feature panel, category pills and dashboard image.
What makes it work
- Clean white page and compact header
- Centered headline/support/paired actions
- Broad gradient feature panel below
- Large interface image anchored within panel
On a new subjectFor a public water-quality lab network, use a clean white page with centered monitoring promise and two actions, then a broad blue-green gradient panel containing an analysis dashboard and small category labels. Replace experiment software; do not imply pictured values are live.
Measured
Fonts loadedwebflow-icons, Inter, IBM Plex Mono, Phosphor
H168px / 400
Body text16px
Page background#fafafa
Text color#151e3d
Page height11,511px
Computed CSS at 1440px, 2026-10-24.
Live behavior
- Today
- Off-white page with navy regular sans text and purple primary actions. A narrow purple announcement strip precedes a finely ruled horizontal header. The centered two-line hero has a large regular-weight statement, smaller supporting text and paired outline/solid rounded rectangular actions. Below is a large rounded purple/teal textured media stage with a dark capsule tab strip and a product-interface image. A white consent bar overlays the desktop lower edge.
- Responsive
- Title changes68px/74.8px desktop to60px/66px tablet and44px/48.4px phone, remaining weight400. Phone wraps it into four lines across358px at16px side margins. Announcement wraps into two lines plus a separate date link. Narrow header keeps identity, count badge and hamburger; the desktop links are not visible. Hero actions become stacked full-width358px controls,48px and58px tall. Tablet retains paired hero actions and the tabbed product stage. Phone instead shows a separate product IMG at0,750.812 with390x338.297px bounds; only its top is visible. The desktop consent bar is not visible in these narrow frames, which show small privacy/chat circles instead; cause is untested.
- Scroll
- At actual scrollY750, the large product-interface illustration occupies the top, followed by a centered16px/26.4px trust line and a horizontal brand-mark row. A lower68px/74.8px statement begins near the bottom but is mostly covered by the fixed141.75px consent bar. Product screenshot labels are image pixels, not the measured page font. The lower statement is selected only as a partial visible sample.
