# How to make an isometric tile set

**URL:** <https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723>\
**Category:** Questions\
**Created:** [January 31, 2019, 10:02pm UTC](https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723 "2019-01-31T22:02:36Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Ben](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.mapeditor.org/ben/32/2184_2.png) [@Ben](https://discourse.mapeditor.org/u/Ben)\
**Post date:** [January 31, 2019, 10:02pm UTC](https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723/1 "2019-01-31T22:02:36Z")

</div>

Hello, I have an image that needs to be sliced. but when i set the tile set to isometric it doesnt change the grid.  
 ![PNG](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/mapeditor/original/2X/4/4861e44d6d89dd81fec3105a13fd80b7799c8c1f.jpeg)

---

<div class="post-metadata">

**Author:** ![eishiya](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.mapeditor.org/eishiya/32/2534_2.png) [@eishiya](https://discourse.mapeditor.org/u/eishiya)\
**Post date:** [January 31, 2019, 10:11pm UTC](https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723/2 "2019-01-31T22:11:23Z")

</div>

To be rendered correctly, your tileset images have to have a rectangular bounding area for each tile. Then, within that bounding rectangle, you have your tile’s base. Your tileset is not set up correctly, there’s no way for Tiled (or even most game engines) to use it correctly. The tiles are arranged on an isometric grid, but they’re still drawn as rectangles, as that’s how 2D computer graphics typically work, and because that method allows for isometric tiles with height.

Here’s an example of a correctly set-up isometric tileset:  
 ![image](https://cdck-file-uploads-canada1.s3.dualstack.ca-central-1.amazonaws.com/flex035/uploads/mapeditor/original/2X/9/93596f42fa162e7dc789577ec591638d9c3dc27d.png)  
(Image source: [https://opengameart.org/content/isometric-64x64-medieval-building-tileset](https://opengameart.org/content/isometric-64x64-medieval-building-tileset))  
Notice how the tiles are arranged in a way that you can split this image up into a grid of rectangles, each one containing one tile. In this specific case, the tiles have height, but that’s optional.

---

<div class="post-metadata">

**Author:** ![bjorn](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.mapeditor.org/bjorn/32/1599_2.png) [@bjorn](https://discourse.mapeditor.org/u/bjorn)\
**Post date:** [January 31, 2019, 10:32pm UTC](https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723/3 "2019-01-31T22:32:06Z")

</div>

> [@Ben](#):
>
> Hello, I have an image that needs to be sliced. but when i set the tile set to isometric it doesnt change the grid.

The Isometric Orientation option for tilesets only exists to help additional tools like Terrain, Wang Tiles and the Tile Collision Editor to visualize their information better on the tile. As you noticed, it does not affect the way the tiles are cut from the image.

But actually, for tiles like you have there, it would make a lot of sense to add isometric tile cutting and it’s something I’ve been wanting to add to Tiled. It makes sense for reducing texture size and can also reduce the load on fill rate (though not in Tiled itself, since it draws tiles as rectangles). Finally it can be helpful for the artist to be able to simply render tiles next to each other that should connect. It has been [discussed before](https://discourse.mapeditor.org/t/how-to-create-a-mapset-for-tiled-in-photoshop/1653) and there is the following related issue about this:

> <https://github.com/mapeditor/tiled/issues/1563>
>
> I have hexagonal tileset images that look like this:
> !\[screenshot 2017-05-07 13… 18 18\](https://cloud.githubusercontent.com/assets/13225817/25785077/cee89f38-332c-11e7-8446-222355a9ae30.png)
> 
> Tiled can import an image file to create a tileset, but it can only interpret the image as an orthogonal tileset. Please add support for dividing the imported image into hexagonal tiles. Incomplete hexes around the edges can be ignored.
> 
> The "New Tileset" dialog would also need fields for specifying the extra parameters for hexagonal tilesets, like stagger axis and stagger index.

---

<div class="post-metadata">

**Author:** ![Ben](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.mapeditor.org/ben/32/2184_2.png) [@Ben](https://discourse.mapeditor.org/u/Ben)\
**Post date:** [February 2, 2019, 3:38am UTC](https://discourse.mapeditor.org/t/how-to-make-an-isometric-tile-set/3723/4 "2019-02-02T03:38:16Z")

</div>

Well, crap. Thank you for the help anyways.
