PatternsShipped
Closing grid
The home page ends in a full-bleed field of the work itself, with the contact pitch in the hole. Grayscale at rest; hover lights a project.
Used onContact
Show code
<div class="d-grid-demo">
<img src="../assets/img/ad-01.webp" alt=""><img src="../assets/img/observe.webp" alt=""><img src="../assets/img/torq.webp" alt=""><img src="../assets/img/dash.webp" alt="">
<div class="d-grid-cap"><p class="h3">Let's make something that <em>converts.</em></p><div class="contact-actions"><a class="primary" href="#"><svg class="icon" viewBox="0 0 256 256" aria-hidden="true"><path d="…"/></svg> Email me</a><a class="ghost" href="#"><svg class="icon" viewBox="0 0 256 256" aria-hidden="true"><path d="…"/></svg> Resume</a></div></div>
<img src="../assets/img/shot.webp" alt=""><img src="../assets/img/ad-02.webp" alt=""><img src="../assets/img/studio.webp" alt=""><img src="../assets/img/ad-03.webp" alt="">
</div>- A 24 × 14 field, about three-fifths filled, so the white is the subject. 12 × 18 in portrait.
- Gutters are padding on each tile, not
gap, so the void geometry stays exact. - Tiles are
<button>s: they light their group, they never scroll the page. - Per-asset
--gradepulls ten greys to one exposure; film grain uses overlay blend so paper stays paper. - A one-time clockwise colour sweep hints the interaction when the grid is fully in view.





