Skip to main content
Everything about how your artwork lands inside a design area is set by the asset object on a smart object entry, plus two optional siblings for colour and tone. The request that carries them is Render a PSD mockup.
Recommendation: author artwork at the area’s own size, which the upload response reports, and send only fit. Reach for size, position and rotate when the default placement is not where the design belongs.

Point the asset at your artwork

Give asset a url that is public, directly reachable and immutable: one URL, one image, for good. To change a design, publish it at a new URL and render with that. A URL reused for different content can return the earlier image. Google Drive is where this bites most often. Replace file and Manage versions keep the same link, so the link keeps resolving to the original design. Upload the new design as a new file, which gets its own link. See why a render shows old artwork. When artwork is generated on the fly and has no stable address, send the bytes instead. base64 carries the image with no data: prefix and content_type says how to read it, defaulting to image/png. Bytes take priority over a URL.

Fit, size and rotation

Six values on asset decide where the design sits once the render has it. fit keeps the whole design visible, crop covers the area and cuts the overflow, and fill stretches to the bounds. crop is the common choice for product mockups because it covers the area without distorting the design. The older contain and cover spellings are still accepted, and full detail is on Fit and blend modes. The upload response gives each area a size of its own, for example 3000 x 3413. Author artwork at those dimensions, render with the area’s uuid, and placement into the visible bounds is handled for you. Larger is fine, smaller costs quality. The position that same response reports is where the area sits on the canvas, or inside the parent smart object’s document for a nested area, for drawing a preview in a browser rather than for a render body. Set size and position on the asset only when the artwork belongs somewhere other than the area’s default placement. A size sent without a position is centred in the area, which is all a pattern needs when it can start anywhere. A position sent without a size moves the whole design area on the template, so send position together with size. A logo pinned to one corner and a pattern that starts at a known offset are the two cases that need both. rotate turns the artwork inside the area, and the perspective and warp the designer built stay where they are.

Repeat as a pattern

Set tile to true to repeat the design across the whole area, the way wallpaper, fabric and all over prints are sold. size is then one tile, fit places the artwork inside each tile, and position sets where the grid starts. The repeat follows the area’s perspective and warp like any artwork, and it continues across every copy of the area in the template.
A tile needs a size. Without one the request returns 422. A seamless pattern file with fit set to fill repeats with no visible joins. To know whether a file is seamless before you render it, send it to Check seams, with crop_aspect when fit is crop. Check and fix pattern seams covers the check and the repair. tile_spacing leaves a gap between the tiles. It is a percentage of the tile size, from 0 to 100. The horizontal gap is that percent of the tile width, and the vertical gap is that percent of the tile height. It is used only when tile is true. Leave it out, or send 0, and the tiles touch. The gap is transparent, so the template shows through between the tiles.
Each tile here is 600 by 400 pixels, so the gap is 150 pixels across and 100 pixels down. A value outside 0 to 100 returns 422. A video render built from a mockup takes the same tile and tile_spacing on each smart object’s asset, so a clip can open on a pattern. See Render a video mockup.

Colour and tone

Two optional siblings of asset sit on the same entry. color takes a hex value and a blending_mode, which gives you product colourways from a single artwork file. It accepts all 27 Photoshop layer blend modes, with an underscore or a space as the separator. multiply keeps the material texture readable under the colour, which is what makes a dark garment look printed rather than painted. adjustment_layers tunes the artwork itself. Send any subset, and every value you leave out stays at its default.

Learn more

Smart objects

Read what an area describes before you fill it.

Fit and blend modes

Choose how artwork meets the area and sits on the material.

Next steps

Render a PSD mockup

Send the request, with runnable examples in eight languages.

Render a PSD without Photoshop

Follow the two request path from template to image.