# How to export correctly from Blender to Three.js?

**URL:** <https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469>\
**Category:** Questions\
**Tags:** blender-gltf-model, textures\
**Created:** [June 29, 2024, 12:57pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469 "2024-06-29T12:57:00Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![iHast](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ihast/32/34649_2.png) [@iHast](https://discourse.threejs.org/u/iHast)\
**Post date:** [June 29, 2024, 12:57pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/1 "2024-06-29T12:57:00Z")

</div>

I’m creating an asset in Blender and I searched for information on how to correctly create textures for export to use in Three.js. Most of the content I found was from 2019.  
Can you help me with some hints about this?

- Are there any specific configurations I need to do?
- Should I use specific textures?
- Is there content I can follow to stay updated on changes that influence the relationship between Blender and Three.js?

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [June 29, 2024, 1:10pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/2 "2024-06-29T13:10:07Z")

</div>

Use the standard BSDF without any complex node setups.  
Depending on whether your optimizing for download time vs quality… you then export gltf, converting textures to webp for speed… and draco for compression… or export without compressions, and do the compression in a secondary pipeline. Best bet early in dev might be to just use larger assets and not worry about it, and count on the fact that you’ll probably be able to get ~10 reduction on them when it comes time to optimize.

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [June 29, 2024, 1:19pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/3 "2024-06-29T13:19:29Z")

</div>

> [@iHast](#):
>
> Are there any specific configurations I need to do?

The defaults in GLTF exporter are quite good for most cases - just keep in mind only the base material properties are supported, Blender node system is rarely compatible with exporters (there are also some fancy props supported, to find out specifically which, you can search “gltf” in [three.js examples](https://threejs.org/examples/?q=gltf#webgl_animation_keyframes).)

> [@iHast](#):
>
> Should I use specific textures?

1. In 99% of cases, you want to export as `.glb` (binary containing the textures, either this or GLTF with separate textures if your model will have swappable textures. Don’t use GLTF with embedded textures as it will encode the textures as base64 and increase the total size by ~30%.)
2. Use 1024x1024 or 2048x2048. Higher only when really justified - not due to GPU or any of that stuff, but downloading big image files takes a long time - it’s better to split a bit image into tiles or use progressive loading from SD to HD texture size.
3. If possible, run all models through [gltf-transform](https://github.com/donmccurdy/glTF-Transform). It reduces the size significantly.

> [@iHast](#):
>
> Is there content I can follow to stay updated on changes that influence the relationship between Blender and Three.js?

Follow [donrmccurdy](https://x.com/donrmccurdy) on twitter (and changelog of three ofc) 😌👌

---

<div class="post-metadata">

**Author:** ![iHast](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ihast/32/34649_2.png) [@iHast](https://discourse.threejs.org/u/iHast)\
**Post date:** [June 29, 2024, 7:58pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/4 "2024-06-29T19:58:24Z")

</div>

@manthrax and @mjurczyk  
Thank you so much for your answer!! I made some tests and everything works fine.

Have a nice weekend!! 🙏

---

<div class="post-metadata">

**Author:** ![donmccurdy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/donmccurdy/32/33209_2.png) [@donmccurdy](https://discourse.threejs.org/u/donmccurdy)\
**Post date:** [June 29, 2024, 8:15pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/5 "2024-06-29T20:15:21Z")

</div>

To add one thing — there’s a lot of detail in the Blender [glTF addon documentation](https://docs.blender.org/manual/en/latest/addons/import_export/scene_gltf2.html) explaining what it supports. Some Blender features, like [UV transforms](https://docs.blender.org/manual/en/latest/addons/import_export/scene_gltf2.html#uv-mapping), require particular care if you’re using them. In general, if you set things up in Blender correctly for export to glTF, then three.js should display the file correctly as well.

---

<div class="post-metadata">

**Author:** ![iHast](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/ihast/32/34649_2.png) [@iHast](https://discourse.threejs.org/u/iHast)\
**Post date:** [June 29, 2024, 9:02pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/6 "2024-06-29T21:02:28Z")

</div>

Thank you, @donmccurdy !  
I’ll study the docs!! 🙏 🙏

---

<div class="post-metadata">

**Author:** ![Confidant](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/confidant/32/44562_2.png) [@Confidant](https://discourse.threejs.org/u/Confidant)\
**Post date:** [March 30, 2026, 6:26pm UTC](https://discourse.threejs.org/t/how-to-export-correctly-from-blender-to-three-js/67469/7 "2026-03-30T18:26:40Z")

</div>

I came here with the same question. For the record, I found it useful to import a glTF that “works” into Blender. Blender translated the materials into something I could edit in the Shader editor, and modify according to my own purpose. This was especially useful when using a normal map and emissive material.