Render API
Returns an image URL of the selected mockup template and provided design asset.
The request must accept JSON responses.
API key required for authentication.
YOUR_API_KEY_HERE
The UUID of the mockup template.
754a46c5-7693-43a1-9cd4-aedabd273f57
A label for the exported image.
MY_FIRST_IMAGE_01
List of smart objects inside a chosen mockup.
List of text layers for the chosen mockup.
Export OpenAPI specification for Render API
export_label
When defining this optional parameter in your request, the same value will be returned in the response.
This parameter is used to help recognize the request you sent with the label.
export_options.image_format
By default, we return a .png rendered image.
But sometimes, for example, you want to get a more optimized image for the web.
By providing some of the following values: jpg, png, webp
you can control what image format you want from our API.
export_options.image_size
Same as image_format, you can tell our API if you need an image of a specific size.
We will return high image resolution, but sometimes you need smaller ones.
Provide export_options.image_size = 720
to get the image with 720px width.
The provided value will define image width and height will auto-scale.
smart_objects.asset.url
The provided URL image will be rendered inside a chosen smart object UUID.
The image must be one of the following extensions: jpg, jpeg, png, webp, gif
Make sure that the provided URL is publicly available since our API needs to download it and use it for render purposes.
This is especially important when providing links from Dropbox, Google Drive, and similar tools, make sure you provide the right URL with public permissions.
If not available or does not have permission to download, the API call will result in an error.
smart_objects.asset.file
In some cases, you will want to send the binary file instead of the URL.
To send the binary file, include it as part of the smart_objects.asset
object, using the file
property instead of url
. Ensure that the file is sent using FormData
.
When sending a binary file in an API request, you must use FormData
instead of sending the file as part of a JSON payload. This is because binary files cannot be directly represented in JSON format.
The image must be one of the following extensions: jpg, jpeg, png, webp, gif
smart_objects.color
This optional field will paint the whole smart object with the provided color value.
You can provide two different value types:
hexadecimal value, example: #AA411B
or color names from this link

Left image without color - Right image with color
smart_objects.asset.fit
In our web application editor, you can turn on Print Area and place the asset position and size. Each of your uploaded assets using Render API will inherit this setting.

You can optionally change print area fit mode by selecting one of these: stretch, contain, cover
If you do not provide fit mode using Render API, we will inherit your setup in the web application and the asset will be used in the selected fit mode, size, and position.
smart_objects.asset.position
You can optionally change the position of your asset using Render API.
Set position.top
and position.left
to tweak your asset position if necessary.
If you do not provide a position using Render API, we will inherit your setup from the editor in the web application.
We highly recommend placing the print area in the web application editor. In that case, any assets provided to Render API will be automatically placed inside that print area box without providing any position values.
smart_objects.asset.size
You can optionally change the size of your asset using API.
Set size.width
and size.height
to tweak your asset size if necessary.
Same as the asset.position, asset.size will be inherited from the editor in the web application if not provided.
This way, we allow you to visually set your asset position and size in our web application editor so you don't have to provide any asset positions and sizes using Render API.
smart_objects.print_area_preset_uuid
You can optionally provide print_area_preset_uuid
inside each smart object to automatically position the provided asset without explicitly setting any position, fit, rotate, or size.
Inside our web application editor, you can easily create new print area presets, which will automatically appear inside our Get Mockups API where you can get print_area_presets
details for each mockup and smart object.
To create new print area presets, upload the design asset and set the print area you want. You can create any amount of print area presets.
smart_objects.blending_mode
You can optionally apply blending_mode
to the smart object.
Supported blending mode list:


smart_objects.adjustment_layers
You can optionally apply adjustment_layers
to the smart object.
Supported adjustment layer list:
contrast
-100
100
0
brightness
-150
150
0
opacity
0
100
100
saturation
-100
100
0
vibrance
-100
100
0
Adjustment layers will be reflected in the Render API(just like Asset position does).
We will inherit your setup from the web application's editor if you do not explicitly provide adjustment_layers using the Render API.
Set the Adjustments in the web application's editor to change the default values.

[Beta] Text Layers
In some cases, your custom psd files will contain text layers and you will want to provide the text to get the output.
Our text layer feature is in [Beta] stage at the moment. Feel free to contact our support if you face any issues in implementation.
At the moment, at least one smart object needs to be provided in addition to text layers to work. You don't need to provide any image to the smart object if you don't want to, so it can stay invisible.
text_layers.uuid
If you upload the PSD files that contain text layers, text layers will be visible on our Get Mockups API besides smart objects.
Use this UUID
field to refer to the text layer you want to put the text on.
text_layers.text
Provide text that will be applied to the text layer and output on the rendered image.
text_layers.font_family
Default font used is Roboto
, if you want, provide a custom font family.
List of available fonts: Helvetica, Arial, Times New Roman, Futura, Garamond, Bebas Neue, Roboto, Lato, Montserrat, Open Sans, Raleway, Playfair Display, Avenir, Century Gothic, Georgia, Proxima Nova, Teko, Impact, Poppins, Merriweather
text_layers.font_size
Default font size from the PSD file will be applied.
Provide font_size
to modify the default font size of the text layer.
text_layers.font_color
Default font color from the PSD file will be applied.
Provide font_color
in the hex color code to change the color of the text.
Last updated
Was this helpful?