Four category cards overlap in a single stack instead of sitting in a grid, and the center one is both largest and highest in stacking order, physically clipping the giant word on each card behind it. The clipping itself, not a drop shadow, is what sells the depth.
Take the overlapping card stack whole: one category rendered larger and raised above its neighbors, which it then overlaps and clips mid-word. It's a cheap, purely layout-driven way to make one option feel chosen while the flanking options still read as present, present enough to click, just visually behind the winner.
Design notes
Surface
Homepage, logged out
Navigation
Single flat tier: hamburger, wordmark, five text links (Home, Explore, Play, Nearby, Favorites) plus one icon-and-text link (a flask glyph, The Lab), then search, an apps-grid icon, and a filled `Sign in` pill. Nothing nested, nothing collapsed.
Layout
Fixed nav, fluid page. The hero is a horizontal stack of four cards overlapping by roughly a third of their width rather than sitting in a grid; a full-bleed dark promo band runs beneath it, with another row of cards cut off at the bottom of the viewport.
Density
Very sparse. Four hero images, one headline, one promo band — the entire visible page is built from about six content blocks.
Color
White page and a dark charcoal promo band; the only color present comes from the four category photos (a green aerial landscape, a dim museum specimen shelf, a bold abstract painting, a warm isometric interior) plus a single yellow handwritten badge next to the logo.
Type
A light ~32px question sits above the stack; the words burned across the cards are the largest type on the page by far, bold and white, sized to bleed near each card's own edges.
Pattern
The center card sits highest in stacking order and largest in size, clipping the word on each flanking card mid-letter — one side reads only its trailing letters, the other only its leading letters. The clipping is what sells the depth; no shadow is doing that job alone.
States
Logged out: a `Sign in` pill replaces an avatar; the promo band offers a muted `No, thanks` next to a brighter `Sign up now` rather than showing any personalized feed.
Don't
Don't give the flanking cards equal width to the center card — the illusion only works because the center card is visibly larger and physically overlaps its neighbors. Equal-width cards in a row would just read as an ordinary carousel.
Make it your own
Turn this reference into a useful brief for your project. Copy it into the AI tool you already use.
Add constraintsPreview & edit promptAssembled in your browser. No API key or AI request needed. Changing the fields refreshes the preview.
