# Unlayer Documentation > Unlayer is an embeddable, white-label drag-and-drop editor SDK that lets your users design responsive emails, landing pages, documents, and popups inside your own application. It pairs the visual builders with built-in AI — an assistant that edits designs from a chat prompt and an importer that turns HTML or screenshots into editable templates — plus a server-side Cloud API for exporting designs to HTML, PDF, images, and ZIP. These docs cover embedding and configuring the JavaScript builders (with React, Angular, and Vue wrappers), the AI features, deep white-label customization, the Cloud API, developer tools (CLI, headless React Elements, and AI coding-assistant Skills), and the portable design JSON data model. Unlayer is an embeddable, white-label content creation platform. Developers drop its drag-and-drop editor into their own product so end users can design responsive emails, landing pages, documents, and popups — without writing code or leaving your app. Core surfaces: - **Builders** (client-side): Embeddable JavaScript editors for email, page, document, and popup design, initialized with `unlayer.init()` and deeply configurable — white-labeling, themes and custom CSS, custom tools and blocks, merge/design tags, display conditions, and localization. Official wrappers ship for React, Angular, and Vue. - **AI** (built in): An AI Assistant edits the design in place from a chat prompt at any level of the design tree (full template, row, text, image, and your own custom tools), works across OpenAI, Anthropic, and Google models, and is locale-aware. The AI Template Importer turns an existing HTML email or a screenshot into a fully editable template in one click. - **Cloud API** (server-side): A REST API to render and export designs to HTML, PDF, images, and ZIP bundles from your backend. - **Developer tools**: A CLI for managing projects and templates, headless React Elements for rendering design JSON without the editor, and Skills that ground AI coding assistants (Cursor, Claude Code, Codex) in current Unlayer APIs. - **Console**: A hosted dashboard for managing projects, templates, billing, and AI credits. Every design is a portable JSON document (body → rows → columns → contents) that flows unchanged between the builders, the Cloud API, and the rendering tools. ## Table of Contents - [Vanilla JS](https://docs.unlayer.com/start/frameworks/vanilla-js): Set up Unlayer with plain JavaScript — no framework required. - [Get Started with Unlayer](https://docs.unlayer.com/start): Unlayer is an embeddable drag-and-drop editor SDK for emails, pages, documents, and popups. Get started in 30 seconds. - [Export HTML](https://docs.unlayer.com/builder/export-html): Export the design in HTML format - [Export Image](https://docs.unlayer.com/builder/export-image): Export the design in image format - [Export PDF](https://docs.unlayer.com/builder/export-pdf): Export the design in PDF format - [Export Plain Text](https://docs.unlayer.com/builder/export-plain-text): Export the design in plain text format - [Export ZIP](https://docs.unlayer.com/builder/export-zip): Export the design in ZIP format - [Installation](https://docs.unlayer.com/builder/installation): Install Unlayer and initialize the builder in your application. - [Load and Save Designs](https://docs.unlayer.com/builder/load-and-save-designs): Load saved designs into the builder and save updated design JSON. - [Version Management](https://docs.unlayer.com/builder/version-management): Choose and manage Unlayer builder versions for your integration. - [Document Builder](https://docs.unlayer.com/builder/document-builder): Embed a document builder for reports, proposals, contracts, and PDF-ready content. - [Quickstart](https://docs.unlayer.com/builder/document-builder/quickstart): Embed a document editor for reports, proposals, and structured content. - [Email Builder](https://docs.unlayer.com/builder/email-builder): Embed a drag-and-drop email builder for responsive email creation. - [Quickstart](https://docs.unlayer.com/builder/email-builder/quickstart): Embed a drag-and-drop email editor in your web application in minutes. - [Test Email](https://docs.unlayer.com/builder/email-builder/test-email): Send test emails from the builder to preview rendered email output. - [Embed Videos](https://docs.unlayer.com/builder/page-builder/embed-videos): Embed videos in page builder designs and configure video content behavior. - [Form Tool](https://docs.unlayer.com/builder/page-builder/form-tool): Add and configure forms in page builder designs. - [Page Builder](https://docs.unlayer.com/builder/page-builder): Embed a visual page builder for landing pages and web content. - [Quickstart](https://docs.unlayer.com/builder/page-builder/quickstart): Embed a visual landing page and web page editor in your web application. - [Popup Builder](https://docs.unlayer.com/builder/popup-builder): Embed a popup builder for modals, banners, and lead-capture experiences. - [Quickstart](https://docs.unlayer.com/builder/popup-builder/quickstart): Embed a popup and modal editor in your web application. - [Hide Property Editors](https://docs.unlayer.com/builder/tools/advanced-options/hide-property-editors): Hide property editors within tools to maintain granular control over the customization experience. - [Hide Property Groups](https://docs.unlayer.com/builder/tools/advanced-options/hide-property-groups): Hide specific property groups from the editing panel, making the user interface more focused and easier to use. - [Button](https://docs.unlayer.com/builder/tools/button): Button tool can add buttons to a design. - [Carousel](https://docs.unlayer.com/builder/tools/carousel): Add an image carousel to email and web designs with Unlayer’s Carousel tool. Enable AMP with amp:true, preview in the editor, and export AMP + stan... - [Columns](https://docs.unlayer.com/builder/tools/columns): Column tool can add columns to a design. - [Divider](https://docs.unlayer.com/builder/tools/divider): Divider tool can add dividers to a design. - [Form](https://docs.unlayer.com/builder/tools/form): Form tool can add forms to a design. - [Heading](https://docs.unlayer.com/builder/tools/heading): Heading tool can add headings to a design. - [HTML](https://docs.unlayer.com/builder/tools/html): HTML tool can add HTML content to a design. - [Image](https://docs.unlayer.com/builder/tools/image): Image tool can add images to a design. - [Menu](https://docs.unlayer.com/builder/tools/menu): Menu tool can add menus to a design. - [Built-In Tools](https://docs.unlayer.com/builder/tools/built-in): Explore the built-in content tools available in the drag-and-drop builder. - [Paragraph](https://docs.unlayer.com/builder/tools/paragraph): Paragraph tool can add text to a design. - [Social Media](https://docs.unlayer.com/builder/tools/social-media): Social Media tool can add social media icons to a design. - [Table](https://docs.unlayer.com/builder/tools/table): Table tool can add table to a design. - [Text](https://docs.unlayer.com/builder/tools/text): Text tool can add text to a design. - [Timer](https://docs.unlayer.com/builder/tools/timer): Timer tool can add a countdowntimer to a design. - [Video](https://docs.unlayer.com/builder/tools/video): Video tool can add YouTube or Vimeo videos to a design. - [CSS / JavaScript](https://docs.unlayer.com/builder/tools/custom/css-javascript): Insert tool CSS or JavaScript in exported HTML head markup. - [Property States](https://docs.unlayer.com/builder/tools/custom/property-states): Manage property states on change of value - [Transform Property Values](https://docs.unlayer.com/builder/tools/custom/transform-property-values): Transformer is a function to modify values of properties - [Built-In Property Editors](https://docs.unlayer.com/builder/tools/custom/property-editors): Use built-in property editors when configuring custom builder tools. - [Create a Custom Tool](https://docs.unlayer.com/builder/tools/custom/create): Create a custom builder tool with JavaScript renderers, properties, and behavior. - [Custom Tools](https://docs.unlayer.com/builder/tools/custom): Build custom tools that add application-specific content blocks to the builder. - [Tools](https://docs.unlayer.com/builder/tools): Tools are the core building blocks within the drag-and-drop builder that allow users to create and customize content. - [Custom JS / CSS](https://docs.unlayer.com/builder/appearance/custom-js-css): Customize the builder iframe with custom JavaScript and CSS. - [Layout](https://docs.unlayer.com/builder/appearance/layout): Configure builder layout options such as panels, tabs, and editor placement. - [Loading Spinner](https://docs.unlayer.com/builder/appearance/loading-spinner): Replace the default builder loading spinner with a custom loading experience. - [Appearance](https://docs.unlayer.com/builder/appearance): Configure builder themes, layouts, loading states, and custom appearance code. - [Themes](https://docs.unlayer.com/builder/appearance/themes): Choose built-in builder themes or provide custom theme colors. - [Body Values](https://docs.unlayer.com/builder/content-settings/body-values): Set default values for the Body panel in the Unlayer editor. - [Disable Columns](https://docs.unlayer.com/builder/content-settings/columns/disable): Disable column controls to limit how users create column layouts. - [Columns](https://docs.unlayer.com/builder/content-settings/columns): Configure column behavior and layout options available inside designs. - [Predefined Columns](https://docs.unlayer.com/builder/content-settings/columns/predefined): Define preset column layouts that users can choose in the builder. - [Content Audit](https://docs.unlayer.com/builder/content-settings/content-audit): Audit email and page content for accessibility and missing content issues. - [Headers and Footers](https://docs.unlayer.com/builder/content-settings/headers-and-footers): Enable dedicated header and footer sections in emails and web pages for consistent branding and structured content layout. - [Min / Max Rows](https://docs.unlayer.com/builder/content-settings/min-max-rows): Set minimum and maximum row limits for builder content. - [Content Settings](https://docs.unlayer.com/builder/content-settings): Configure content structure, defaults, and editing rules for builder designs. - [Page Anchors](https://docs.unlayer.com/builder/content-settings/page-anchors): Enable and configure page anchors for navigation inside page designs. - [Page Title](https://docs.unlayer.com/builder/content-settings/page-title): Set exported HTML title. - [Preheader Text](https://docs.unlayer.com/builder/content-settings/preheader-text): Configure email preheader text shown in inbox previews. - [Auto Select On Drop](https://docs.unlayer.com/builder/editor-behavior/auto-select-on-drop): Automatically select the tool when it is dropped into the builder. - [Blank Design](https://docs.unlayer.com/builder/editor-behavior/blank-design): Reset the editor to a blank state, removing any existing content or templates. - [Confirm On Delete](https://docs.unlayer.com/builder/editor-behavior/confirm-on-delete): Enable confirmation dialogs before deleting content to prevent accidental removal. - [Editor Behavior](https://docs.unlayer.com/builder/editor-behavior): Configure editor behavior such as undo, selection, previews, and delete prompts. - [Preview Designs](https://docs.unlayer.com/builder/editor-behavior/preview-designs): Allow users to preview designs across different devices to ensure responsive layouts. - [Responsive Controls](https://docs.unlayer.com/builder/editor-behavior/responsive-controls): Configure the responsive controls for the editor. - [Undo / Redo](https://docs.unlayer.com/builder/editor-behavior/undo-redo): Configure the ability to undo or redo actions within the builder. - [Accessibility](https://docs.unlayer.com/builder/accessibility): Configure accessibility settings that help users create more inclusive builder content. - [Color Management](https://docs.unlayer.com/builder/color-management): Control available colors and color picker behavior in the builder. - [Device Management](https://docs.unlayer.com/builder/device-management): Manage responsive device previews and device-specific builder behavior. - [Domain Management](https://docs.unlayer.com/builder/domain-management): Learn how to whitelist domains in the Unlayer Console for production use. Ensure full feature access, remove the watermark, and configure wildcard ... - [Design Tags](https://docs.unlayer.com/builder/dynamic-content/design-tags): Design tags are display variables in a template that change with who's using the editor. - [Display Conditions](https://docs.unlayer.com/builder/dynamic-content/display-conditions): Display conditions allow you to control when a design element is displayed to the user. - [Dynamic Images](https://docs.unlayer.com/builder/dynamic-content/dynamic-images): Dynamic images give each recipient their own unique image using merge tags. - [Merge Tags](https://docs.unlayer.com/builder/dynamic-content/merge-tags): Merge tags allow users to dynamically add content to their email or page. - [End-User Identification](https://docs.unlayer.com/builder/end-user-identification): Identify end users so Unlayer can separate user-specific content and activity. - [Events & Callbacks](https://docs.unlayer.com/builder/events): Use builder events and callbacks to react to editor lifecycle and user actions. - [Custom Fonts](https://docs.unlayer.com/builder/font-management/custom-fonts): Add your own custom fonts to match your brand guidelines. - [Default Fonts](https://docs.unlayer.com/builder/font-management/default-fonts): Establish default font families for text elements to streamline the content creation process. - [Font Sizes](https://docs.unlayer.com/builder/font-management/font-sizes): Define and control the available font sizes within the editor for uniformity. - [Font Management](https://docs.unlayer.com/builder/font-management): Manage builder fonts, font sizes, defaults, and custom font options. - [Link Types](https://docs.unlayer.com/builder/link-management/link-types): Define and manage different link types, such as website URLs, email addresses, phone numbers, SMS, or file downloads. - [Link Management](https://docs.unlayer.com/builder/link-management): Configure link behavior, link types, and special links available in the builder. - [Special Links](https://docs.unlayer.com/builder/link-management/special-links): Predefined links that make it easier for the end-user to pick and set commonly used links for buttons or linkable elements in the design. - [Localization](https://docs.unlayer.com/builder/localization): Localize the builder interface and customize labels for different languages. - [Security Settings](https://docs.unlayer.com/builder/security): Configure security settings for scripts, links, and trusted builder behavior. - [Style Guide](https://docs.unlayer.com/builder/styleguide): Configure reusable brand styles that users can apply inside the builder. - [Tab Management](https://docs.unlayer.com/builder/tab-management): Customize the builder tabs and panels shown to end users. - [Clean Paste](https://docs.unlayer.com/builder/text-management/clean-paste): Automatically clean up formatting when pasting content from external sources. - [Custom Buttons](https://docs.unlayer.com/builder/text-management/custom-buttons): Allow the creation and customization of buttons within text elements. - [Emojis](https://docs.unlayer.com/builder/text-management/emojis): Enable emoji support within text fields. - [Inline Font Controls](https://docs.unlayer.com/builder/text-management/inline-font-controls): Provide inline editing options for font family, size, and styling. - [Text Management](https://docs.unlayer.com/builder/text-management): Configure text editing features, formatting controls, and text behavior. - [Spell Checker](https://docs.unlayer.com/builder/text-management/spell-checker): Enable or disable automatic spell checking in the text editor. - [Tables](https://docs.unlayer.com/builder/text-management/tables): Allow users to create and edit tables within the text editor. - [Text Direction](https://docs.unlayer.com/builder/text-management/text-direction): Enable text direction controls for RTL/LTR support in the text editor. - [Trigger Change Event](https://docs.unlayer.com/builder/text-management/trigger-change-event): Configure the text editor to trigger change events during text editing. - [Legacy Templates](https://docs.unlayer.com/builder/templates/legacy): Understand legacy templates and how they differ from current template workflows. - [Multi-Language Templates](https://docs.unlayer.com/builder/latest/templates/multi-language): Create templates with content in multiple languages, allowing users to switch between languages and provide translations. - [Templates](https://docs.unlayer.com/builder/templates): Templates are pre-designed layouts that serve as starting points for creating content. - [Template Management](https://docs.unlayer.com/builder/templates/management): Create, organize, and manage reusable templates for builder users. - [Template Permissions](https://docs.unlayer.com/builder/templates/permissions): Control who can create, edit, and access templates in the builder. - [Angular Component](https://docs.unlayer.com/builder/angular-component): Embed the Unlayer drag-and-drop builder in an Angular app with the official angular-email-editor package — installation, usage, methods, and props. - [React Component](https://docs.unlayer.com/builder/react-component): Embed the Unlayer drag-and-drop builder in a React app with the official react-email-editor package — installation, usage, methods, and props. - [Vue Component](https://docs.unlayer.com/builder/vue-component): Embed the Unlayer drag-and-drop builder in a Vue app with the official vue-email-editor package — installation, usage (Vue 3 + Options API), Nuxt n... - [Custom Blocks](https://docs.unlayer.com/builder/blocks/custom): Create custom reusable blocks that users can drag into their designs. - [Synced Blocks](https://docs.unlayer.com/builder/blocks/sync): Create reusable synced blocks that can update across multiple designs. - [User Saved Blocks](https://docs.unlayer.com/builder/blocks/user-saved): Let users save and reuse their own blocks across designs. - [File Manager](https://docs.unlayer.com/builder/file-manager): Let users upload, manage, and reuse images from the builder file manager. - [Amazon S3](https://docs.unlayer.com/builder/file-storage/amazon-s3): Connect Amazon S3 as the storage backend for uploaded files and images. - [Custom File Storage](https://docs.unlayer.com/builder/file-storage/custom): Connect a custom storage backend for files uploaded through the builder. - [File Storage](https://docs.unlayer.com/builder/file-storage): Configure where builder files and images are stored. - [Custom Image Library](https://docs.unlayer.com/builder/images/custom-image-library): Custom image library lets you build your own UI for image and media library. - [Image Editor](https://docs.unlayer.com/builder/images/image-editor): Image editor lets you resize, crop or apply effects to images. - [Images](https://docs.unlayer.com/builder/images): Configure image upload, editing, stock image, SVG, and custom image library options. - [Stock Images](https://docs.unlayer.com/builder/images/stock-images): Stock images lets you search and insert royalty-free images. - [SVG Images](https://docs.unlayer.com/builder/images/svg-images): Allow users to upload SVG images. - [Authentication](https://docs.unlayer.com/server/authentication): How to authenticate against Unlayer's server-side APIs — API Keys and Personal Access Tokens — plus where to get each one in Console. - [Cloud API](https://docs.unlayer.com/server/cloud-api): Server-side REST API for exporting and generating artifacts from Unlayer designs, managing templates, and validating or converting design JSON. - [Context (system prompt)](https://docs.unlayer.com/ai/assistant/customization/context): Seed every AI Assistant turn with your own system prompt, brand voice rules, or per-customer context — planned customization API. - [Custom Claude Key](https://docs.unlayer.com/ai/assistant/customization/custom-claude-key): Bring your own Anthropic API key so Anthropic-model requests bill against your account instead of Unlayer's. - [Custom Gemini Key](https://docs.unlayer.com/ai/assistant/customization/custom-gemini-key): Bring your own Google Gemini API key so Gemini-model requests bill against your account instead of Unlayer's. - [Custom OpenAI Key](https://docs.unlayer.com/ai/assistant/customization/custom-openai-key): Bring your own OpenAI API key so OpenAI-model requests bill against your account instead of Unlayer's. - [Picking a Model](https://docs.unlayer.com/ai/assistant/customization/picking-a-model): Choose which LLM the AI Assistant uses, or let Unlayer route requests automatically. - [Picking an Image Model](https://docs.unlayer.com/ai/assistant/customization/picking-an-image-model): Choose the AI image model used by Magic Image and the image editor, or let Unlayer pick. - [Events & Callbacks](https://docs.unlayer.com/ai/assistant/events-callbacks): Track AI Assistant turns from your host app via addEventListener / registerCallback. - [Examples](https://docs.unlayer.com/ai/assistant/examples): Live demos and screenshots of the AI Assistant in action. - [FAQ & Troubleshooting](https://docs.unlayer.com/ai/assistant/faq): Answers to the most common questions about the AI Assistant — pricing, credits, privacy, opt-out, custom tools, merge tags, missing chat tab, langu... - [Custom Tools](https://docs.unlayer.com/ai/assistant/how-it-works/custom-tool): How the AI Assistant works with embedder-defined custom tools — automatic support when possible, plus the schema field needed for custom widgets an... - [Full Template](https://docs.unlayer.com/ai/assistant/how-it-works/full-template): When and how the AI Assistant generates full templates — and how to disable it via the features.ai.fullTemplateGeneration init flag to control cost. - [Image](https://docs.unlayer.com/ai/assistant/how-it-works/image): AI features for working with images — generate new images, edit existing ones, and write alt text. - [Row](https://docs.unlayer.com/ai/assistant/how-it-works/row): How the AI Assistant works on a selected row — multi-block rewrites, restyle, translate, swap layouts. - [Text](https://docs.unlayer.com/ai/assistant/how-it-works/text): How the AI Assistant writes and rewrites text across Text, Button, and Heading tools — same behavior, surrounding context aware, formatting preserved. - [AI Assistant](https://docs.unlayer.com/ai/assistant): The AI Assistant is a chat-based assistant inside the Unlayer builder. Users describe what they want and the assistant edits the design in place. - [Pricing](https://docs.unlayer.com/ai/assistant/pricing): How AI usage is priced in Unlayer — credit-based model, plan caps, and credit packs for going over. - [Setup (legacy)](https://docs.unlayer.com/ai/legacy): Legacy reference for the editor's `features.ai` init option — sub-feature flags for embedded AI tools. - [Setup](https://docs.unlayer.com/ai/assistant/setup): How the AI Assistant is enabled in the Unlayer builder, and how to disable it per embed. - [MCP](https://docs.unlayer.com/ai/mcp): Model Context Protocol server for Unlayer — connect Claude Desktop, Cursor, Codex, and other MCP clients to your Unlayer workspace. - [How Skills Work](https://docs.unlayer.com/ai/skills/concepts/how-skills-work): Technical details on how Unlayer Skills are structured, how AI coding assistants read them, and how the router delegates to sub-skills. - [What Are Skills?](https://docs.unlayer.com/ai/skills/concepts/what-are-skills): Learn what Unlayer Skills are and how they help AI coding assistants give accurate, up-to-date guidance for your Unlayer integration. - [Install Skill](https://docs.unlayer.com/ai/skills/getting-started/install-skill): Install Unlayer Skills into your project with a single command. - [Using with Claude Code](https://docs.unlayer.com/ai/skills/getting-started/using-with-claude-code): Set up and use Unlayer Skills with Claude Code for expert-level Unlayer integration help. - [Using with Codex](https://docs.unlayer.com/ai/skills/getting-started/using-with-codex): Set up and use Unlayer Skills with OpenAI Codex for expert-level Unlayer integration help. - [Using with Cursor](https://docs.unlayer.com/ai/skills/getting-started/using-with-cursor): Set up and use Unlayer Skills with Cursor IDE for expert-level Unlayer integration help. - [Using with Other Tools](https://docs.unlayer.com/ai/skills/getting-started/using-with-other-tools): Set up Unlayer Skills with GitHub Copilot, Windsurf, and other AI coding assistants. - [Skills](https://docs.unlayer.com/ai/skills): Use Unlayer Skills to get expert help integrating, customizing, and building with the Unlayer editor from your AI coding assistant. - [AI Template Importer](https://docs.unlayer.com/ai/template-importer): Import an existing HTML email or a screenshot into Unlayer with one click — the AI Template Importer converts it into an editable template in your ... - [Console](https://docs.unlayer.com/console): The Unlayer Console is the hosted dashboard where teams manage projects, templates, billing, and AI-powered template imports. - [Custom Backend](https://docs.unlayer.com/builder/latest/collaboration/custom-backend): Store collaboration threads and comments in your own database by registering providers and callbacks — instead of Unlayer's default cloud storage. - [Team Collaboration](https://docs.unlayer.com/builder/latest/collaboration): Team Collaboration turns the builder into a shared review workspace — teams comment directly on design components, discuss in threads, prioritize, ... - [Setup](https://docs.unlayer.com/builder/latest/collaboration/setup): Enable Team Collaboration in the builder — feature flag, design identity, and user identity required for comment threads. - [Using Comments](https://docs.unlayer.com/builder/latest/collaboration/using-comments): What your users see and can do in Collaboration Mode — starting threads, replying, comment types, resolving, and filtering. - [From 1.309.4 to 1.339.0](https://docs.unlayer.com/builder/migration/from-1-309-4-to-1-339-0): Migrating from 1.309.4 to 1.339.0 — Text tool deprecated in favor of Paragraph tool. - [From 1.339.0 to 1.364.0](https://docs.unlayer.com/builder/migration/from-1-339-0-to-1-364-0): Migrating from 1.339.0 to 1.364.0 — text editor update for Heading and Button tools. - [From 1.382.0 to Latest](https://docs.unlayer.com/builder/migration/from-1-382-0-to-latest): Migrating from 1.382.0 to Latest — rich_text property editor deprecated, text editor update for Table tool. - [Authentication](https://docs.unlayer.com/cli/authentication): Sign in with a Personal Access Token via interactive browser flow or a non-interactive token. - [Auth Commands](https://docs.unlayer.com/cli/commands/auth): login, logout, whoami — sign in, sign out, and inspect the active session. - [Scaffold a New Project](https://docs.unlayer.com/cli/commands/init): Scaffold a new Unlayer project from an official starter template across five frameworks. - [Resource Commands](https://docs.unlayer.com/cli/commands/resources): workspace, project, template — browse, switch, and inspect the resources in your Unlayer account. - [Settings Commands](https://docs.unlayer.com/cli/commands/settings): config, env, status — manage CLI state, environment profiles, and check connectivity. - [Sync Commands](https://docs.unlayer.com/cli/commands/sync): pull and diff — sync templates between Unlayer and your local repo. - [Configuration](https://docs.unlayer.com/cli/configuration): Global config, environment profiles, the unlayer.config.json project file, and all environment variables and global flags. - [Errors & Troubleshooting](https://docs.unlayer.com/cli/errors): Exit codes, common error messages, and how to recover. - [Examples](https://docs.unlayer.com/cli/examples): End-to-end workflows for the Unlayer CLI — bootstrap, sync, CI/CD, and multi-environment setups. - [Installation](https://docs.unlayer.com/cli/installation): Install @unlayer/cli globally via npm and verify the install. - [CLI](https://docs.unlayer.com/cli): The Unlayer CLI lets you manage templates, projects, and workspaces from your terminal — and scaffold new Unlayer projects from official starter te... - [Quick Reference](https://docs.unlayer.com/cli/quick-reference): Every Unlayer CLI command, flag, env var, and exit code in one scroll. - [Elements](https://docs.unlayer.com/elements): Unlayer Elements is a free, open-source code-first React component library for rendering emails, pages, and documents to HTML. - [Button](https://docs.unlayer.com/elements/react/components/content/button): Button renders linked calls to action with color, hover, spacing, and width controls. - [Divider](https://docs.unlayer.com/elements/react/components/content/divider): Divider renders horizontal separators with width, border, and alignment controls. - [Heading](https://docs.unlayer.com/elements/react/components/content/heading): Heading renders semantic headings with typography and alignment controls. - [Html](https://docs.unlayer.com/elements/react/components/content/html): Html renders arbitrary custom HTML inside an Elements content column. - [Image](https://docs.unlayer.com/elements/react/components/content/image): Image renders accessible images with sizing, alignment, and optional link actions. - [Menu](https://docs.unlayer.com/elements/react/components/content/menu): Menu renders horizontal or vertical navigation links, commonly used in headers and footers. - [Paragraph](https://docs.unlayer.com/elements/react/components/content/paragraph): Paragraph renders rich text from React children or inline HTML. - [Social](https://docs.unlayer.com/elements/react/components/content/social): Social renders a configurable row of social profile icons. - [Table](https://docs.unlayer.com/elements/react/components/content/table): Table renders static tabular content from headers, rows, or the full values escape hatch. - [Video](https://docs.unlayer.com/elements/react/components/content/video): Video renders a clickable YouTube or Vimeo thumbnail for email-safe video links. - [Content Components](https://docs.unlayer.com/elements/react/components/content): Heading, Paragraph, Button, Image, Divider, Video, Html, Table, Social, and Menu — all the building blocks that go inside a Column. - [ColumnLayouts](https://docs.unlayer.com/elements/react/components/layout/column-layouts): ColumnLayouts provides predefined column ratios and custom cell arrays for Row layouts. - [Column](https://docs.unlayer.com/elements/react/components/layout/column): Column hosts content components inside a Row and controls shared spacing and background styles. - [Row](https://docs.unlayer.com/elements/react/components/layout/row): Row is the section-level layout container inside Email, Page, Document, and Body wrappers. - [Layout Components](https://docs.unlayer.com/elements/react/components/layout): Row, Column, and ColumnLayouts — the structural primitives every Elements tree is built from. - [Configuration](https://docs.unlayer.com/elements/react/configuration): Configure Elements globally with UnlayerProvider, the SSR-friendly config prop, and the prop rules every component shares. - [Installation](https://docs.unlayer.com/elements/react/installation): Install @unlayer/react-elements and configure peer dependencies. - [Limitations](https://docs.unlayer.com/elements/react/limitations): Known constraints, common mistakes, and how to mitigate doc staleness. - [Output Formats](https://docs.unlayer.com/elements/react/output-formats): What each wrapper actually produces — table HTML for email, flexbox HTML for web, print-tuned HTML for PDF. - [Quick Reference](https://docs.unlayer.com/elements/react/quick-reference): One-page cheat sheet — every component, every render function, every commonly-used prop in one scroll. - [Quickstart](https://docs.unlayer.com/elements/react/quickstart): Build and render your first email with @unlayer/react-elements in under a minute. - [Rendering API](https://docs.unlayer.com/elements/react/rendering-api): renderToHtml, renderToHtmlParts, renderToPlainText, renderToJson, and renderRowToJson — five entry points for turning your component tree into output. - [Wrappers](https://docs.unlayer.com/elements/react/wrappers): Email, Page, Document, and Body — the four root wrappers that target different rendering modes from a shared component tree. - [SDK](https://docs.unlayer.com/sdk): Unlayer's official TypeScript SDK for the Cloud REST API — typed client, automatic retries, and full coverage of templates, projects, workspaces, a... - [Block object](https://docs.unlayer.com/design-schema/block-object): Rows, columns, and the content containers inside an Unlayer design — the structural skeleton between the design root and the leaf content items. - [Content types](https://docs.unlayer.com/design-schema/content-types): The leaf content blocks inside an Unlayer design — text, image, button, heading, divider, html, video, social, menu, timer, and embedder-defined cu... - [Design object](https://docs.unlayer.com/design-schema/design-object): The root design JSON object — body, counters, optional schema version, and (in Simple form) the round-trip _conversion block. - [Design Schema](https://docs.unlayer.com/design-schema/): Reference for the Unlayer design JSON — design, body, row, column, content — the canonical shape every API and the embedded builder share. - [Full and Simple schemas](https://docs.unlayer.com/design-schema/schema-forms): Every Unlayer design exists in two forms — the verbose Full schema the editor manipulates, and the compact Simple schema the AI reads and writes (a...