# Wooden Ladder

> A rustic wooden ladder with slightly tapering side rails, round pegged rungs and rope lashings at the top. Lean it against a wall (it tilts back toward -Z so the top touches the wall plane) or stand it up as a free-standing A-frame step ladder with flat steps, rear legs and rope spreaders. Set the top height and rung count for barns, lofts, scaffolds, ships and platformer levels.

![Wooden Ladder preview](https://codels.download/m/ladder.png)

Multi-view sheet (3/4, front, side, top): https://codels.download/m/ladder.sheet.png

## Facts

- Category: Buildings › Structures
- Size (W × H × D): 0.56 × 3.01 × 0.90 m — units are meters, +Y up, front faces +Z
- Origin: center of the base (y = 0)
- Triangles: 288 · Meshes: 13 · Materials: 3
- License: CC0-1.0 (Codels built-in)
- Tags: ladder, low-poly, stylized, construction, fantasy, farm, medieval, village, adventure, platformer, rpg, survival, interactable, platform, prop, wood, tall, mobile-friendly, parametric, color-brown, color-orange, size-large, poly-ultra-low
- Page: https://codels.download/models/ladder

## Files

| Format | URL |
|---|---|
| three.js ES module (`createLadder()`) | https://codels.download/m/ladder.js |
| React Three Fiber component (`<Ladder />`) | https://codels.download/m/ladder.jsx |
| Instancing module (`createLadderInstances(count, place)`, one draw call per material) | https://codels.download/m/ladder.instanced.js |
| Standalone HTML demo | https://codels.download/m/ladder.html |
| glTF binary | https://codels.download/m/ladder.glb |
| glTF binary, Meshopt-compressed (2–3× smaller; GLTFLoader needs `setMeshoptDecoder(MeshoptDecoder)`) | https://codels.download/m/ladder.glb?compress=meshopt |
| glTF JSON | https://codels.download/m/ladder.gltf |
| OBJ (vertex colors) + MTL | https://codels.download/m/ladder.obj · https://codels.download/m/ladder.mtl |
| STL | https://codels.download/m/ladder.stl |
| CodelSpec JSON | https://codels.download/m/ladder.json |

## Parameters

Append them as query parameters to any URL above to get a customized variant (e.g. `?mode=...`).

| Param | Type | Range / options | Default | Current |
|---|---|---|---|---|
| `mode` | select | leaning \| standalone | leaning | leaning |
| `height` | number | 1.5 – 6 | 3 | 3 |
| `rungs` | int | 3 – 20 | 9 | 9 |
| `color` | color | #rrggbb | #a7763f | #a7763f |

## Parts

- rail (box · rail)
- lashing (cylinder · rope)
- rail (box · rail)
- lashing (cylinder · rope)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)
- rung (cylinder · rung)

## How to use

Save the code below as `ladder.js`, then:

```js
import { createLadder } from './ladder.js';
const model = createLadder();
scene.add(model);
```

## Code

