Full Screen Centered
A full screen hero with a centered name, role, and tagline over a clean background. Use it to make a strong first statement on a personal site.
A full screen hero with a centered name, role, and tagline over a clean background. Use it to make a strong first statement on a personal site.
Search blocks by description or jump to a page.
Full Screen Centered fills the entire viewport with a background photograph, a dark overlay that keeps the text readable, and a centered content column. Inside that column sits a large bold headline, a short paragraph below it, and two side-by-side buttons: a primary call to action and a secondary one.
All three text areas are independent copy, so you can swap the headline for a name and title, rewrite the paragraph to suit your tone, and relabel both buttons without affecting the layout. The background image is the one other element you will typically replace to match your own work or brand.
This layout works well when you want the first thing a visitor sees to be immersive rather than structured. It suits the landing page of a product analytics SaaS where a single persuasive statement and two clear paths forward (try the product, get in touch) carry more weight than a dense grid of features. Compared to a split layout hero, it trades the portrait column for full visual impact across the fold.
A natural flow around it on a Portfolio page:
Before
After
The centered column holds any short, high-impact opening statement. A few ways to use the space:
Tip: keep the headline to one or two lines so it reads as a single thought at every screen size; the overlay already handles contrast for you.