SaaS · React
Email newsletter platform
Editorial site for a newsletter platform for writers, with an issue stats mock, paid tiers and FAQ.
What you get
A serif, editorial product site for an email newsletter platform: a recent-issues mock, stats, features, a paid subscriptions split, three steps, monthly pricing by list size, quotes and an FAQ. All content lives in src/site.ts.
Files
Exactly what is copied into a new project: 13 files, nothing generated.
Explorer 13
src/site.ts
import type { Site } from "./types"; /** Everything this site shows. Edit freely. */export const site: Site = { "brand": "Broadsheet", "nav": [ { "label": "Features", "href": "#features" }, { "label": "Paid", "href": "#paid" }, { "label": "Pricing", "href": "#pricing" }, { "label": "FAQ", "href": "#faq" } ], "navCta": { "label": "Start writing", "href": "#start" }, "sections": [ { "kind": "hero", "variant": "editorial", "eyebrow": "Newsletters for independent writers", "title": "Write the letter. We'll get it to the inbox.", "text": "A clean editor, a public archive that doubles as your website, and paid subscriptions when you're ready. Your list is yours to export at any time.", "primary": { "label": "Start your newsletter", "href": "#start" }, "secondary": { "label": "How paid works", "href": "#paid" }, "visual": { "type": "mock", "title": "The Long Table · Recent issues", "rows": [ { "label": "No. 48 Notes from a winter kitchen", "value": "61% opened", "tone": "#9a3412" }, { "label": "No. 47 The case for small plates", "value": "58% opened", "tone": "#9a3412" }, { "label": "No. 46 Subscribers-only: pantry list", "value": "112 paid readers", "tone": "#047857" }, { "label": "Draft Spring menus, part one", "value": "Scheduled Fri 7:00", "tone": "#a8a29e" } ], "footer": "4,812 subscribers · +146 this month" } }, { "kind": "features", "id": "features", "eyebrow": "The essentials", "title": "Tools that stay out of your way", "columns": 3, "items": [ { "title": "A distraction-free editor", "text": "Headings, images, footnotes and pull quotes. Preview on phone and desktop before you send.", "icon": "book" }, { "title": "Archive as website", "text": "Every issue gets a page on your own domain, readable without signing up.", "icon": "globe" }, { "title": "Import your list", "text": "Upload a CSV from another platform. We confirm consent before the first send.", "icon": "users" }, { "title": "Honest analytics", "text": "Opens, clicks and new subscribers per issue, with a note on how privacy features affect opens.", "icon": "chart" }, { "title": "Scheduling", "text": "Write on Sunday, send on Tuesday morning in each reader's time zone.", "icon": "clock" }, { "title": "Good deliverability", "text": "Authenticated sending from your domain and automatic list cleaning of hard bounces.", "icon": "mail" } ] }, { "kind": "split", "id": "paid", "eyebrow": "Paid subscriptions", "title": "Charge for the work when your readers are ready", "text": "Mark any issue as subscribers-only, set monthly and yearly prices, and get paid out through your own Stripe account.", "bullets": [ "Broadsheet takes 0% on Writer and Publisher plans", "Free trials and gift subscriptions", "Comp access for friends and sources" ], "visual": { "type": "card", "tone": "#431407", "title": "Paid tier · The Long Table", "lines": [ "$6 a month or $60 a year", "Subscribers-only recipes", "Monthly reader Q&A" ] } }, { "kind": "steps", "eyebrow": "Getting started", "title": "Three steps to issue no. 1", "items": [ { "title": "Name it and pick a domain", "text": "Use ours or connect your own. Your archive goes live straight away." }, { "title": "Bring your readers", "text": "Import a list or share a sign-up page. Double opt-in is on by default." }, { "title": "Write and send", "text": "Draft, preview, schedule. Replies come straight to your inbox." } ] }, { "kind": "pricing", "id": "pricing", "eyebrow": "Pricing", "title": "Priced by list size, billed monthly", "text": "All plans include unlimited sends.", "plans": [ { "name": "Starter", "price": "$0", "period": "/month", "text": "Up to 1,000 subscribers.", "features": [ "Editor and archive", "Broadsheet subdomain", "Basic analytics" ], "cta": { "label": "Start free", "href": "#start" } }, { "name": "Writer", "price": "$15", "period": "/month", "text": "Up to 5,000 subscribers.", "features": [ "Custom domain", "Paid subscriptions, 0% fee", "Scheduling by time zone", "Remove Broadsheet footer" ], "featured": true, "cta": { "label": "Choose Writer", "href": "#start" } }, { "name": "Publisher", "price": "$45", "period": "/month", "text": "Up to 25,000 subscribers.", "features": [ "Everything in Writer", "3 contributors", "Multiple newsletters", "Sections and tags" ], "cta": { "label": "Choose Publisher", "href": "#start" } } ] }, { "kind": "quotes", "eyebrow": "Writers", "title": "From people who publish here", "items": [ { "quote": "It's the first tool where the writing screen felt like a page, not a dashboard.", "name": "Helen V.", "role": "Food writer" }, { "quote": "Moved 3,000 readers over in an afternoon and nobody noticed, which is the point.", "name": "Arjun M.", "role": "Local news newsletter" }, { "quote": "Paid subscriptions now cover my rent. I didn't think that would happen this year.", "name": "Bea L.", "role": "Essayist" } ] }, { "kind": "faq", "id": "faq", "eyebrow": "FAQ", "title": "Questions writers ask", "items": [ { "q": "Can I take my list with me?", "a": "Yes. Export subscribers, including paid status, as CSV whenever you like." }, { "q": "Do you take a cut of paid subscriptions?", "a": "Not on Writer or Publisher. Stripe's own processing fee still applies." }, { "q": "Can readers reply to an issue?", "a": "Yes. Replies go to the email address you choose, not a no-reply inbox." } ] }, { "kind": "cta", "id": "start", "title": "Send your first issue this week", "text": "Free up to 1,000 subscribers. Upgrade when the list grows.", "primary": { "label": "Start your newsletter", "href": "#pricing" }, "secondary": { "label": "Read the FAQ", "href": "#faq" } } ], "footer": { "text": "Email newsletters, archives and paid subscriptions for writers.", "columns": [ { "title": "Product", "links": [ "Editor", "Paid subscriptions", "Pricing" ] }, { "title": "Resources", "links": [ "Writing guides", "Deliverability", "Contact" ] } ], "legal": "© Broadsheet. Sample content: replace it in src/site.ts." }};Remix
Remix this template
Describe what to change and the agent starts from Email newsletter platform's files. The box is already started for you: finish “Start from Email newsletter platform and …”
Dependencies
Documented from the template's package.json. The runtime has a prebuilt dependency set for Vite + React + TypeScript, so installs are fast.
- react^19.1.0
- react-dom^19.1.0
- vite^6.3.0
- @vitejs/plugin-react^4.4.0
- tailwindcss^4.1.0
- @tailwindcss/vite^4.1.0
- typescript^5.8.0
How it runs
- Framework
- Vite + React + TypeScript
- Dev command
- npm run dev
- Build command
- npm run build
- Output directory
- dist
- Port
- 5173
- Entry route
- /
Projects run in an isolated sandbox with a live preview. Read the projects documentation for settings, snapshots and deployment.
Keep browsing
All templates
Error monitoring
Dark developer-focused site for an error tracking tool with a live issues mock, SDK steps and pricing.
Product analytics
Crisp site for a product analytics tool with a funnel mock, retention features, event pricing and FAQ.
- Featured
SaaS starter
Marketing pages, sign-in and sign-up screens, and an authenticated app area with a mocked session you replace with real auth.
Build on Email newsletter platform
Create a free account, start from this template, and ask the AI agent to turn it into your app.