Relay Changelog-First Product Site
A software product site template whose home page is the changelog as a timeline, with rendered screens in it, a command palette, one pricing table and docs.
Designed for
- Software products that ship often and want it seen
- Developer tools with docs and an API to explain
- Status, monitoring and operations products
- Teams selling per team, not per seat
Key highlights
- The changelog as the home page, newest release first
- Typed badges: new, improved, fixed
- Rendered product screens inside the timeline
- Month rail that follows the scroll
- Press / for a palette over the pages
- One pricing table with a yearly toggle
- Six docs pages with a grouped sidebar and scroll-spy
- Three API examples set as code
- The newest entry types in as the page loads
About this template
Relay is a website template for a software product that ships often, built so the changelog is the home: the product's own release history as a vertical timeline from the newest entry at the top, each with a date, a version, a typed badge and two or three sentences, and every fourth entry carrying a rendered screen of the feature it shipped, built in code with data that looks real. The demo is a status-page and incident-updates tool made by a team of nine in Austin, written like a good status page.
The hero is the top of the timeline: the promise set large, one line, 'Start free' as a prepared email, and the newest entry directly under it, so the first thing a visitor reads is what shipped this week; a thin rail on the left marks the months and the current position shows in the header; pressing / opens a palette that searches the entries and the pages. Below the timeline the home page gives the four product moments as rendered screens, a row of six companies set in type, four customer words, one pricing table (three plans with twelve comparison lines and a button each), a FAQ of eight and a closing band. Product expands the four moments and explains how an incident flows in five steps. Pricing carries the table with a yearly toggle and the billing FAQ. Changelog is the full timeline with a filter by type and a month jump. Docs has six pages in a docs layout with a grouped sidebar and a scroll-spy contents list, including the API in plain words with three example calls. Security is one plain page on where data lives. Contact gives the email, the office with a map and the two founders with LinkedIn links.
To make it yours, describe your product in a chat with Firevibe: your releases with dates and types, the four moments to render as screens, your plans and prices, your docs and your API. The timeline, the palette and the docs layout are rebuilt around your product.
Best use cases
Status-page product
The rendered screens show service health, an incident timeline, a subscriber email and the maintenance calendar, each where the release that shipped it sits.
Incident communication tool
Investigating, identified, monitoring and resolved states appear in the rendered incident screen, and the docs explain the flow from acknowledgement to resolution.
Developer tool
The release history is permanent and searchable, the docs have a sidebar and a contents list, and three API calls are set as code.
Any product priced per team
One table with three plans, twelve comparison lines, a yearly toggle that gives two months free and a billing FAQ on trials, changes and cancellation.
How it works
Use the template
Sign up or log in, and the template's code is copied into a new project of your own. The site is served right away, at its own address.
Change it by chat
Describe what you want different: the words, the images, the pages, the colors. Firevibe edits the code and the preview updates.
Publish
Put the site live on a firevibe.dev address, or connect your own domain.
Features
Changelog as the home
Twenty-four dated entries, newest first, each with a version and a typed badge, fading in as they enter; the rail's marker slides with the scroll and the header shows the month.
Typing entry
The newest entry types in its first line and its badge flips as the page loads, the home page's one orchestrated moment.
Rendered screens in the timeline
Every fourth entry carries the screen it shipped, built in code with fictional data that fills in when it arrives.
Command palette
Pressing / opens a search over the entries and the pages with keyboard navigation.
One pricing table
Three plans in one table with twelve comparison lines, the selected plan lifting on hover, a yearly toggle and a button per plan that opens an email with the plan in the subject.
Changelog page
The full timeline with a filter by type (new, improved, fixed) and a month jump in the rail.
Docs layout
Six pages with a grouped sidebar on the left and a contents list on the right that highlights the section in view.
API in plain words
Three example calls set as code: read service health, create an incident, publish an update, with a note on authentication.
Prepared emails
Start free, the plan buttons and the newsletter line open an email with a prepared subject; nothing is stored, there is no sign-up form.
Security and contact
One plain page on where data lives and how it is kept; the email, the office with a map and the two founders with LinkedIn links.
More landing page templates
See allLike what you see? Make it yours.
Start for free