Grid Reveal Home

Install

The whole page lands in app/templates/grid-reveal-home/. You can also use a long-lived licence key instead: set the Authorization: Bearer <key> header in the registries block of components.json — better for CI or a project several people share. What you may do with the source is in the licence terms.

Sections it ships with

Sections inside one template share the same design tokens, so swapping and reordering them keeps the colours, spacing and animation rhythm consistent. Pick and combine them in the section composer.

1. 1

   Nav Bar & Reveal Grid Hero

   A nav bar, headline and an 18-cell work grid that develops cell by cell under the cursor and expands on click, over a client marquee.

   hero
2. 2

   Services

   Four service cards — brand identity, web experience, product interface and motion design — each developing a gradient on hover.

   features
3. 3

   Studio Numbers

   Four studio figures count up as they enter the viewport: projects delivered, brands served, design awards and return rate.

   stats
4. 4

   Selected Case Studies

   Three flagship cases alternate left and right in parallax browser frames, expanding on click for the full write-up.

   gallery
5. 5

   The Darkroom Process

   Exposure, development, fixing and printing — four stages that describe how the studio moves a project forward.

   timeline
6. 6

   Client Testimonials

   Three client recommendations with gradient avatars and job titles, vouching for the work and the partnership.

   testimonial
7. 7

   Call to Action

   A closing invitation over a grid texture and gradient glow, pointing to a booked project consultation or a direct email.

   cta
8. 8

   Footer

   A dark footer of wordmark, contact details, social links and three columns of site navigation.

   footer