Polyfork BrowseKitsPricingBlog

Low-poly cloud

free remixable
drag to orbit · scroll to zoom
Open in the scene editor place it with other assets · no account needed to try

500 tris · 1 material · 12.89×12.27×11.93 m · GLB 54 KB

Steampunk Farm low-poly 3D kit Part of Steampunk Farm 48 matching parts, one palette and scale
Part hierarchy (toggle visibility)

Use it

The fastest path in three.js: one import, zero loaders. The module returns a ready THREE.Group with named parts.

import { createAsset } from 'https://polyfork.dev/cdn/towering-cloud-2e00f1.mjs';
scene.add(createAsset());

Downloaded it instead? Import './towering-cloud-2e00f1.mjs' and add the importmap below. The zip ships a working index.html with both already in place.

Full working example (a complete copy-paste HTML page)
<!doctype html>
<script type="importmap">
{ "imports": { "three": "https://unpkg.com/[email protected]/build/three.module.js",
               "three/addons/": "https://unpkg.com/[email protected]/examples/jsm/" } }
</script>
<script type="module">
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
import { createAsset } from 'https://polyfork.dev/cdn/towering-cloud-2e00f1.mjs';

const scene = new THREE.Scene();
scene.background = new THREE.Color(0xf3ecdc);
// Far plane at 5000: terrain blocks are 64 to 256m across and a 100m
// frustum slices them.
const camera = new THREE.PerspectiveCamera(45, innerWidth / innerHeight, 0.1, 5000);
camera.position.set(3, 2, 4);
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(innerWidth, innerHeight);
document.body.style.margin = 0;
document.body.appendChild(renderer.domElement);
scene.add(new THREE.HemisphereLight(0xffffff, 0x998877, 1.2));
const sun = new THREE.DirectionalLight(0xfff2e0, 2);
sun.position.set(4, 7, 5);
scene.add(sun);

scene.add(createAsset());
new OrbitControls(camera, renderer.domElement);
renderer.setAnimationLoop(() => renderer.render(scene, camera));
</script>

The standard route: load the GLB with GLTFLoader. The same file works in any glTF pipeline (Babylon.js, <model-viewer>, custom engines).

import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';

new GLTFLoader().load('https://polyfork.dev/cdn/towering-cloud-2e00f1.glb', (gltf) => {
  scene.add(gltf.scene); // real-world scale in meters, origin on the ground
});

Flat-shaded vertex colors on a single material: no textures to wire up, one draw call.

R3F takes any Object3D through <primitive>, and these modules return a ready THREE.Group synchronously. No useGLTF, no loader, no <Suspense>.

import { useMemo } from 'react';
import { Canvas } from '@react-three/fiber';
import { createAsset } from './towering-cloud-2e00f1.mjs';

function LowpolyCloud(props) {
  const obj = useMemo(() => createAsset(props), [JSON.stringify(props)]);
  return <primitive object={obj} />;
}

<Canvas camera={{ position: [3, 2, 4] }}>
  <hemisphereLight args={[0xffffff, 0x998877, 1.2]} />
  <directionalLight position={[4, 7, 5]} intensity={2} />
  <LowpolyCloud colorway="golden-hour" />
</Canvas>

Every knob is a prop. colorway="golden-hour" above is one of this model's own parameters, so the component rebuilds when it changes, exactly like any other React component. More on using these in R3F.

Open this model in StackBlitz A running R3F project with this model in it, no install.

Self-animating models, and one draw call

A model that animates itself exposes userData.tick(seconds). Drive it from R3F's own loop:

useFrame((state) => obj.userData.tick?.(state.clock.elapsedTime));

To merge a static set into a single draw call, import mergeAssets from https://polyfork.dev/cdn/merge.mjs and pass the merged group to one <primitive>.

  1. Download the .glb from this page.
  2. Unity: drag the file into Assets (glTFast or UnityGLTF import it). Godot: drop it into the project, it imports natively. Blender: File → Import → glTF 2.0.
  3. Place it as-is: real-world scale in meters, origin at ground level.
  4. Materials arrive as vertex colors on one material: no texture files, nothing to relink.

