Finding and Using Game Assets in Three.js

Free 3D Model Sources

Kenney.nl is the most reliable source of free game assets on the internet. Kenney publishes thousands of 3D models, 2D sprites, textures, and audio files under the CC0 license, meaning you can use them in any project, commercial or otherwise, without attribution. The models are designed for games: low polygon counts, consistent art styles, and available in glTF format. For prototyping or indie games with a clean, colorful aesthetic, Kenney assets are an excellent starting point.

Quaternius publishes free low-poly 3D model packs for games, covering characters, animals, buildings, vehicles, nature, and furniture. The models are available in multiple formats including glTF and FBX, and many include basic animations. The consistent art style across packs makes it easy to assemble a cohesive game world from multiple Quaternius collections.

Sketchfab hosts millions of 3D models, many available for free download under Creative Commons licenses. The platform includes a WebGL previewer so you can inspect models before downloading. Filter by license type to find models you can use commercially, and always check the specific license terms. Sketchfab models vary widely in quality, polygon count, and format, so budget time for cleanup and optimization.

The Khronos Group maintains a repository of glTF sample models that are useful for testing and learning. These include standard test scenes, material demonstrations, and animation examples. While not game assets per se, they are invaluable for verifying that your asset pipeline handles glTF features correctly.

Poly Pizza, Open Game Art, and itch.io's asset marketplace are additional sources of free and low-cost game assets. Each has a different focus: Poly Pizza specializes in low-poly models, Open Game Art is community-driven with variable quality, and itch.io offers both free and paid packs from independent artists.

Commercial Asset Sources

For production games that need professional-quality assets, commercial marketplaces provide higher quality and more consistent art direction. Sketchfab's store section offers premium models with guaranteed quality, clean topology, and proper PBR materials. TurboSquid, CGTrader, and Fab (formerly the Unreal Marketplace, now platform-agnostic) are established marketplaces with thousands of game-ready 3D models.

When purchasing commercial assets, verify the license allows use in web games. Some licenses restrict distribution in certain formats, and serving assets via a public web server is technically distribution. Most game licenses allow this, but read the terms carefully. Assets purchased from one marketplace cannot be resold or redistributed on their own, even as part of a game, if the user can extract them, so consider how your game serves and protects its assets.

Hiring a freelance 3D artist through platforms like Fiverr, ArtStation, or dedicated game art studios produces custom assets that match your exact art direction. This is the most expensive option but the only one that guarantees visual consistency across all game assets. For a game's main character or key environment pieces, custom art often justifies its cost through stronger visual identity.

Textures and Materials

Textures define surface detail that geometry alone cannot provide. A flat wall mesh becomes a brick wall with the right set of textures: a base color (albedo) map for the brick pattern, a normal map for surface relief that catches light, a roughness map controlling how shiny or matte each area is, and an ambient occlusion map that darkens crevices between bricks.

Poly Haven (formerly HDRI Haven, Texture Haven, and 3D Model Haven) provides free, high-quality PBR texture sets, HDRI environment maps, and 3D models under CC0 license. The texture sets include all the maps needed for Three.js's MeshStandardMaterial: base color, normal, roughness, displacement, and ambient occlusion. Resolution options from 1K to 8K let you choose the right size for your performance budget.

AmbientCG offers a similar collection of free PBR materials with a focus on architectural surfaces (wood, metal, concrete, fabric). Both Poly Haven and AmbientCG provide their textures in PNG and JPG format, which you can convert to KTX2 with Basis Universal compression for optimal web delivery using the gltf-transform or basisu command-line tools.

Audio Assets

Game audio includes sound effects (footsteps, gunshots, UI clicks, environmental ambiance) and music. Freesound.org is the largest repository of Creative Commons sound effects, with hundreds of thousands of recordings. Licenses vary per file (CC0, CC-BY, CC-BY-NC), so check each sound's license. Kenney.nl also provides free audio packs with game-ready sound effects in WAV and OGG formats.

For music, Incompetech (Kevin MacLeod's royalty-free music library), Free Music Archive, and Musopen (classical music recordings in the public domain) provide free options. Commercial music licensing through services like Artlist, Epidemic Sound, or Soundstripe provides higher quality and more variety for a subscription fee.

Three.js's audio system uses the Web Audio API and supports OGG, MP3, and WAV formats. OGG provides the best quality-to-size ratio and is supported in all modern browsers. Convert audio files to OGG Vorbis at appropriate quality levels: 128-192kbps for music, 96-128kbps for sound effects. Keep audio files small, as they add to initial download time and must be decoded before playback.

Preparing Assets for Three.js

Raw assets from marketplaces and 3D software need preparation before they work well in a browser game. The preparation pipeline converts formats, reduces file sizes, and optimizes for real-time rendering performance.

For 3D models, the standard pipeline is: export from the 3D tool (Blender, Maya, 3ds Max) to glTF/GLB format, then process with gltf-transform to apply Draco geometry compression and KTX2 texture compression. If the model has too many polygons for your target hardware, apply mesh simplification with gltf-transform's simplify command or Blender's Decimate modifier before export.

Texture preparation involves resizing to appropriate dimensions (power-of-two sizes like 512, 1024, or 2048 pixels are preferred for GPU efficiency), converting to KTX2 format for compressed GPU delivery, and creating mipmaps (progressively smaller versions that the GPU uses for distant surfaces). Three.js generates mipmaps automatically for standard textures, but KTX2 files should include pre-generated mipmaps for best quality.

Build an asset manifest that lists all files, their paths, file sizes, and loading priorities. Load critical assets (player model, main environment, UI textures) before gameplay starts, and stream secondary assets (distant scenery, ambient audio, particle textures) after the game is running. Three.js's LoadingManager tracks loading progress across all loaders, which you can use to display a loading screen with a progress bar.

Asset Organization in a Three.js Project

Organize assets by type and purpose in your project directory. A common structure uses top-level directories for models, textures, audio, and fonts, with subdirectories for each game area or feature. Keep source files (Blender files, high-resolution textures, uncompressed audio) in a separate directory that is not served to the browser. Only the optimized, web-ready versions should be in the public or dist directory.

Version your asset pipeline configuration (compression settings, simplification ratios, texture sizes) alongside your code so that assets can be rebuilt consistently. A build script that processes raw assets into web-ready format ensures that every team member produces identical results and that the pipeline can be automated in CI/CD.