# Image Templates: Fill Layers with Avatars, Monsters & Art by Layer Name

> Name a layer after an image template and Contently fills it with a picture from that set; pin one picture with :N or tint it with [#hex] and [blend=…].

## Goal

Fill image layers from a template set, such as avatars or museum art, by naming them, and style the result without leaving the layer name.

## Before you start

- A frame with layers to fill (rectangles, ellipses, frames or images). Text layers are skipped.
- The Contently plugin open.

## Steps

1. **Open the image templates** Click the Images, Icons & Templates button in the sidebar (the grid icon) and choose the Images chip. The list shows the image templates, for example Avatar Realistic, Avatars, Boring Avatars, DiceBear Avatars, Monsters, SoftMonsters and The Met: public-domain highlights.
   ![The Templates view filtered to Images: Avatar Realistic, Boring Avatars, DiceBear, Monsters, SoftMonsters and The Met.](https://raiken.io/assets/kb/contently/image-templates-by-layer-name/image-template-list.png)
2. **Name the layers after a template** Rename each layer to the template's name in lowercase with hyphens, for example avatar-realistic or boring-avatars. Start the name with image:: to be explicit (image::avatar-realistic).
3. **Apply the templates** Select the frame and click Apply Matching Templates (its label changes to the last action you ran, and its arrow lists the others). Every visible layer named after an image template gets a picture from that set, in random order by default.
4. **Pin one picture** Add a colon and a number to always get the same picture: image::avatar-realistic:2 picks the second picture of the set. The number starts at 1.
5. **Tint the picture from the layer name** Add a bracket block after the name: [#37cdf3] puts a colour overlay above the image, [style=Name] uses a paint style, [var=Name] a colour variable, and blend=overlay (or color, multiply and the other Figma blend modes) sets how the overlay mixes in. Hex and blend can share one block: avatar-realistic [#9364f4 blend=overlay].
6. **Try it on an example card** Click the button on the Image Templates header (tooltip: Place an example on the canvas) to put an example card in Figma. Select the card and the button turns solid with a circular-arrow icon (tooltip: Run Apply All demo on this card); it fills the card for you.

## Tips

- One layer name can combine a pick and a tint: image::avatar-realistic:2 [#37cdf3].
- Name matching also works inside longer layer names, so a layer called avatar-realistic card still matches.

## Result

Each named layer shows a picture from its template set, with the same layers pinned or tinted exactly as their names say.

## If something goes wrong

- **A layer stays unchanged after Apply Matching Templates.** -> Check that the layer is visible and is not a text layer, and that its name contains the template's name (avatar-realistic, boring-avatars) or starts with image::.
- **The overlay colour is missing.** -> Put the bracket block last in the layer name, with a valid hex such as [#37cdf3]. For a style or variable, spell its name exactly as it appears in Figma.

## Common questions

### Can I use my own images as a template?

Yes. Create an image template from the + Template menu (see Content & Icon Templates); layers named after it behave the same way.

## Related guides

- [Text, Image & Icon Templates (Material Symbols)](https://raiken.io/kb/contently/content-and-icon-templates): Create reusable text and image templates, browse Google Material Symbols with outline and filled styles, and control template application sequences.
- [Smart Templates: Automatic Layer Matching](https://raiken.io/kb/contently/smart-templates-overview): Smart Templates automatically match template data to the right layers based on layer names, letting you populate entire mockups and nested components in one click.
- [Layer Name Modifiers, Placeholders & Image Utilities](https://raiken.io/kb/contently/layer-modifiers-and-syntax): Master layer name modifier syntax (:numbers, :upper, :1), inline template placeholders ({TemplateName}), and high-performance image compression.

---

Source: https://raiken.io/kb/contently/image-templates-by-layer-name (Contently help centre). Reviewed: 2026-10-30.