Afterglow, a Next.js template
release analytics landing page
A dark, motion-rich landing page for a product that lines up every deploy with the metrics that moved after it: a hero with a live release dashboard you can click through, a three-step setup, a bento of release diffs, alerts, funnels and replays, a full-width WebGL light trail, a wall of customer quotes, monthly and yearly plans, an FAQ and a closing call to action.
- SaaS
- Advanced
- 1 page
- 10 sections
Inside the page
Screens from the live template. The first one is open to everyone; Pro unlocks the other 3.
What's in it
Sections, top to bottom
- 1Floating Nav
- 2Hero with Live Release Dashboard
- 3Customer Strip
- 4Three-Step Setup
- 5Release Diff Bento
- 6Light Trail
- 7Testimonial Wall
- 8Pricing with Billing Switch
- 9FAQ
- 10Closing Call to Action
Built in
- Hero dashboard you can use: switch metrics, pick a release and watch the chart and table follow
- Draggable before and after slider that snaps to the release
- Alert cards that roll back, dismiss and refill
- Funnel switch between two versions with the broken step called out
- Full-width WebGL light trail that leans away from the cursor, with a striped fallback when WebGL is unavailable
- Silent by design: no audio, no external fonts, no network calls at build time
- Monthly and yearly switch with sliding price digits
- Respects reduced motion and has no horizontal scroll at 390px
Run it on your machine
Get the code
Get Pro or lifetime access, then download the source zip from this page.
Install
In the project folder:
$ npm installStart it
Then open localhost:3000.
$ npm run dev
More templates
See all templates
Make Afterglow yours
Included in Pro, $49.99 a year, along with every other template. Swap in your words and colours and ship it.