> ## Documentation Index
> Fetch the complete documentation index at: https://docs.pixy.art/llms.txt
> Use this file to discover all available pages before exploring further.

# Welcome

> Add the Pixy editor to your own product.

# Add Pixy To Your Product

Pixy Embed API lets you launch the Pixy editor inside your app so users can customize designs without leaving your product.

Use it when you want users to:

* open and edit a saved design
* start from a blank canvas with your chosen dimensions
* create a new copy from an existing design
* save exported files back into your product

## What You Can Build

<AccordionGroup>
  <Accordion title="In-product editors" icon="panel-left">
    Render the Pixy editor inline inside your app for a native editing workflow.
  </Accordion>

  <Accordion title="Modal launchers" icon="external-link">
    Open the editor only when a user clicks a button, then return the saved export through a callback.
  </Accordion>

  <Accordion title="Template customization" icon="layout-template">
    Let users start from a design you provide, edit it, and save either the original design or a new copy.
  </Accordion>

  <Accordion title="Controlled editor experiences" icon="sliders-horizontal">
    Configure allowed domains, branding, accent color, launch mode, and visible sidebar items from Pixy.
  </Accordion>
</AccordionGroup>

## How It Works

<Steps>
  <Step title="Create embed settings">
    Open the Embed dashboard in Pixy and configure the domains and editor options your app can use.
  </Step>

  <Step title="Add the SDK">
    Load the Pixy embed SDK in your page.
  </Step>

  <Step title="Launch the editor">
    Mount the editor inline or open it in a modal with your `embedKey`.
  </Step>

  <Step title="Handle saved exports">
    Use `onExport` to receive the saved `designId` and exported file URLs.
  </Step>
</Steps>

## Where To Go Next

<Card title="Authentication" icon="key" href="/embed/authentication">
  Learn how embed keys and allowed origins control access to the embedded editor.
</Card>

<Card title="How to use" icon="compass" href="/embed/how-to-use">
  Add the SDK, launch the editor inline or in a modal, and handle saved exports.
</Card>

<Card title="Optional parameters" icon="sliders-horizontal" href="/embed/optional-parameters">
  Pass app-specific user ids, customize the save button, and upload initial image URLs.
</Card>

<Card title="Configuration" icon="settings" href="/embed/configuration">
  Configure branding, launch behavior, and editor sidebar visibility.
</Card>