Overview
Plinth is a calm, credible website for a software house, product studio or engineering agency. The hero is a three.js field of frosted pastel glass slabs: they drift, lean toward the cursor and rise apart as you scroll. A charcoal-and-pastel system keeps every page clear and businesslike.
The home page builds trust as you scroll:
- a statement that lights up word by word, with small coloured chips on the key phrases
- a colour-coded service accordion
- case studies in slanted frames that straighten on hover
- a dark delivery band whose glass slabs fan out for each reason
- a two-week kickoff timeline that fills as you scroll
Each service has its own colour-themed page, and there's a contact page with chip selectors and a success state.
Highlights
- Frosted-glass three.js hero
- Scroll-lit statement with icon chips
- Four colour-coded service pages
- Contact form with chips and success state
Screens
What's included
Pages
| Route | What it is |
|---|---|
/ | Full landing page |
/services/[slug] | Four pre-rendered service pages, each in its own colour |
/contact | Project inquiry form, next steps and offices |
/404 | Branded not-found page |
Sections
- Glass-slab hero
- Client grid
- Scroll statement
- Service accordion
- Case studies
- Delivery band
- Featured quote
- Client carousel
- Ten-day kickoff
- FAQ
- CTA
Getting started
Install dependencies
npm installRun the dev server
npm run dev # http://localhost:5183Build the static site
npm run build # writes the site to out/
Deploying
npm run build produces a plain static site in out/ that runs on any static host.
License & credits
Photos are from Pexels and credited in the README. Clients, people, quotes and ratings are fictional. Swap the portraits for real clients, with their permission, before launch.