Gradient Statement Hero

Hero 88Pro

A DM Sans hero with a two-line headline using a primary gradient on the first line and solid foreground on the second, supporting copy with emphasized years line, primary CTA, and a text link with arrow to explore work.

Shadcn UI Hero Block

Hero88 is a typographic hero built with shadcn/ui, with the section scoped to DM Sans like other studio-style heroes in the set. The first headline line uses a vertical gradient from the primary color into a lighter primary tint, clipped into the text; the second line uses plain foreground color. A larger muted paragraph follows with a semibold stress on the experience line. The action row places a full-width rounded primary button on small screens, then a muted link row with arrow that behaves as a real anchor for keyboard and screen reader users.

Scale ramps from mobile to desktop headline sizes. Buttons use generous padding on larger breakpoints. There is no media column: the layout is type, button, and secondary link on a flat background.

The look is bold and brand-forward because of the gradient wordmark and oversized type. Theme changes remap the gradient through CSS variables. No carousel, logos, or forms appear here.

The flex direction stacks actions on phones and aligns them in a row with wrapping on wider viewports so the link stays adjacent to the primary CTA.

Dependencies

PackageType
lucide-reactNPM
button
@shadcn
Registry