CreatorWebsiteAvailable

SaaS launch website

Marketing site for a software product: real product UI rendered as components, use cases, feature detail with an interactive demo, pricing with monthly/yearly toggle and comparison table, FAQ, changelog, blog, and an honest sign-up boundary. Prerendered React + TypeScript.

Get Creator

Creator ($9 a month) includes up to 20 new premium families a billing month (5 in any 24 hours). Already a member? Open your library.

Version: 1.0.0
Platforms: Website
Framework: vite-react
Archive: 3.2 MB 148 files

Screens from the build

SaaS launch website: Blog post, 1600 px wide — Blog post, 1600 px wide

SaaS launch website: Changelog, 1600 px wide — Changelog, 1600 px wide

SaaS launch website: Home, 1600 px wide — Home, 1600 px wide

SaaS launch website: Pricing, 1600 px wide — Pricing, 1600 px wide

SaaS launch website: Product, 1600 px wide — Product, 1600 px wide

What it does

explain the product with rendered product UI
route visitors by use case
compare plans with monthly/yearly pricing and a team quote
answer billing questions
publish a changelog with filters and permalinks
publish blog articles
validate sign-up and hand off to an account system

Routes and screens

homeClaim, product board, forecast, conflicts and digest, audiences, price panel, recent releases
productFive product views with scroll-spy index and an interactive rebalance demo
use-casesEditorial index of team types
use-caseProblem, setup steps, filtered board, recommended plan (3 pages)
pricingCadence toggle, team quote, plan cards, comparison table, billing FAQ
changelogDated releases with tag/search filters and permalinks
blogFeatured post, category filter, post list
blog-postArticle template with product figures (5 posts)
signupValidated sign-up form with a pluggable adapter; default states that nothing was sent
not-foundHTTP 404 page with typo suggestion

States covered

Empty
No results
Validation
Error
Busy
Not connected
Not found
Reduced motion
No javascript

Stack and versions

vite	`8.3.1`
react	`19.3.0`
react-dom	`19.3.0`
react-router	`7.18.4`
typescript	`6.0.3`
vitest	`4.1.11`
@playwright/test	`1.56.0`
@axe-core/playwright	`4.13.0`

Commands:

install	`npm ci`
dev	`npm run dev`
test	`npm test`
typecheck	`npm run typecheck`
build	`npm run build`
preview	`npm run preview`
e2e	`npm run e2e`
budget	`npm run budget`

Tested

Check	Platform	Tool	Result	Date
unit + component tests (37)	Node	vitest 4.1.11 + Testing Library (jsdom)	Pass	2026-09-26
e2e: 15 routes + 404 at 360 and 1280 px, keyboard paths, mobile menu, reduced motion, no-JS	Website	Playwright 1.56.0, Chromium (headless)	Pass	2026-09-26
axe WCAG 2.2 AA tags, every route at 360 and 1280 px: 0 violations	Website	@axe-core/playwright 4.13.0	Pass	2026-09-26
critical-path budget (home, gzip): <= 250 KB	Website	scripts/budget.mjs	Pass	2026-09-26
lab LCP (home, 360px, 4x CPU throttle, local server) < 2.0 s	Website	Playwright + PerformanceObserver	Pass	2026-09-26
fresh-copy reproduction from packaged zip: npm ci, build, test	Node	npm 10.9 / Node 22.22	Pass	2026-09-26
Firefox and Safari	Website	not run	PendingNot run yet	—

1 check still pending. Pending means it hasn't been run yet, not that it passed.

Not included

No account system: sign-up validates, then states that nothing was sent (src/integrations/signup.ts)
No payments or subscriptions: prices are sample data
No email delivery, analytics, CMS or telemetry
Terms/privacy documents referenced by the form are placeholders

Each boundary comes with instructions for adding it in docs/INTEGRATION-BOUNDARIES.md.

Known limitations

All product data, people, companies and authors are fictional sample content
Pages opened with query parameters render client-side instead of hydrating the prerendered HTML
Automated tests ran in Chromium only; Firefox and Safari are untested
LCP was measured in a lab (local server, no network latency), not in the field

Licence

Use in unlimited end products incl. client/commercial; no resale/redistribution as a template, kit or dataset; no ML training. Survives cancellation for delivered versions.

Full terms: Motif template licence. Open-source parts keep their own licences (licenses.json, id lic-premium-saas-launch-1-0-0).

Ask your agent

Use Motif to activate the premium-saas-launch template and download it. Then adapt it for a neighbourhood bakery: replace the content and imagery, keep the design tokens and every state in docs/STATE-MATRIX.md, and run check_design_contract before you finish.

Motif guides applied

web-archetype-b2b-saas-sites · web-anti-generic-ai-look · web-hard-fail-signatures-self-lint · web-anti-fake-dashboard-and-invented-ui · web-html-product-mockup-panels · web-feature-scenario-vignette-mockups · web-live-product-demos-in-marketing · web-hero-product-preview-crossing-fold · web-landing-narrative-order · web-section-rhythm-and-climax · web-feature-typographic-capability-list · web-how-it-works-numbered-steps · web-billing-cadence-toggle-build · web-pricing-page-structure · web-pricing-honesty-and-anchoring · web-pricing-plan-card-construction · web-feature-matrix-table-build · web-faq-accordion-section-build · web-cta-offer-and-price-disclosure · web-closing-cta-into-footer · web-public-changelog-page · web-blog-index-and-article-template · web-auth-and-waitlist-page-layout · web-form-labels-and-layout · web-inline-validation-and-error-recovery · web-contact-page-and-honest-submission · saas-async-actions-busy-timeout-and-optimistic-updates · saas-empty-states-that-teach · sys-toast-alert-and-live-region-rules · sys-accessible-chart-text-alternative-and-data-table · sys-honest-axes-and-lie-factor · sys-defaults-as-choice-architecture · web-nav-index-rails-and-scrollspy · web-mobile-navigation · web-focus-indicators-and-keyboard · web-not-found-page · web-contrast-wcag-and-apca · web-semantic-color-tokens · web-fluid-type-clamp · web-font-loading-without-shift · web-lcp-optimization · web-cls-prevention · motion-duration-easing-scale · motion-reduced-motion-strategy · motion-anti-pattern-retrofitted-reduced-motion