# Merge spritesheets into one image

**URL:** <https://phaser.discourse.group/t/merge-spritesheets-into-one-image/9172>\
**Category:** Phaser 3\
**Created:** [March 25, 2021, 9:32pm UTC](https://phaser.discourse.group/t/merge-spritesheets-into-one-image/9172 "2021-03-25T21:32:58Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Sieghart](https://avatars.discourse-cdn.com/v4/letter/s/e79b87/32.png) [@Sieghart](https://phaser.discourse.group/u/Sieghart)\
**Post date:** [March 25, 2021, 9:32pm UTC](https://phaser.discourse.group/t/merge-spritesheets-into-one-image/9172/1 "2021-03-25T21:32:58Z")

</div>

Hi, i dont know if this can be done with render texture or something other but how can i merge multiple spritesheets into one using phaser. I have for example player body, hair, clothes, accessories… if i render all images for each player and npc i will probably face with performance problem at the somne time.  
Without phaser before i was on player/npc creation/change in separated canvas draw whole images together and save in dir like temp files for later use so i can draw only one image and not 10 for each update or using node back process to merge images from folder, depends on project.

But how can i do that with phaser, im new and im sure that it probably have some build in function for that but i cant find it yet.

Example of images that i want to merge in order to make npc variations and player equips

![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/8/876152496cab9741cd0c21f754674a26ce986c74.png) ![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/3/3671ef2b321efab72ba8a24021e8157f6d6cbd7c.png) ![image|133x173] ![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/e/e988aae7a8ed706efc25baec3109b54c39a78d6c.png)

![image](https://global.discourse-cdn.com/free1/uploads/phaser1/original/2X/2/2d7ea4783c19f2e7f9aa41f8d7c8a2fdb6bf65db.png)

---

<div class="post-metadata">

**Author:** ![samme](https://yyz2.discourse-cdn.com/free1/user_avatar/phaser.discourse.group/samme/32/5275_2.png) [@samme](https://phaser.discourse.group/u/samme)\
**Post date:** [March 26, 2021, 2:34pm UTC](https://phaser.discourse.group/t/merge-spritesheets-into-one-image/9172/2 "2021-03-26T14:34:52Z")

</div>

Something like

```javascript
const rt = this.make.renderTexture({ width: 131, 187 });
const texture = rt.save('player');

texture.add('down1', 0, x, y, width, height);
texture.add('down2', 0, x, y, width, height);
// etc.

```

---

<div class="post-metadata">

**Author:** ![Sieghart](https://avatars.discourse-cdn.com/v4/letter/s/e79b87/32.png) [@Sieghart](https://phaser.discourse.group/u/Sieghart)\
**Post date:** [March 26, 2021, 6:46pm UTC](https://phaser.discourse.group/t/merge-spritesheets-into-one-image/9172/3 "2021-03-26T18:46:32Z")

</div>

Thank you! That is also what i was tried but somehow it was way to simple and easy so i thought probably is something wrong xD
