The small handbook
From a blank page
to your first letter.
Just what you need to get comfortable. You can write and publish to the web before connecting email.
Get started.
Start at Create your newsletter to choose an example or write your own design brief. Copy the prompt into your AI coding tool and review the result. For the standard theme, choose Deploy default Caveat on that page.
- Connect your Git account and add Prisma Postgres during deployment.
- Set two different private values, at least 32 characters each, for
BETTER_AUTH_SECRETandCAVEAT_SETUP_KEY. Save them in your password manager. - Open your deployed website. Enter your setup key, name, email, and a password of at least 12 characters.
- Give your publication a name, description, and author. Start writing.
Your Vercel web address works immediately. A custom domain and email sending can come later.
Run a downloaded Caveat project on your computer
Install Node.js 22.12 or newer. In your project folder, run:
npm install
npm run devOpen localhost:3000. Caveat starts a local database and saves your private installation keys in .env. This local site is only for your computer; deploy it to share it publicly.
Find your setup key.
The setup key proves you own this installation. You use it once to create the owner account. After that, sign in with your email and password.
- Running locally
- Open the
.envfile in your Caveat project. Copy the value afterCAVEAT_SETUP_KEY=, leaving out any surrounding quotes. - Deployed on Vercel
- Open your project’s Settings → Environment Variables and find
CAVEAT_SETUP_KEY. Use the value you saved during deployment. If you change it, redeploy before using it.
The setup key is private. Do not put it in a public post or share it with readers. Once an owner exists, the key cannot create another account.
Write and publish.
Open Posts → New post. Add a title and write in the editor. Use the toolbar for headings, lists, links, and emphasis. Wait for All changes saved before closing the page.
- Edit in place
- Your writing is formatted as you type, using your chosen reading style. Click straight into a heading or paragraph to edit it.
- Publish to website
- Make the saved version public on your site and RSS feed. This does not send an email.
- Send newsletter
- Preview the saved draft as an email, send yourself a test, and confirm the recipient count before sending.
Edits to a published post stay private until you publish again. Website publishing and newsletter sending are separate decisions.
Make it yours.
In Settings, change your publication name, description, author, and accent colour. Under Reading typeface, try a font in the live preview and choose Save changes to apply it to the website.
Browse 100 Google Fonts, including Lora, Inter, Newsreader, and DM Sans, or keep one of the two original styles. Start with Recommended, search by name, or filter by category. Preview a typeface and select Use, then save your settings. The choice also appears in the editor as you write.
Email uses a familiar reading font for compatibility with inboxes. Your website font selection does not change email typography.
Add a custom domain
In Vercel, open Settings → Domains, add your domain, and follow the DNS instructions. Set BETTER_AUTH_URL to the full HTTPS address, then redeploy.
Your styles are editable.
Fonts and the accent colour are available in Settings. For a different visual style, edit src/themes/custom.css. For a different layout, edit the React components in your own project.
Choose from six example blogs, then select Use this design to personalise a prompt. You can also write your own design brief. Add your publication name, author, and the changes you want. Choose whether you are starting a new site or editing an existing one.
The prompt asks your AI coding tool to initialise Caveat with npm create caveat@latest when needed, then change the public layout, fonts, colours, and branding. It keeps your posts, subscribers, sign-in, and email sending intact. Copying it does not run AI or deploy a site: paste it into your coding tool and review the local result first.
Where to change the design
- Colours & spacing
src/themes/custom.cssloads after the defaults. Scope rules to.publication-site. Use the example CSS tokens to change background, text, surfaces, borders, and content width.- Header & footer
- Edit
src/components/publication.tsx. - Home & stories
- Edit
src/app/page.tsxandsrc/app/p/[slug]/page.tsx. Keep the existing database queries and published-content checks. - Archive & about
- Edit
src/app/archive/page.tsxandsrc/app/about/page.tsxto complete the design.
Custom CSS affects the public website. The editor’s private preview uses the standard reading layout; check your site on a separate development deployment for a full custom-theme preview.
Can I use other React components?
Yes, adapt the React code or use an integration prompt in your project. Caveat currently uses plain CSS; some component libraries expect Tailwind and shadcn, so translate their styles or deliberately add those dependencies.
Keep the publication’s data loading, subscription form, and owner protections connected. Prompts run in your coding tool; Caveat does not include a built-in AI design editor.
Share a design with other writers.
Submit an example on GitHub with a name, design description, screenshots or a preview link, your creator credit, and any asset licences. An idea is welcome before the code is ready.
For a working contribution, fork the Caveat repository and add an entry to src/lib/examples.ts with a unique slug, your credit, a font, a palette, and three fictional stories. The gallery, create-page chooser, prompt, homepage, and story routes all use that entry.
Add scoped layout rules to src/app/examples/examples.css. Check desktop, mobile, keyboard navigation, and the build, then open a pull request with screenshots. See CONTRIBUTING.md in the project for the full workflow.
Community submissions are reviewed before joining the gallery. Approved examples ship with Caveat and credit their creators.
Add a component to your letter.
- In a post, place the cursor where you want the block.
- Choose Insert component in the editor toolbar.
- Pick a callout, pull quote, button, link card, or divider. Edit its fields and choose Insert into draft.
- Wait for All changes saved. Review the formatted draft or email as usual.
To change an existing block, click it, then choose Edit component. A selected block can be removed with Backspace or Delete. Undo works too.
Components are stored with the draft and exported with the post. They render to static HTML for both your website and email. A button opens a link; an interactive React widget does not run in an inbox.
Browse previews in the component library. The first five blocks are by Caveat; community contributions are welcome.
Contribute a community component
Propose it through the project repository, or submit a pull request following CONTRIBUTING.md. Include author credit, a licence, editable fields, and previews of web and email output.
Definitions live in src/lib/newsletter-components.ts. A shared Tiptap node and static renderer keep the editor, public pages, exports, and emails consistent. Contributions are reviewed and included in an application release; components are not installed from remote scripts.
Connect email when you are ready.
- Create a Resend account and verify the domain you will send from.
- In Caveat, open Settings → Letters to your readers.
- Enter a Resend API key with full access and your sending address, such as
letters@yourdomain.com. - Save changes. If verification is still pending, finish it in Resend, then save again to check.
Once email is connected, readers can subscribe on your website. Open Subscribers to see your list. Resend handles subscriber contacts, delivery, and unsubscribe links.
Before sending, use Send me a test to check the email in your own inbox. A test goes only to your sign-in email address.
If a send result is uncertain, use Check status and inspect the existing broadcast in Resend. Do not create a duplicate to retry. This release supports one newsletter send per post.
Keep your data.
Export your posts as JSON from Posts and your subscriber list as CSV from Subscribers. Subscriber export requires a working Resend connection.
Posts and settings live in your Prisma database; contacts live in your Resend account. Redeploying against the same database preserves your writing. Keep backups through your database provider as well as your exports.
For developers: deployments and previews
Production deployments apply the checked-in Prisma migrations. Give previews a separate PREVIEW_DATABASE_URL and their own private keys. Never point a preview at your production database.
Use Prisma Studio for maintenance. Daily writing and publication settings belong in the Caveat dashboard. See the README for environment variables, migrations, and development commands.
A few ways to get unstuck.
I forgot my password
Use Forgot your password? on your publication’s sign-in page on the sign-in screen. Reset emails work once Resend is connected and your sending domain is verified.
Without working email, someone with deployment access can use the owner recovery command described in the README. The setup key does not reset a password.
The setup key does not match
Check that you copied the whole value for this installation. Local and Vercel installations can have different keys. If you changed an environment variable, restart the local server or redeploy on Vercel.
I cannot send a newsletter yet
Check that Settings shows Email connected. Confirm your Resend key has full access and that the exact domain in your sending address is verified. You can keep writing and publishing to the website while setting up email.
Can I charge readers, schedule posts, or invite a co-author?
This release supports one owner and one publication. Paid subscriptions, scheduling, and collaboration are not included. The comparison page can help if you need a different set of features.
Found something that needs fixing? Open an issue on GitHub