Using Claude Code, Cursor or another coding agent? This site is built for them: agent-readable docs at /llms.txt and a JSON API at /api. Paste this prompt:

Add the "Low-poly cloud" low-poly model from polyfork.dev
to my three.js scene. It is free and hotlinkable, nothing to download:

  ES module: https://polyfork.dev/cdn/towering-cloud-2e00f1.mjs
             (import { createAsset } - returns a THREE.Group, real-world scale)
  GLB:       https://polyfork.dev/cdn/towering-cloud-2e00f1.glb

Full metadata (size, palette, rigged parts): https://polyfork.dev/api/assets/towering-cloud-2e00f1
Site docs for agents: https://polyfork.dev/llms.txt

Every asset in this catalog shares one identical vertex-colored material, with no textures at all. That means whole scenes collapse into a single draw call: the same result Synty-style packs get from a texture atlas, without the atlas.

import { mergeAssets } from 'https://polyfork.dev/cdn/merge.mjs';

// position your assets first, then:
const { merged, dynamic } = mergeAssets([
  terrain, tree, rock,
  asset,
]);
scene.add(merged);                  // ONE draw call, static
dynamic.forEach(d => scene.add(d)); // rigged parts, still movable

Placing many copies of one model? Use THREE.InstancedMesh instead: one draw call and even less memory. The landing page's forest demo ends with exactly this merge.

Share it

A live, orbitable copy of this model on your own page: no build step, no three.js on your side, one iframe.

<iframe src="https://polyfork.dev/embed/towering-cloud-2e00f1"
        width="480" height="360" loading="lazy"
        style="border:0;border-radius:12px"
        title="Low-poly cloud, low-poly 3D model"></iframe>

<p><a href="https://polyfork.dev/asset/towering-cloud-2e00f1">Low-poly cloud</a>
   by <a href="https://polyfork.dev">Polyfork</a></p>

Open the frame

Used the file rather than the frame? Attribution is not required and never will be. If you want to credit it anyway:

<a href="https://polyfork.dev/asset/towering-cloud-2e00f1">Low-poly cloud</a> by <a href="https://polyfork.dev">Polyfork</a>

Low-poly cloudFree

Hotlink or download it. The copy-paste snippet just works.

A simple low-poly cloud for the Steampunk Farm sky, as a prop. The first build of this was far too complicated and it is the thing to get right: five to nine big rounded lobes merged into one soft mass. Part of the Steampunk Farm kit.

  • 500 triangles · 1 material
  • 12.89 × 12.27 × 11.93 m, real-world scale
  • GLB (54 KB) + drop-in ES module
  • Commercial license: games, apps, client work, anything. No attribution required. (No reselling the raw assets, and no building a commercial asset generator from them.)
Other engines: FBX USDZ OBJ

Materials, not vertex colours: the palette comes across as named materials you can retint, and they carry this model's own knob names.

The zip holds the ES module, the GLB and a ready index.html: serve the folder and it renders.
Free: create a free account to download. Hotlinking from the CDN needs no account.

Related assets

Lighter-than-air tender low-poly 3D model
Lighter-than-air tender
2,330 tris
Meadow tile low-poly 3D model
Meadow tile
604 tris
Fruit tree low-poly 3D model
Fruit tree
742 tris
Free Steam plume low-poly 3D model
Steam plume
546 tris
Rolled plate silo low-poly 3D model
Rolled plate silo
1,479 tris
Arch gatehouse low-poly 3D model
Arch gatehouse
1,733 tris

One of 265 free 3D models for three.js, every one hotlinkable from the CDN with no account.

Polyfork

Sign in

One account for your purchases and downloads.

Continue with Google
or

No password needed: the link signs you in directly.