Liveblocks comments hero with waveform mockup

Liveblocks comments hero with waveform mockup, dark-mode, minimal, dark

Preview image. Unlock full-res

Dark product-feature hero with a category label, centered headline, floating comment cards, and an audio-player mockup with live cursors below.

Summary

A dark feature-specific hero for the Comments product, with a small category label above an oversized centered headline and a partially-revealed audio-player mockup at the bottom that demonstrates threaded comments. Faint comment-bubble cards float in the dark margins to reinforce the theme.

Visual description

The same slim transparent navbar with the Liveblocks wordmark and links sits up top. Centered beneath is a small "Comments" label with a pink speech-bubble icon, then a large white three-line headline, "Enable feedback in your media player effortlessly." A white "Start today for free" button and a ghost "Book a demo" link follow, then a row of three muted feature pills with icons: Realtime, Customizable, Accessible. Dim, low-contrast comment-card placeholders float at the left and right edges. At the bottom, a large rounded panel emerges holding an audio waveform; an active comment thread popover ("Nimesh 36m ago, Can we remove the reverb here?") with a reply box and pink "Comment" button overlays it, and small circular avatars sit along the timeline as live presence cursors.

Key takeaway

Anchoring a feature hero with a single realistic mockup that proves the exact use case (commenting on an audio timeline) rather than a generic product shot. The faint floating comment cards in the dark margins decorate the space while staying on-message. A small icon-led category label above the headline sets context for a feature-level page.

Reuse notes

Good template for a feature or use-case landing page within a larger product, where one concrete scenario sells the capability. Needs a convincing, specific mockup; the floating background cards only read on a dark, low-noise field. The bottom panel is cropped, implying scroll into a fuller demo.

More hero sections

See all

More like this