Search blocks by description or jump to a page.
A two column layout pairing a project screenshot with details and a link beside it. Use it to present featured work with room for context and notes.
Split Image And Details Layout opens with a centered heading and a short supporting sentence, then renders a vertical stack of project entries spaced well apart. Each entry is a two column grid: a 4:3 image on one side and a details panel on the other. Odd numbered entries flip the image to the right so the layout alternates across the page. The details panel holds a row of technology badges, a project title, a description paragraph, a three cell metadata strip showing client, role, and year, and a call to action button that links to the full project.
The section header copy, the number of project entries, the badge list, and every metadata field are all independent. You can add or remove entries, swap in different badge labels, trim the metadata strip to fewer cells, or drop the description to a shorter summary without affecting the surrounding structure.
Reach for this block when you want to present two or three flagship projects with enough room to explain the context behind each one. It suits a portfolio home page or a dedicated featured work section for an AI assistant product where the buyer wants to see both the visual output and the specifics: who the client was, what role you played, and when it shipped. The alternating image placement keeps the page visually varied across multiple entries in a way that a plain card grid or a carousel cannot match.
A natural flow around it on a Portfolio page:
Before
After
Each entry pairs one strong project image with structured detail, making it well suited for work where context matters as much as the visual. A few ways to use the frame:
Tip: limit each technology badge row to three items so the panel stays balanced with the image and the metadata strip stays easy to scan.