heroBeginneranimation

Poster Hero

Concert-poster style hero with chunky black sans on saturated yellow.

Live preview

Claude prompt

Drop this into Claude Code, claude.ai, or your AI tool of choice to regenerate or remix this component from scratch.

Build a concert/screen-print poster hero with Tailwind: saturated yellow background with a subtle dot pattern overlay, a thick double-bordered frame (4px outer black border + 1px inset border at 8px). Inside: a top mono row with a red 'LIVE NOW' indicator and a volume number, a thick black divider, an enormous Inter Black 900 stacked headline ('YOU BUILD IT, WE SHIP IT.') with a 4px red drop-shadow offset, a black-on-yellow infinite mono marquee strip ('VIBEDEX × OPEN SOURCE × MIT × 2026' looping), and two thick-bordered uppercase CTAs. Vibe: 90s rave flyer / risograph music poster — saturated, loud, charming.

Code

html

<!--
  Source: Vibedex
  https://vibedex.io
  License: MIT
  Surfaced via https://vibedex.io/components/vbx-poster-hero
-->
<section class="hero"><div class="frame"><div class="top"><span>● LIVE NOW</span><span>VOL.24</span></div><h1>YOU<br>BUILD<br>IT,<br>WE<br>SHIP<br>IT.</h1><div class="mid"><span class="runic">VIBEDEX × OPEN SOURCE × MIT × 2026</span></div><div class="bot"><a class="primary" href="#">▶ START</a><a class="secondary" href="#">ENTER →</a></div></div></section>