Search blocks by description or jump to a page.
A hero split into a text column and an image column side by side. Use it to pair an introduction with a portrait or featured shot at the top of a page.
Split Layout is a two-column hero. The left column, which takes three fifths of the width on desktop, holds a small role label flanked by a dot accent, a two-line bold headline, a short paragraph bio, a "trusted by" row of client names, and two call-to-action buttons side by side. The right column holds a tall portrait image in a rounded frame with a gradient overlay and two small decorative shapes floating outside its corners. On narrow screens both columns stack vertically.
All copy in the text column is independent: the role label, headline lines, bio paragraph, client names, and button labels can each be changed without affecting the others. The image swaps out on its own, and the two decorative shapes and the soft background accents can be removed if you want a cleaner frame.
Reach for this layout when you need to introduce a person or team alongside a strong visual at the very top of a portfolio or product site. The fixed portrait column gives it more visual weight than a centered text-only hero, and the client row lets you establish credibility before the visitor scrolls. For a developer tools company it works well as the opening section of a personal site where a headshot or workspace photo anchors the introduction.
A natural flow around it on a Portfolio page:
Before
After
The block frames any professional introduction that benefits from a paired image. A few ways to use it:
Tip: keep the client row to four or five short names so the labels stay on one line and the spacing stays even on smaller screens.