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

# Bring in a Photoshop file

> Turn a layered .psd into a design template, with your text still editable and your pictures saved into folders you can swap from.

If your artwork already exists as a Photoshop file, you don't have to draw it again. Customei reads the file and builds a design template out of it.

You keep the things that matter:

* **Your text stays text.** You can still change the words, the size, and the font later.
* **Your layers stay separate.** A group in Photoshop becomes a group here, so nothing is flattened into one flat picture.
* **Your pictures become swappable.** Every picture is saved into a folder of images, so a customer can switch between them later.

## Start the import

Go to **Design Templates** and click **Import PSD**.

<Frame caption="Design Templates. Import PSD sits next to Create template.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-button.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=0544b12aef2eeab52eb9bc12d7c27e7b" alt="The Design Templates page in Shopify admin with the Import PSD button highlighted in the top right, next to Import from Gallery and Create template." width="3840" height="2400" data-path="images/templates/import-psd-button.png" />
</Frame>

Drag your file onto the box, or click **Choose .psd file** and pick it.

<Frame caption="Drop a .psd here, or browse for it.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-choose-file.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=0cbb948d125c6a665aa9197f84460c98" alt="The Import PSD as template dialog showing a drop area with the words Turn a Photoshop file into a design template and a Choose .psd file button." width="2008" height="1008" data-path="images/templates/import-psd-choose-file.png" />
</Frame>

<Note>
  Only `.psd` files, up to 400MB. If your file is bigger, flatten the layers you don't need in Photoshop and try again. Reading a big file takes a few seconds and you can cancel while it runs.
</Note>

## Check what's coming in

Next you see your artwork on the left and its layers on the right. Nothing has been created yet, so take a moment here.

<Frame caption="The review step. Your artwork on the left, every layer on the right.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-review.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=6139c667c500f8eb634adae2a4b6baec" alt="The review step of the PSD import, showing a pet portrait canvas preview on the left and on the right a template name field, size and DPI badges, and a list of layers with checkboxes." width="2016" height="1436" data-path="images/templates/import-psd-review.png" />
</Frame>

### The name and the size

The **Template name** starts as your file name. Change it to whatever you want to see in your template list.

The two grey chips under it are the size and the print quality, both taken straight from your file. There is nothing to set: if you drew at 2400 × 3000 at 300 DPI, that's what you get.

### Tick only what you want to keep

Every layer has a tick box. Untick the ones that are only there to help you design: guide layers, notes to yourself, the scribble you parked off to one side.

Customei already unticks the obvious ones for you and says why underneath the layer name:

| What you see                 | What it means                                    |
| ---------------------------- | ------------------------------------------------ |
| **Hidden in Photoshop**      | The layer was switched off when you saved.       |
| **Looks like a guide layer** | The name looks like a guide or a note.           |
| **No visible pixels**        | The layer is empty.                              |
| **Outside the canvas**       | The layer sits off to the side of your artboard. |
| **Too small to be artwork**  | A few pixels, nothing you'd print.               |

The counter at the top (`10/11 layers`) tells you how many are ticked.

### Groups: keep them or flatten them

Each group gets two controls of its own.

<Frame caption="Every group chooses: keep its layers separate, or flatten it into one picture.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-groups.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=3547ce3f1b533cef2fa3dee08c6c07b3" alt="The PSD import review list with the Keep 2 layers and Keep 3 layers dropdowns highlighted, each next to a New library picker." width="2016" height="1436" data-path="images/templates/import-psd-groups.png" />
</Frame>

**Keep N layers** brings each picture in as its own layer. This is what you want for a group of alternatives, like *Pet photo* holding a dog, a cat and a rabbit. Your customer will be able to pick one.

**Merge into 1 image** flattens the whole group into a single picture. Use it for artwork that is only ever one thing, like a background made of twenty little pieces.

<Warning>
  Flattening turns everything inside into pixels, including any words. If there is text in a group you flatten, Customei tells you so and you can switch that group back to keeping its layers to keep the text editable.
</Warning>

