H
Vijetbhat6
/
hoverlab
/
pages
Files
Code
Info
About Page
about-page
No hero — a reader who clicked "About" has already read the pitch and is checking whether the company is real, so the page opens with numbers and a timeline instead of a headline.
About Page 02
about-page-02
The founder’s letter instead of the evidence wall: a byline and a dateline, for a company whose best asset is still conviction rather than a six-year record — and it ends on the job board, because /team is linked from job posts more often than from sales decks.
Account Orders
account-orders-page
Order history in the settings shell rather than a second sidebar layout — an account area and a settings area are the same shape.
Account Setup
account-setup-page
A profile form where the role options state what they actually change, the avatar crop works from the keyboard, and a navigation guard names the fields it is about to throw away.
Affiliate Programme
affiliate-page
Terms before the application, and a calculator so the reader sees a number rather than doing arithmetic with an ARPU they do not know.
Affiliate Page 02
affiliate-page-02
Proof before arithmetic — what four named partners actually earned last quarter, including the one for whom it is not working, and no calculator anywhere. A slider shows what you could earn from numbers you picked yourself.
Agency Landing Page
agency-landing-page
A studio site: full-bleed hero, client list, engagements described as engagements, and the actual team — with no pricing, on purpose.
Agent Run Inspector
agent-inspector-page
The three states an agent screen usually omits: the wait before the first token, the trace after something broke with retries costed in the open, and the diff it wants a person to accept.
Agent Run Detail
agent-run-page
One run opened up in the order you would debug it — intent, actions, the retries that are invisible in both, then cost.
AI Assistant Screen
ai-assistant-page
An agent working inside a real app: a transcript down the middle — reasoning, answer, then the one card that can act — with what it may read and what it noticed demoted to a rail.
AI Editor
ai-editor-page
Five ways to reach a model without the cursor leaving the sentence — slash menu, inline completion, selection toolbar, action menu, property inspector — and the two surfaces that say where the answer came from.
Alerting
alerting-page
Thresholds with how often each has actually fired, what that produced, where it went — and the digest settings that exist because of the answer.
Comparison / Alternatives
alternatives-page
The competitor-name landing page, with a section naming where each rival is the better buy — which is what makes the other forty rows believable.
Alternatives Page 02
alternatives-page-02
One rival, head to head, for a reader who already owns the competitor — so the argument is what a migration costs, and the page opens by telling roughly a third of its readers to stay where they are.
Analytics
analytics-page
The saved view and the comparison window first, because every figure below depends on both — then six charts, none of which load a charting library.
App Shell
app-shell-page
The furniture that is on every screen and belongs to none — navbar, mobile drawer, command palette, shortcut sheet, header search, scope switcher, and the two shapes a detail view takes without losing the list.
Approvals Inbox
approvals-page
The queue, the same queue sorted by how long things have waited, and the policy that decided both — with the policy last so it is not scrolled past forever.
Article Page
article-page
A single post: header, byline and opening prose in one reading column, with the subscribe form after the article — at the only moment it converts.
Assistant Chat
assistant-chat-page
The blank thread answered with real starter prompts, the model picker with the three numbers the choice turns on, and the four surfaces a session grows into — attachments, branches, canvas, threads.
Billing & Usage Screen
billing-page
Plan, quota meters and invoice history, with the upgrade prompt placed beside a bar that is nearly full rather than on the plan card.
Blog Index
blog-index-page
The post grid, a subscribe ask that comes after the proof, and a minimal footer — no hero, because the featured post already is one.
Careers Page
careers-page
Team first, openings second, then the questions candidates only ask after an offer — answered while they can still change who applies.
Shopping Bag
cart-page
Editable lines beside a sticky summary, so the total and the checkout button survive a scroll through four quantity changes.
Case Study Index
case-study-index-page
Excerpts that lead with the outcome rather than the customer’s biography, filterable by industry — because the reader is scanning for a problem that resembles their own.
Case Study Index 02
case-study-index-page-02
A results directory rather than a reading list: search the situation, facet by entity count and ledger, and the aggregate claim sits at the bottom underneath the thirty-four rows it was computed from.
Case Study
case-study-page
The numbers above the story, which is the opposite of how these are usually written: the colleague this link gets forwarded to needs the result in the first screen.
Case Study 02
case-study-page-02
The narrative take, for a study found by search rather than forwarded by a champion: the customer’s sentence first, the numbers last, and the six weeks in the middle where the software was losing to a spreadsheet.
Changelog Page
changelog-page
The release timeline with the site chrome kept on, and the one subscribe form on the site that is not a detour — "tell me when this page changes" is exactly what it promises.
Checkout
checkout-page
Address and payment with the site navigation stripped and the order summary moved above the form on mobile — both aimed squarely at completion rate.
Product Collection
collection-page
Sticky filter sidebar, sort toolbar and product grid — with the facets dropped rather than stacked on mobile, so a shopping page does not open as a form.
Coming Soon
coming-soon-page
The shortest page in the catalog, and it still says what the product does — including what it will not do at launch. No countdown, because a clock at zero is worse than no clock.
Coming Soon 02
coming-soon-page-02
A referral queue with a real position: three places per invite, forty admitted a week, and the admission ceiling on the page rather than in the confirmation email — otherwise it is a dark pattern with a progress bar.
Community Page
community-page
Member counts and reply times on every door, because "join our community" with no number reads as an invitation into an empty room — plus a digest for people who will not install another chat app.
Community Page 02
community-page-02
The calendar is the community: the next session bookable in the first screen, the month underneath, and the chat links demoted to a strip — an idle Slack is a worse first impression than a half-full calendar.
Contact Page
contact-page
The form first, then the four questions that cause most of the messages — answered here, because that is faster for the sender than a reply and leaves the inbox for what needs a person.
Contact Page 02
contact-page-02
Route before you write — three doors, each with the form its sender actually needs: a calendar for a buyer, a structured ticket for a broken import. One textarea costs a round trip.
Creator Course Landing Page
creator-course-landing-page
One person selling one course: a student testimonial as the hero because a course cannot demo, a long instructor section, one price and a refund policy on the page.
Customer List Screen
customers-table-page
The canonical CRUD list — header, toolbar, sortable table and pagination framed as one panel instead of three stacked cards.
Dashboard Overview
dashboard-overview
The screen an app opens on: shell, header, KPI row, chart and activity feed — numbers first, shape second, changes last.
Developer Tool Landing Page
developer-tool-landing-page
Install command first, real code before any prose, and a usage calculator instead of tiers — the order a developer actually scans in.
Documentation Page
docs-page
The site navbar over the three-column docs frame. In your project this is one catch-all route — the slug picks the article, the frame never changes.
Enterprise Landing Page
enterprise-landing-page
Built for a champion assembling an internal case: numbers in the hero, a comparison that concedes two rows, video references, and published prices instead of a sales wall.
404 Page
error-404-page
Drops straight into app/not-found.tsx, and keeps the site header and footer — on a 404 the navigation is the most useful thing on screen.
Server Error
error-500-page
Retry first, because a 500 is our failure and offering navigation implies the rest of the site works — which is exactly what is in doubt.
Express Checkout
express-checkout-page
Checkout for the buyer who will not fill in a form: wallet buttons above the fields, and the address a wallet returns shown and changeable before the charge rather than after it.
FAQ Page
faq-page
Search and browse, in that order, because the two halves serve opposite visitors — one arrives from a search engine with a phrase, the other from the navbar with none.
FAQ Page 02
faq-page-02
Objection-ordered and search-free: the questions that lose deals first, hardest at the top, because a search box over eighteen questions implies a list long enough to get lost in — and its empty state reads as “no refund policy”.
First Run
first-run-page
What the product looks like while onboarding happens: a tour step anchored to the control it explains, the skeletons of the slowest load it will ever do, and the checklist that outlives both.
Forgot Password
forgot-password-page
Password reset, plus the magic link beside it — the moment after a password has failed is when somebody is most willing to stop using one.
Gallery / Showcase
gallery-page
A switcher rather than an infinite grid: four named views, one visible at a time, so the page weighs one image on load instead of forty.
Gallery Page 02
gallery-page-02
The whole catalogue at once, filterable, with the total stated up front — the opposite trade to the switcher, and it honestly costs ninety images on load rather than one.
Help Centre
help-centre-page
Search first, the six answers that absorb the most contact volume under it, and the ticket form in plain sight rather than behind a modal — a support page measured in tickets not filed.
Import Data
import-data-page
The flow between an empty product and a useful one, in the order it goes wrong: sample data offered with equal weight, a file, a URL, the column mapping everything stalls on, and an upload that survives the connection dropping.
Integration Detail
integration-detail-page
One connection, answering the four questions an integration page usually leaves to a support ticket: which records move, which way, how often, and what happens on conflict.
Integration Detail 02
integration-detail-page-02
The setup guide, not the pitch: what moves and which way, then a five-step wizard — written for the person turning the connector on rather than the one deciding to buy it.
Integration Platform Landing Page
integration-platform-landing-page
The connector names in the hero, a catalogue with honest live/beta/planned status, four SDK languages, credit pricing, and a dated roadmap for everyone who is not on the list.
Integrations Directory
integrations-index-page
Every connection with its real status on the card — live, beta or planned — because a directory that hides which is which is discovered at exactly the wrong moment.
Integrations Index 02
integrations-index-page-02
Search-first, with facet counts including the zeroes — nobody browses an integration directory, and “Payroll (0)” answers the question inside the list the reader is already looking at.
Invoices
invoices-page
Billing history laid out for finance rather than for the user — a retrieval screen, so the table leads and the payment method comes last.
Launch Note
launch-note-page
A product announcement shaped as writing rather than a landing page — serif headline, real byline, three pieces of evidence, and an endpoint card that doubles as documentation for the week before the docs exist.
Legal Document
legal-page
Terms, privacy, DPA and cookies in one frame — the docs layout, because people arrive at a legal page looking for a specific clause and a wall of text makes that a Ctrl-F expedition.
Legal Document 02
legal-page-02
One document with a plain-language column beside each clause, for the reader who cannot name the clause they need — and the cookie control inline, because a banner is unreachable the moment it has been dismissed.
Local Service Landing Page
local-service-landing-page
A booking widget above the fold, every price published including the awkward ones, and a footer carrying the registrations a regulated trade must show.
Sign-In Screen
login-page
A full auth page that deliberately contains almost nothing but the form — no nav, no marketing, nothing competing with the one job.
Scheduled Maintenance
maintenance-page
Planned downtime with an actual end time on it — "back soon" is not a time, and a maintenance page without one looks like an outage nobody has noticed.
Marketplace Landing Page
marketplace-landing-page
Two audiences, one page: a search field and real listings for buyers up top, the seller economics below, and a searchable FAQ because they ask different things.
Switching & Migration
migration-landing-page
The landing page for a reader whose current tool already works: the migration mechanism second rather than buried, integrations stated at depth, and deliberately no pricing section.
Mobile App Landing Page
mobile-app-landing-page
Store badges above the fold, the App Store rating as the first proof, and a single price — a page with one job, which is the install.
Notification Settings
notification-settings-page
Notifications from the receiving end: the inbox you arrived from, per-event and per-channel control, and the push prompt asked after the decision rather than on arrival.
Onboarding
onboarding-page
A wizard for the session someone finishes and a checklist for the one they do not, with the only genuinely blocking step in front of both.
Order Confirmed
order-confirmation-page
The post-purchase screen, with navigation restored and a rail that shows what to buy next rather than what was just bought.
Order Tracking
order-tracking-page
For the customer with an order number and no account — a lookup, an arrival range rather than a promised date, and the review form where the "how did we do" email actually lands.
Permission Denied
permission-denied-page
A 403 that names who can grant what was refused, because the next question is always "then who can" and a support link is the wrong answer to it.
Change Plan
plan-change-page
Both directions, because only one of them is usually built: a radiogroup with the prorated charge announced as it changes, and a cancellation with the end date, what breaks, and one honest alternative offered once.
Portfolio Index
portfolio-index-page
A studio’s list of work, with excerpts that name the outcome and the constraint rather than the aesthetic — a contents page, not a landing page.
Portfolio Index 02
portfolio-index-page-02
One project per screen, four in total, each naming the constraint it worked around — nobody reads four case studies, and the constraint is the only sentence a competitor cannot copy.
Pricing Page
pricing-page
Plans, a feature matrix and a pricing-specific FAQ written to remove the last purchase objection rather than answer general questions.
Product Comparison
product-compare-page
The page between a listing and a product detail, with the two questions a comparison table alone cannot answer: will it fit, and can I actually have it.
Product Detail
product-detail-page
Gallery, sticky buy box, details accordion and reviews — ordered by what a shopper needs before they can decide.
Project Board
project-board-page
A kanban board inside the app shell, with tabs that admit the board is one view among several and a header whose primary action is creating work.
Records Table
records-table-page
A table after real people have used it — columns reordered from the keyboard, a selection bar that asks page-or-all, subtotals that survive collapsing, cells edited in place, and the empty state its own filters produced.
Reset Password
reset-password-page
The end of the forgot-password flow, shipped with the state it reaches more than any other screen: a focused error summary linking to each field, beside a strength meter that is a real <meter>.
Retrieval Console
retrieval-console-page
Why the answer said what it said: what is connected, how stale it is, what the query was allowed to see, what fitted in the window and what fell out — plus the failed-search state a debugging tool is most needed in.
Public Roadmap
roadmap-page
Board plus changelog, because a roadmap alone is a promise — the last three releases underneath are what turn the shipped column into something with dates attached.
Roadmap Page 02
roadmap-page-02
Themes and refusals, no quarters — four problems stated as problems, plus the four things we have decided never to build, which is the section that takes nerve and the one customers actually need.
SaaS Landing Page
saas-landing-page
A complete marketing page in the order that actually converts — hook, proof, substance, price, objections, exit. Twelve blocks, navbar and footer included.
Search Results
search-page
Built around the state a search page is in most of the time — empty — so recent queries lead and the facets sit in a sidebar that survives growing to twelve.
Security & Trust
security-landing-page
The page a security questionnaire arrives from, written to be forwarded rather than to persuade: certifications early, benchmarks with a denominator, objections in a reviewer’s own words, and a route to a human.
Services Page
services-page
For a business that sells work rather than licences: three engagements named by situation, and prices in a comparison table rather than a pricing card with a monthly toggle that does not apply.
Services Page 02
services-page-02
One productised engagement with the price in the first screen and no mandatory call — a fixed price behind a scoping call is consulting with extra steps. Includes the paragraph naming when it is the wrong shape.
Account Settings
settings-account-page
Profile, team, API keys and danger zone in one screen — with the destructive panel last, well away from the everyday controls.
Signup Page
signup-page
The signup form with the proof under it rather than above it — the person who arrived here has already decided, and scrolling past testimonials is friction applied to the wrong reader.
Single Offer
single-offer-page
One thing, one price, named above the fold — for a course, a consultation or a one-time licence, where there is nothing to compare against and hiding the number answers the only question last.
SSO Sign In
sso-login-page
A domain field for the employee who signs in daily, and the capability detail below the fold for the IT reviewer who reads it once.
Status Page
status-page
Written for the person refreshing it during an outage: current state above the fold, the maintenance window as a real block with an end time, and a component list that names what still works.
Status Page 02
status-page-02
The status page read during diligence rather than during an outage: ninety days of uptime, the latency curve, and every incident carrying its post-mortem — including the bad one.
Team & Access
team-access-page
The admin screen a security questionnaire is really asking about — seats with the bill shown first, invitations, scopes split from bundles, sharing stated as its consequence, live sessions, and the audit trail underneath.
Team Page
team-page
Who we are, as distinct from who we are hiring: faces, the shape of the company in four numbers, and three working commitments that could actually be falsified.
Team Page 02
team-page-02
The team page that is really a recruiting page: it opens on the trade rather than the faces, and puts a salary band on every role — a board with three bands and one “competitive” teaches the reader which is the bad one.
Testimonials Wall
testimonials-page
Third-party scores first, because they are the only part of the page the company does not control — and the four-star quotes stay in, because a wall of nothing but fives reads as filtered.
Testimonials Wall 02
testimonials-page-02
Segmented by who is talking rather than sorted by score, because a wall of forty quotes is uniformly impressive and uniformly irrelevant — with the full rating spread underneath, ones included.
Two-Factor Challenge
two-factor-page
The second factor with its fallback on the same screen, because a 2FA prompt with no recovery route is a lockout screen wearing a security screen.
Usage & Limits
usage-page
Consumption in the order the questions arrive: the overage warning first because it is time-critical, then the meters, then what actually happens at each limit.
Waitlist Landing Page
waitlist-landing-page
A pre-launch page for a product you cannot buy yet: one email field, scarcity instead of adoption, and no pricing section to be held to later.
Webinar / Event
webinar-page
Registration at the top and again at the bottom, with an agenda timed by the minute — so the reader knows what they are getting before handing over an address.
Webinar Page 02
webinar-page-02
The replay, ungated, for the traffic that arrives months after the event — the gate moves to the transcript and the template, where it is a trade rather than a toll.
Workspace Activity
workspace-activity-page
Backwards from now and forwards from it on one screen — a day-grouped timeline, a month grid where a busy Tuesday never changes the row height, and the state both are in on day one.
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information
About Page
about-page
No hero — a reader who clicked "About" has already read the pitch and is checking whether the company is real, so the page opens with numbers and a timeline instead of a headline.
About Page 02
about-page-02
The founder’s letter instead of the evidence wall: a byline and a dateline, for a company whose best asset is still conviction rather than a six-year record — and it ends on the job board, because /team is linked from job posts more often than from sales decks.
Account Orders
account-orders-page
Order history in the settings shell rather than a second sidebar layout — an account area and a settings area are the same shape.
Account Setup
account-setup-page
A profile form where the role options state what they actually change, the avatar crop works from the keyboard, and a navigation guard names the fields it is about to throw away.
Affiliate Programme
affiliate-page
Terms before the application, and a calculator so the reader sees a number rather than doing arithmetic with an ARPU they do not know.
Affiliate Page 02
affiliate-page-02
Proof before arithmetic — what four named partners actually earned last quarter, including the one for whom it is not working, and no calculator anywhere. A slider shows what you could earn from numbers you picked yourself.
Agency Landing Page
agency-landing-page
A studio site: full-bleed hero, client list, engagements described as engagements, and the actual team — with no pricing, on purpose.
Agent Run Inspector
agent-inspector-page
The three states an agent screen usually omits: the wait before the first token, the trace after something broke with retries costed in the open, and the diff it wants a person to accept.
Agent Run Detail
agent-run-page
One run opened up in the order you would debug it — intent, actions, the retries that are invisible in both, then cost.
AI Assistant Screen
ai-assistant-page
An agent working inside a real app: a transcript down the middle — reasoning, answer, then the one card that can act — with what it may read and what it noticed demoted to a rail.
AI Editor
ai-editor-page
Five ways to reach a model without the cursor leaving the sentence — slash menu, inline completion, selection toolbar, action menu, property inspector — and the two surfaces that say where the answer came from.
Alerting
alerting-page
Thresholds with how often each has actually fired, what that produced, where it went — and the digest settings that exist because of the answer.
Comparison / Alternatives
alternatives-page
The competitor-name landing page, with a section naming where each rival is the better buy — which is what makes the other forty rows believable.
Alternatives Page 02
alternatives-page-02
One rival, head to head, for a reader who already owns the competitor — so the argument is what a migration costs, and the page opens by telling roughly a third of its readers to stay where they are.
Analytics
analytics-page
The saved view and the comparison window first, because every figure below depends on both — then six charts, none of which load a charting library.
App Shell
app-shell-page
The furniture that is on every screen and belongs to none — navbar, mobile drawer, command palette, shortcut sheet, header search, scope switcher, and the two shapes a detail view takes without losing the list.
Approvals Inbox
approvals-page
The queue, the same queue sorted by how long things have waited, and the policy that decided both — with the policy last so it is not scrolled past forever.
Article Page
article-page
A single post: header, byline and opening prose in one reading column, with the subscribe form after the article — at the only moment it converts.
Assistant Chat
assistant-chat-page
The blank thread answered with real starter prompts, the model picker with the three numbers the choice turns on, and the four surfaces a session grows into — attachments, branches, canvas, threads.
Billing & Usage Screen
billing-page
Plan, quota meters and invoice history, with the upgrade prompt placed beside a bar that is nearly full rather than on the plan card.
Blog Index
blog-index-page
The post grid, a subscribe ask that comes after the proof, and a minimal footer — no hero, because the featured post already is one.
Careers Page
careers-page
Team first, openings second, then the questions candidates only ask after an offer — answered while they can still change who applies.
Shopping Bag
cart-page
Editable lines beside a sticky summary, so the total and the checkout button survive a scroll through four quantity changes.
Case Study Index
case-study-index-page
Excerpts that lead with the outcome rather than the customer’s biography, filterable by industry — because the reader is scanning for a problem that resembles their own.
Case Study Index 02
case-study-index-page-02
A results directory rather than a reading list: search the situation, facet by entity count and ledger, and the aggregate claim sits at the bottom underneath the thirty-four rows it was computed from.
Case Study
case-study-page
The numbers above the story, which is the opposite of how these are usually written: the colleague this link gets forwarded to needs the result in the first screen.
Case Study 02
case-study-page-02
The narrative take, for a study found by search rather than forwarded by a champion: the customer’s sentence first, the numbers last, and the six weeks in the middle where the software was losing to a spreadsheet.
Changelog Page
changelog-page
The release timeline with the site chrome kept on, and the one subscribe form on the site that is not a detour — "tell me when this page changes" is exactly what it promises.
Checkout
checkout-page
Address and payment with the site navigation stripped and the order summary moved above the form on mobile — both aimed squarely at completion rate.
Product Collection
collection-page
Sticky filter sidebar, sort toolbar and product grid — with the facets dropped rather than stacked on mobile, so a shopping page does not open as a form.
Coming Soon
coming-soon-page
The shortest page in the catalog, and it still says what the product does — including what it will not do at launch. No countdown, because a clock at zero is worse than no clock.
Coming Soon 02
coming-soon-page-02
A referral queue with a real position: three places per invite, forty admitted a week, and the admission ceiling on the page rather than in the confirmation email — otherwise it is a dark pattern with a progress bar.
Community Page
community-page
Member counts and reply times on every door, because "join our community" with no number reads as an invitation into an empty room — plus a digest for people who will not install another chat app.
Community Page 02
community-page-02
The calendar is the community: the next session bookable in the first screen, the month underneath, and the chat links demoted to a strip — an idle Slack is a worse first impression than a half-full calendar.
Contact Page
contact-page
The form first, then the four questions that cause most of the messages — answered here, because that is faster for the sender than a reply and leaves the inbox for what needs a person.
Contact Page 02
contact-page-02
Route before you write — three doors, each with the form its sender actually needs: a calendar for a buyer, a structured ticket for a broken import. One textarea costs a round trip.
Creator Course Landing Page
creator-course-landing-page
One person selling one course: a student testimonial as the hero because a course cannot demo, a long instructor section, one price and a refund policy on the page.
Customer List Screen
customers-table-page
The canonical CRUD list — header, toolbar, sortable table and pagination framed as one panel instead of three stacked cards.
Dashboard Overview
dashboard-overview
The screen an app opens on: shell, header, KPI row, chart and activity feed — numbers first, shape second, changes last.
Developer Tool Landing Page
developer-tool-landing-page
Install command first, real code before any prose, and a usage calculator instead of tiers — the order a developer actually scans in.
Documentation Page
docs-page
The site navbar over the three-column docs frame. In your project this is one catch-all route — the slug picks the article, the frame never changes.
Enterprise Landing Page
enterprise-landing-page
Built for a champion assembling an internal case: numbers in the hero, a comparison that concedes two rows, video references, and published prices instead of a sales wall.
404 Page
error-404-page
Drops straight into app/not-found.tsx, and keeps the site header and footer — on a 404 the navigation is the most useful thing on screen.
Server Error
error-500-page
Retry first, because a 500 is our failure and offering navigation implies the rest of the site works — which is exactly what is in doubt.
Express Checkout
express-checkout-page
Checkout for the buyer who will not fill in a form: wallet buttons above the fields, and the address a wallet returns shown and changeable before the charge rather than after it.
FAQ Page
faq-page
Search and browse, in that order, because the two halves serve opposite visitors — one arrives from a search engine with a phrase, the other from the navbar with none.
FAQ Page 02
faq-page-02
Objection-ordered and search-free: the questions that lose deals first, hardest at the top, because a search box over eighteen questions implies a list long enough to get lost in — and its empty state reads as “no refund policy”.
First Run
first-run-page
What the product looks like while onboarding happens: a tour step anchored to the control it explains, the skeletons of the slowest load it will ever do, and the checklist that outlives both.
Forgot Password
forgot-password-page
Password reset, plus the magic link beside it — the moment after a password has failed is when somebody is most willing to stop using one.
Gallery / Showcase
gallery-page
A switcher rather than an infinite grid: four named views, one visible at a time, so the page weighs one image on load instead of forty.
Gallery Page 02
gallery-page-02
The whole catalogue at once, filterable, with the total stated up front — the opposite trade to the switcher, and it honestly costs ninety images on load rather than one.
Help Centre
help-centre-page
Search first, the six answers that absorb the most contact volume under it, and the ticket form in plain sight rather than behind a modal — a support page measured in tickets not filed.
Import Data
import-data-page
The flow between an empty product and a useful one, in the order it goes wrong: sample data offered with equal weight, a file, a URL, the column mapping everything stalls on, and an upload that survives the connection dropping.
Integration Detail
integration-detail-page
One connection, answering the four questions an integration page usually leaves to a support ticket: which records move, which way, how often, and what happens on conflict.
Integration Detail 02
integration-detail-page-02
The setup guide, not the pitch: what moves and which way, then a five-step wizard — written for the person turning the connector on rather than the one deciding to buy it.
Integration Platform Landing Page
integration-platform-landing-page
The connector names in the hero, a catalogue with honest live/beta/planned status, four SDK languages, credit pricing, and a dated roadmap for everyone who is not on the list.
Integrations Directory
integrations-index-page
Every connection with its real status on the card — live, beta or planned — because a directory that hides which is which is discovered at exactly the wrong moment.
Integrations Index 02
integrations-index-page-02
Search-first, with facet counts including the zeroes — nobody browses an integration directory, and “Payroll (0)” answers the question inside the list the reader is already looking at.
Invoices
invoices-page
Billing history laid out for finance rather than for the user — a retrieval screen, so the table leads and the payment method comes last.
Launch Note
launch-note-page
A product announcement shaped as writing rather than a landing page — serif headline, real byline, three pieces of evidence, and an endpoint card that doubles as documentation for the week before the docs exist.
Legal Document
legal-page
Terms, privacy, DPA and cookies in one frame — the docs layout, because people arrive at a legal page looking for a specific clause and a wall of text makes that a Ctrl-F expedition.
Legal Document 02
legal-page-02
One document with a plain-language column beside each clause, for the reader who cannot name the clause they need — and the cookie control inline, because a banner is unreachable the moment it has been dismissed.
Local Service Landing Page
local-service-landing-page
A booking widget above the fold, every price published including the awkward ones, and a footer carrying the registrations a regulated trade must show.
Sign-In Screen
login-page
A full auth page that deliberately contains almost nothing but the form — no nav, no marketing, nothing competing with the one job.
Scheduled Maintenance
maintenance-page
Planned downtime with an actual end time on it — "back soon" is not a time, and a maintenance page without one looks like an outage nobody has noticed.
Marketplace Landing Page
marketplace-landing-page
Two audiences, one page: a search field and real listings for buyers up top, the seller economics below, and a searchable FAQ because they ask different things.
Switching & Migration
migration-landing-page
The landing page for a reader whose current tool already works: the migration mechanism second rather than buried, integrations stated at depth, and deliberately no pricing section.
Mobile App Landing Page
mobile-app-landing-page
Store badges above the fold, the App Store rating as the first proof, and a single price — a page with one job, which is the install.
Notification Settings
notification-settings-page
Notifications from the receiving end: the inbox you arrived from, per-event and per-channel control, and the push prompt asked after the decision rather than on arrival.
Onboarding
onboarding-page
A wizard for the session someone finishes and a checklist for the one they do not, with the only genuinely blocking step in front of both.
Order Confirmed
order-confirmation-page
The post-purchase screen, with navigation restored and a rail that shows what to buy next rather than what was just bought.
Order Tracking
order-tracking-page
For the customer with an order number and no account — a lookup, an arrival range rather than a promised date, and the review form where the "how did we do" email actually lands.
Permission Denied
permission-denied-page
A 403 that names who can grant what was refused, because the next question is always "then who can" and a support link is the wrong answer to it.
Change Plan
plan-change-page
Both directions, because only one of them is usually built: a radiogroup with the prorated charge announced as it changes, and a cancellation with the end date, what breaks, and one honest alternative offered once.
Portfolio Index
portfolio-index-page
A studio’s list of work, with excerpts that name the outcome and the constraint rather than the aesthetic — a contents page, not a landing page.
Portfolio Index 02
portfolio-index-page-02
One project per screen, four in total, each naming the constraint it worked around — nobody reads four case studies, and the constraint is the only sentence a competitor cannot copy.
Pricing Page
pricing-page
Plans, a feature matrix and a pricing-specific FAQ written to remove the last purchase objection rather than answer general questions.
Product Comparison
product-compare-page
The page between a listing and a product detail, with the two questions a comparison table alone cannot answer: will it fit, and can I actually have it.
Product Detail
product-detail-page
Gallery, sticky buy box, details accordion and reviews — ordered by what a shopper needs before they can decide.
Project Board
project-board-page
A kanban board inside the app shell, with tabs that admit the board is one view among several and a header whose primary action is creating work.
Records Table
records-table-page
A table after real people have used it — columns reordered from the keyboard, a selection bar that asks page-or-all, subtotals that survive collapsing, cells edited in place, and the empty state its own filters produced.
Reset Password
reset-password-page
The end of the forgot-password flow, shipped with the state it reaches more than any other screen: a focused error summary linking to each field, beside a strength meter that is a real <meter>.
Retrieval Console
retrieval-console-page
Why the answer said what it said: what is connected, how stale it is, what the query was allowed to see, what fitted in the window and what fell out — plus the failed-search state a debugging tool is most needed in.
Public Roadmap
roadmap-page
Board plus changelog, because a roadmap alone is a promise — the last three releases underneath are what turn the shipped column into something with dates attached.
Roadmap Page 02
roadmap-page-02
Themes and refusals, no quarters — four problems stated as problems, plus the four things we have decided never to build, which is the section that takes nerve and the one customers actually need.
SaaS Landing Page
saas-landing-page
A complete marketing page in the order that actually converts — hook, proof, substance, price, objections, exit. Twelve blocks, navbar and footer included.
Search Results
search-page
Built around the state a search page is in most of the time — empty — so recent queries lead and the facets sit in a sidebar that survives growing to twelve.
Security & Trust
security-landing-page
The page a security questionnaire arrives from, written to be forwarded rather than to persuade: certifications early, benchmarks with a denominator, objections in a reviewer’s own words, and a route to a human.
Services Page
services-page
For a business that sells work rather than licences: three engagements named by situation, and prices in a comparison table rather than a pricing card with a monthly toggle that does not apply.
Services Page 02
services-page-02
One productised engagement with the price in the first screen and no mandatory call — a fixed price behind a scoping call is consulting with extra steps. Includes the paragraph naming when it is the wrong shape.
Account Settings
settings-account-page
Profile, team, API keys and danger zone in one screen — with the destructive panel last, well away from the everyday controls.
Signup Page
signup-page
The signup form with the proof under it rather than above it — the person who arrived here has already decided, and scrolling past testimonials is friction applied to the wrong reader.
Single Offer
single-offer-page
One thing, one price, named above the fold — for a course, a consultation or a one-time licence, where there is nothing to compare against and hiding the number answers the only question last.
SSO Sign In
sso-login-page
A domain field for the employee who signs in daily, and the capability detail below the fold for the IT reviewer who reads it once.
Status Page
status-page
Written for the person refreshing it during an outage: current state above the fold, the maintenance window as a real block with an end time, and a component list that names what still works.
Status Page 02
status-page-02
The status page read during diligence rather than during an outage: ninety days of uptime, the latency curve, and every incident carrying its post-mortem — including the bad one.
Team & Access
team-access-page
The admin screen a security questionnaire is really asking about — seats with the bill shown first, invitations, scopes split from bundles, sharing stated as its consequence, live sessions, and the audit trail underneath.
Team Page
team-page
Who we are, as distinct from who we are hiring: faces, the shape of the company in four numbers, and three working commitments that could actually be falsified.
Team Page 02
team-page-02
The team page that is really a recruiting page: it opens on the trade rather than the faces, and puts a salary band on every role — a board with three bands and one “competitive” teaches the reader which is the bad one.
Testimonials Wall
testimonials-page
Third-party scores first, because they are the only part of the page the company does not control — and the four-star quotes stay in, because a wall of nothing but fives reads as filtered.
Testimonials Wall 02
testimonials-page-02
Segmented by who is talking rather than sorted by score, because a wall of forty quotes is uniformly impressive and uniformly irrelevant — with the full rating spread underneath, ones included.
Two-Factor Challenge
two-factor-page
The second factor with its fallback on the same screen, because a 2FA prompt with no recovery route is a lockout screen wearing a security screen.
Usage & Limits
usage-page
Consumption in the order the questions arrive: the overage warning first because it is time-critical, then the meters, then what actually happens at each limit.
Waitlist Landing Page
waitlist-landing-page
A pre-launch page for a product you cannot buy yet: one email field, scarcity instead of adoption, and no pricing section to be held to later.
Webinar / Event
webinar-page
Registration at the top and again at the bottom, with an agenda timed by the minute — so the reader knows what they are getting before handing over an address.
Webinar Page 02
webinar-page-02
The replay, ungated, for the traffic that arrives months after the event — the gate moves to the transcript and the template, where it is a trade rather than a toll.
Workspace Activity
workspace-activity-page
Backwards from now and forwards from it on one screen — a day-grouped timeline, a month grid where a busy Tuesday never changes the row height, and the state both are in on day one.
Select a component to view its code
Click on any item in the sidebar to get started
Select a component to view its information