```js
/**
 * Wooden Ladder — Codels 3D model library (https://codels.download/models/ladder)
 * License: CC0-1.0 · Units: meters · Y-up · Front: +Z · Origin: center of the base (y = 0)
 * Triangles: 288 · Size (W × H × D): 0.56 × 3.01 × 0.90 m
 *
 * Usage:
 *   import { createLadder } from './ladder.js';
 *   
 *   const model = createLadder();
 *   model.position.set(0, 0, 0);
 *   scene.add(model);
 */
import * as THREE from 'three';

const deg = THREE.MathUtils.degToRad;

export function createLadder() {
  const root = new THREE.Group();
  root.name = 'Ladder';

  // Materials
  const railMat = new THREE.MeshStandardMaterial({ name: 'rail', color: 0xa7763f, roughness: 0.9, flatShading: true });
  const rungMat = new THREE.MeshStandardMaterial({ name: 'rung', color: 0x896134, roughness: 0.9, flatShading: true });
  const ropeMat = new THREE.MeshStandardMaterial({ name: 'rope', color: 0xcdb88a, roughness: 1, flatShading: true });

  // Shared geometries
  const boxGeo = new THREE.BoxGeometry(0.06, 3.0945, 0.095);
  const cylinderGeo = new THREE.CylinderGeometry(0.058, 0.058, 0.08, 6);

  // Parts
  const rail = new THREE.Mesh(boxGeo, railMat);
  rail.name = 'rail';
  rail.position.set(-0.23, 1.506, 0);
  rail.rotation.set(deg(-15.0549), deg(0.1992), deg(-0.7406));
  root.add(rail);
  const lashing = new THREE.Mesh(cylinderGeo, ropeMat);
  lashing.name = 'lashing';
  lashing.position.set(-0.2116, 2.8805, -0.3698);
  lashing.rotation.set(deg(-15), 0, 0);
  root.add(lashing);
  const rail2 = new THREE.Mesh(boxGeo, railMat);
  rail2.name = 'rail';
  rail2.position.set(0.23, 1.506, 0);
  rail2.rotation.set(deg(-15.0549), deg(-0.1992), deg(0.7406));
  root.add(rail2);
  const lashing2 = new THREE.Mesh(cylinderGeo, ropeMat);
  lashing2.name = 'lashing';
  lashing2.position.set(0.2116, 2.8805, -0.3698);
  lashing2.rotation.set(deg(-15), 0, 0);
  root.add(lashing2);
  const rung = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5521, 6), rungMat);
  rung.name = 'rung';
  rung.position.set(0, 0.3108, 0.3215);
  rung.rotation.set(0, 0, deg(-88.7494));
  root.add(rung);
  const rung2 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.544, 6), rungMat);
  rung2.name = 'rung';
  rung2.position.set(0, 0.6158, 0.2395);
  rung2.rotation.set(0, 0, deg(-91.4797));
  root.add(rung2);
  const rung3 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5359, 6), rungMat);
  rung3.name = 'rung';
  rung3.position.set(0, 0.9209, 0.1574);
  rung3.rotation.set(0, 0, deg(-88.4677));
  root.add(rung3);
  const rung4 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5277, 6), rungMat);
  rung4.name = 'rung';
  rung4.position.set(0, 1.2259, 0.0754);
  rung4.rotation.set(0, 0, deg(-91.3973));
  root.add(rung4);
  const rung5 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5194, 6), rungMat);
  rung5.name = 'rung';
  rung5.position.set(0, 1.5309, -0.0067);
  rung5.rotation.set(0, 0, deg(-90.9876));
  root.add(rung5);
  const rung6 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5112, 6), rungMat);
  rung6.name = 'rung';
  rung6.position.set(0, 1.8359, -0.0888);
  rung6.rotation.set(0, 0, deg(-90.8467));
  root.add(rung6);
  const rung7 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.5031, 6), rungMat);
  rung7.name = 'rung';
  rung7.position.set(0, 2.141, -0.1708);
  rung7.rotation.set(0, 0, deg(-88.919));
  root.add(rung7);
  const rung8 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.4951, 6), rungMat);
  rung8.name = 'rung';
  rung8.position.set(0, 2.446, -0.2529);
  rung8.rotation.set(0, 0, deg(-91.942));
  root.add(rung8);
  const rung9 = new THREE.Mesh(new THREE.CylinderGeometry(0.027, 0.027, 0.4869, 6), rungMat);
  rung9.name = 'rung';
  rung9.position.set(0, 2.751, -0.3349);
  rung9.rotation.set(0, 0, deg(-88.2622));
  root.add(rung9);

  root.traverse((o) => {
    if (o.isMesh) {
      o.castShadow = true;
      o.receiveShadow = true;
    }
  });
  return root;
}

export default createLadder;
```

---
Codels — 3D models as code for three.js. Search more: https://codels.download/api/v1/models?q=<query> · Guide: https://codels.download/llms.txt