The picker next to it says **where the pictures go**. Every group's pictures are saved together in one folder of images, and each picture layer is joined to that folder. That's what lets you (or your customer) swap between them later. Leave it on **New library** and Customei names the folder after your template and the group, or choose a folder you already have.

Pictures that aren't in any group get their own row at the bottom of the list.

### Fonts

Customei looks up every font your file uses and tells you which ones it has.

<Frame caption="A font your account doesn't have. Pick a stand-in, or upload the real file.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-fonts.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=5a8f11f68d1380c6777bc246efd55847" alt="The Fonts section of the PSD import showing a badge reading 1 of 1 not available, the font name Brandon Grotesque marked Not in your fonts, and a Pick a font button." width="800" height="262" data-path="images/templates/import-psd-fonts.png" />
</Frame>

Your text comes in either way. If a font is missing, the words are still words you can edit, they just show in a different typeface until you deal with it. Click **Pick a font** to choose something you do have, or to upload the real font file.

### The notes at the bottom

Under the layer list you may see one or two short lines about what Photoshop features survive. In plain terms:

| Note                                                   | What to do                                                                                                                                     |
| ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------- |
| Shadow, glow, stroke and bevel effects are reproduced  | Nothing. They come through. On a picture layer they become part of the picture, so that layer measures slightly bigger than the artwork alone. |
| Something is listed as **not imported**                | Rasterise those layers in Photoshop and import again.                                                                                          |
| **Multiply** layers had their white background removed | Nothing. That's the result you wanted.                                                                                                         |
| A blend mode like Screen or Overlay is **lost**        | Merge that layer with whatever it was blending into, in Photoshop, then import again.                                                          |

## Import it

Click **Import layers**. Your pictures upload, and the template opens in the editor when it's done.

<Frame caption="The finished template. Photoshop groups became layer groups, and every layer has its number.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-result.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=150d9ebeaef6d26ced25f7fef6fa78cc" alt="The template editor showing the imported Pet Portrait Canvas with a layers panel listing Since 2019, Pet name, a Frame group containing Wide frame and Thin frame, a Pet photo group, and Background." width="3840" height="2400" data-path="images/templates/import-psd-result.png" />
</Frame>

Notice two things:

1. **Your text is still text.** Click *Pet name* and you can retype it, restyle it, and later let a customer fill it in.
2. **Every layer has a number** (`#9`, `#6`, `#2`). Those numbers are how you connect a customer's answer to a layer. See [Connect an option set to a template](/optionsets/connect-to-a-template).

The folders of pictures the import made are waiting in **Assets**, on the **Image** tab, named after your template.

<Frame caption="One folder per Photoshop group, named after your template.">
  <img src="https://mintcdn.com/nexlify/LJ3k58_0NSNYDLkG/images/templates/import-psd-libraries.png?fit=max&auto=format&n=LJ3k58_0NSNYDLkG&q=85&s=4300b8b44ef90f3eae77bd0994550e5c" alt="The Assets page on the Image tab, with the two newly created libraries Pet Portrait Canvas - Frame and Pet Portrait Canvas - Pet photo highlighted." width="3840" height="2400" data-path="images/templates/import-psd-libraries.png" />
</Frame>

<Tip>
  Add more pictures to one of those folders later and every template using it can offer them. That's the point of keeping groups as separate layers rather than flattening them. See [Options that keep themselves up to date](/optionsets/keep-options-up-to-date).
</Tip>

## Where to next

<CardGroup cols={2}>
  <Card title="Add a mockup preview" icon="clone" href="/editor/add-a-mockup">
    Show your artwork on a photo of the real product.
  </Card>

  <Card title="Build your options" icon="sliders" href="/optionsets/build-your-options">
    Write the questions your customers answer.
  </Card>

  <Card title="Connect answers to layers" icon="link" href="/optionsets/connect-to-a-template">
    Point each answer at a layer number.
  </Card>

  <Card title="Layers and arranging" icon="layer-group" href="/editor/layers-and-arranging">
    Rename, reorder, and renumber what came in.
  </Card>
</CardGroup>
