# Lettrove docs 1.x > Lettrove is the embeddable drag-and-drop email editor and page builder for web apps. Developers put it inside their own product so their users design emails, landing pages, popups and documents there, white-labeled, with AI built in and HTML that renders in every inbox. Parts: the browser SDK `@lettrove/embed` (and `@lettrove/react`, `@lettrove/vue`), the server SDK `@lettrove/node`, the REST API at https://api.lettrove.com and webhooks, both also described as OpenAPI 3.1 at https://docs.lettrove.com/openapi/v1.json. The Lettrove app at https://lettrove.com is the same editor for a team: audiences from files or HubSpot, sending from the team’s own domain, and an MCP server (https://lettrove.com/api/mcp) through which an AI assistant works in it as the signed-in person; the "Using Lettrove" pages cover it. Every page below is plain Markdown at its address + `.md`. ## Docs - [Introduction](https://docs.lettrove.com/docs.md): Lettrove is the embeddable drag-and-drop email editor and page builder for web apps — add it to your product with one npm package, white-labeled, with AI built in. ## Get started - [Quickstart](https://docs.lettrove.com/docs/get-started/quickstart.md): The Lettrove editor in a React app on localhost — a project, a token route, one component, and the email as HTML. ## Other frameworks - [Next.js](https://docs.lettrove.com/docs/get-started/nextjs.md): The editor in a Next.js App Router app — a token route handler with @lettrove/node and a client component with @lettrove/react, in four files. - [Vue](https://docs.lettrove.com/docs/get-started/vue.md): The Lettrove editor in a Vue 3 app — the LettroveEditor component from @lettrove/vue, a small token server, and the email as HTML. - [Angular](https://docs.lettrove.com/docs/get-started/angular.md): The Lettrove editor in an Angular app — createEditor from @lettrove/embed in one component, with a small token server, and the email as HTML. - [SvelteKit](https://docs.lettrove.com/docs/get-started/sveltekit.md): The Lettrove editor in a SvelteKit app — a token route with @lettrove/node and createEditor from @lettrove/embed in one page, in one process. - [Plain HTML](https://docs.lettrove.com/docs/get-started/html.md): The Lettrove editor on a page with no build step — a script tag, a token route, and the email as HTML, in two files. ## Get started - [How it fits together](https://docs.lettrove.com/docs/get-started/concepts.md): Projects, publishable and secret keys, editor tokens, allowed sites, end users, and test versus live — the six ideas behind every Lettrove integration. ## The editor in your page - [Install](https://docs.lettrove.com/docs/editor/install.md): Add the Lettrove editor to a page with npm, as a React component, or with a script tag and no build step. - [Options](https://docs.lettrove.com/docs/editor/options.md): Everything createEditor and LettroveEditor take — which design opens, which panels and tools appear, which features are on — and how options can only narrow what the project allows. - [Theming and white label](https://docs.lettrove.com/docs/editor/theming.md): Make the editor look like your product — your colour in light and dark mode, your font and corners, your logo and product name in its bar. - [Events](https://docs.lettrove.com/docs/editor/events.md): What the editor tells your page — opened, changed, saved, selected, uploaded, errors — in the order it happens, with every payload. ## Modes - [Email](https://docs.lettrove.com/docs/editor/modes/email.md): An email project makes HTML emails that render in Gmail, Outlook and Apple Mail — what it makes, its downloads, and how you send what your users design. - [Landing page](https://docs.lettrove.com/docs/editor/modes/landing-page.md): A landing-page project makes responsive web pages — publish the whole page, or place its pieces inside a page of your own. - [Popup](https://docs.lettrove.com/docs/editor/modes/popup.md): A popup project makes sign-up boxes, offers and notices for websites — where they sit, when they open, how often, and how your site's code opens, closes and hears them. - [Document](https://docs.lettrove.com/docs/editor/modes/document.md): A document project makes proposals, reports and one-pagers on real paper — paper size, margins, header, footer and page numbers, exported as a print-ready PDF. ## The editor in your page - [Forms](https://docs.lettrove.com/docs/editor/forms.md): Landing pages and popups can collect sign-ups and enquiries with a form block — handle each submission in your own page's code, or have it posted to your own URL. - [Getting designs out](https://docs.lettrove.com/docs/editor/exports.md): Every way to get a design out of Lettrove — HTML whole or in pieces, plain text, PDF, PNG, ZIP and the design itself — from the page or from your server, with what each returns. - [Merge tags](https://docs.lettrove.com/docs/editor/merge-tags.md): Personalise what your users design — {{contact.first_name}}, fallbacks, unsubscribe and preferences links — filled by Lettrove at export, or left for your own email service. - [Allowed sites and CSP](https://docs.lettrove.com/docs/editor/allowed-sites.md): Which sites the editor may appear on, how to add yours, and the one Content-Security-Policy line your pages need. - [Releases and pinning](https://docs.lettrove.com/docs/editor/releases.md): Which version of the editor your users get, how to pin one, and how release candidates are tested before anyone else sees them. ## Your server - [Minting tokens](https://docs.lettrove.com/docs/server/tokens.md): Your server's one required job — exchange your secret key for a short-lived editor token, in Node or any language over HTTPS — with the exact request, response and errors. - [Server API](https://docs.lettrove.com/docs/server/server-api.md): What your server can do with your secret key — list and read your users' designs, export them, render a design you hold, and erase a person — with @lettrove/node or plain HTTPS. - [Webhooks](https://docs.lettrove.com/docs/server/webhooks.md): Have Lettrove tell your server when a design is saved or deleted, an export is made or a person is erased — set one up, verify each delivery's signature, and handle retries. ## Your data - [What Lettrove stores](https://docs.lettrove.com/docs/data/what-we-store.md): Every kind of data Lettrove keeps for an embed project — who keeps it, for how long, and how it is deleted — for your security review. - [Keeping your own copy](https://docs.lettrove.com/docs/data/own-copy.md): Keep every design in your own database too — from the page as your user saves, or from your server on every save with a webhook — and render it whenever you like. - [Your own upload handler](https://docs.lettrove.com/docs/data/own-upload-handler.md): Keep every image your users upload in your own storage — any cloud, CDN, DAM or database — with two functions in your page; Lettrove keeps none of them. - [Your own design storage](https://docs.lettrove.com/docs/data/own-design-storage.md): Keep every design in your own database — the editor loads and saves through two functions in your page, with revisions and conflicts handled; Lettrove keeps none of them. - [Erasure and privacy](https://docs.lettrove.com/docs/data/erasure.md): Erase one person and everything they made with one call, what is removed and what is kept, and how Lettrove fits your privacy obligations. ## Going live - [Test and live keys](https://docs.lettrove.com/docs/going-live/test-and-live.md): Build with test keys, launch with live keys — the difference between them, and the checklist before your users see the editor. - [Security](https://docs.lettrove.com/docs/going-live/security.md): How the editor stays safe on your site — keys, tokens, allowed sites, what runs where — and what to do if a secret key leaks. - [Limits](https://docs.lettrove.com/docs/going-live/limits.md): Every size, rate and count limit in Lettrove 1.x, in one table. - [Troubleshooting](https://docs.lettrove.com/docs/going-live/troubleshooting.md): What to do when the editor does not open, a token is refused, an export or a webhook does not arrive — by what you see, with every error code. ## Docs - [Changelog](https://docs.lettrove.com/docs/changelog.md): What changed in each release of the Lettrove SDK and editor, newest first. ## Docs - [Using Lettrove](https://docs.lettrove.com/docs/app/overview.md): What the Lettrove app at lettrove.com does — emails designed with AI, audiences from your own files or HubSpot, sending from your own domain, a team with roles — and how an AI assistant can work in it through the MCP server. - [MCP server](https://docs.lettrove.com/docs/app/mcp.md): Connect Claude, Cursor or any MCP client to Lettrove once, and it works in Lettrove as you — designing emails from a brief, checking lists, sending tests and campaigns, reading results — with your permissions and nothing more. ## Audiences - [Bringing contacts in](https://docs.lettrove.com/docs/app/audiences/import.md): Every way a list of people gets into Lettrove — a CSV, Excel or PDF file, typed or pasted by hand, through the MCP server, or synced from HubSpot — with the limits, what is checked on the way in, and how columns become merge tags. - [HubSpot](https://docs.lettrove.com/docs/app/audiences/hubspot.md): Bring your HubSpot lists into Lettrove as audiences by installing the Lettrove app on HubSpot — the three setup steps, exactly what the app can access and why, what Lettrove stores, and how to remove it. ## Docs - [Sending](https://docs.lettrove.com/docs/app/sending.md): How a workspace sends email from its own domain — verifying a domain with DNS records, sender addresses, test sends, campaigns to lists now or on a schedule, tracking, unsubscribes, and the figures per send. - [Workspaces, roles and the activity log](https://docs.lettrove.com/docs/app/team.md): Workspaces, the four roles and exactly what each may do, invitations, the activity log every privileged action is written to, connected apps, and two-factor authentication. - [Integrations](https://docs.lettrove.com/docs/app/integrations.md): The tools a workspace can connect — HubSpot for audiences, by authorising Lettrove on HubSpot's site — and where the rest stand. - [AI and your allowance](https://docs.lettrove.com/docs/app/ai.md): Where AI works in Lettrove — designing and editing emails from a brief, generating pictures — what it never sees, and how the allowance is counted across an account's workspaces. - [Security](https://docs.lettrove.com/docs/app/security.md): How the Lettrove app protects a workspace — roles enforced deny-by-default, an append-only activity log, how credentials and tokens are stored, reviewed change management — for your security review. ## API reference - [API overview](https://docs.lettrove.com/docs/api.md): The reference for Lettrove 1.x — the browser SDK, the React and Vue components, the server SDK, the REST API and webhooks — and the conventions they share. - [@lettrove/embed](https://docs.lettrove.com/docs/api/embed.md): The browser SDK reference — createEditor, every option, the editor handle's methods, events, errors and exported types. - [@lettrove/react](https://docs.lettrove.com/docs/api/react.md): The React component reference — LettroveEditor's props, event props, ref, and how it behaves with StrictMode, server rendering and changing props. - [@lettrove/vue](https://docs.lettrove.com/docs/api/vue.md): The Vue 3 component reference — LettroveEditor's props, events, template ref, and how it behaves with server rendering and changing props. - [@lettrove/node](https://docs.lettrove.com/docs/api/node.md): The server SDK reference — the Lettrove client, tokens, designs, exports, rendering, erasure, webhook verification and LettroveApiError. - [REST API](https://docs.lettrove.com/docs/api/endpoints.md): Every server endpoint of the Lettrove API — request, response, status codes and limits — for calling it over HTTPS from any language. Generated from the OpenAPI document. - [Webhook events](https://docs.lettrove.com/docs/api/webhook-events.md): Every webhook event Lettrove sends — its envelope, headers, data fields and an example. Generated from the OpenAPI document. - [Error codes](https://docs.lettrove.com/docs/api/errors.md): Every error code the editor, the browser SDK, the server SDK and the API can give — what it means and what to do. - [The design document](https://docs.lettrove.com/docs/api/design-document.md): What you may rely on in a design document you store — and what you may not. - [Glossary](https://docs.lettrove.com/docs/api/glossary.md): One word for each idea in Lettrove, and what it means.