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

# How to create a clickable mask

> Draw or import a shape, then enable Clickable Mask so it becomes an image placeholder customers fill with their own photos.

A clickable mask is an image placeholder that is mainly used in products such as photo prints, canvas prints and promotional items to name a few.

To make use of this feature please follow the steps below:

Go to the [designs](https://admin.pitchprint.com/designs) page open an existing design OR create a new one.

For the shape you can either draw your own or import some of our readily available shapes:

To draw click on the button shown below:

<Frame>
  <img src="https://s3.amazonaws.com/helpscout.net/docs/assets/58f1ec6d2c7d3a52b42f8254/images/6538a7075929497d15ca11f5/file-dDADTmHIHT.png" alt="Drawing button in the design editor toolbar" />
</Frame>

When you click on the button a menu will open up as depicted below:

<Frame>
  <img src="https://s3.amazonaws.com/helpscout.net/docs/assets/58f1ec6d2c7d3a52b42f8254/images/6538a7465d28e52158f5213e/file-Yylt6bjLv7.png" alt="Drawing menu open, with the mouse click icon used to exit drawing mode" />
</Frame>

Draw your desired shape and click on the ***mouse click icon*** to exit drawing mode.

To import shapes go to the [pictures](https://admin.pitchprint.com/pictures) tab. Create a new category or open an existing one. Click on import. Select ***Plain Shapes Great for masking*** from the drop down list select the item(s) you need and click import as shown below:

<Frame>
  <img src="https://s3.amazonaws.com/helpscout.net/docs/assets/58f1ec6d2c7d3a52b42f8254/images/6538a790d8bb8c0afe6e1446/file-QSEjUeWxSn.png" alt="Import dialog with Plain Shapes Great for masking selected and shapes ready to import" />
</Frame>

Once you have your shape(s). Add the shape(s) to the canvas. Click on the shape. Go to the item menu and enable ***Clickable Mask*** as shown below:

<Frame>
  <img src="https://s3.amazonaws.com/helpscout.net/docs/assets/58f1ec6d2c7d3a52b42f8254/images/650afa599446233b9352802b/file-EosphRVy4W.png" alt="Item menu for the selected shape with Clickable Mask enabled" />
</Frame>

Once complete your shape will now become an image placeholder which your customers can use to insert their images.

<Warning>
  Please note the clickable mask can only house raster(png, tiff, jpg etc.) images, vector images will not work inside your clickable mask.
</Warning>

## Related articles

<CardGroup cols={2}>
  <Card title="How to Add a Placeholder image for Mask Shapes" icon="image" href="/docs/documentation/how-to-add-a-placeholder-image-for-mask-shapes">
    Set a guide image that prompts clients to click a mask shape.
  </Card>

  <Card title="Custom Mask" icon="scissors" href="/docs/tutorial/custom-mask">
    Use any shape as a clipping area to trim content in the final PDF.
  </Card>

  <Card title="How to create an SVG for use as a Mask" icon="vector-square" href="/docs/tutorial/how-to-create-an-svg-for-use-as-mask">
    Prepare a single-path SVG that can be used as a photo mask.
  </Card>

  <Card title="How to create templates using SVG shapes" icon="shapes" href="/docs/tutorial/how-to-create-templates-using-svg-shapes">
    Build a design template from an SVG shape, such as a phone case.
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.