Search blocks by description or jump to a page.
A grid of project thumbnails that reveal a title, role, and link on hover. Use it to keep a portfolio index clean while exposing detail on demand.
Interactive Hover Reveal is a uniform grid of project thumbnails, three columns wide on large screens and two on mid-size screens. Each card is a fixed-height image tile with a dark gradient overlay baked in. At rest, a category label and project title sit in the lower-left corner. On hover the card slides up a second layer that adds a short description and a "View Project" arrow link, while the underlying image gently scales up. A centered heading and a one-line subheading sit above the grid to introduce the section.
Each project entry holds a title, category label, description sentence, cover image, and a destination link. All six entries are independent, so you can swap the copy, swap the images, add or remove cards, or drop the section heading entirely without disrupting the interaction.
Reach for this block when you want a dense, scannable index of work that stays visually clean until a visitor shows intent. It suits a creative agency or studio homepage where the portfolio needs to feel curated rather than listed. The hover reveal keeps the grid uncluttered while still surfacing context on demand, which is an advantage over a plain thumbnail grid that forces readers to click blind.
A natural flow around it on a Portfolio page:
Before
After
This grid works for any set of discrete projects where a single image and a short description capture the essence. A few directions it fits well:
Tip: keep descriptions to one tight sentence so the expanded hover panel reads at a glance and never crowds the "View Project" link off screen.