Search

Search components and blocks

Sign in

Hero Blocks

Landing-page openers that introduce the product and drive the first click.

Hero Sunrise

Pro

A centered hero set straight on a painted sunrise (src/assets/lake-sunrise.png), with no card between the words and the picture. The painting drifts in a slow zoom and leans toward the pointer, the sun glows on a gentle pulse, the accent word is set in italic serif with a hand-drawn underline that draws itself in. Dark ink tokens and a light wash keep the copy readable on the painting in light and dark themes, and the layout scales down to phone width. Everything blurs into focus with a stagger, under the shared hero navbar. Sample copy is for Stillwater, a fictional mindful-mornings app — swap in your own, and the image for yours.

pnpm dlx shadcn@latest add @ditherui/hero-sunrise
Now with sunrise soundscapes

Wake up to a calmer day.

Stillwater turns the first ten minutes of your morning into a quiet ritual: breathe, write one line, set one intention, then begin.

AC
MR
PN
NW
+1
Joined by 12,000 early risers

Props

className / ...section propsReact.ComponentProps<"section">—

Suggested components