# Modular Half Wall

> A 2 m long, 1 m high parapet for the 2 m grid modular kit: 0.25 m thick, origin at the center of the base line, front +Z, flat ends at x = ±1, with the same plinth and cap as the full walls of its style. Switch on the railing for a balcony or gallery edge: an iron railing (stone, brick) or a wooden balustrade (plaster, planks) on a low curb. For battlements, balconies, landings and stair wells.

![Modular Half Wall preview](https://codels.download/m/half-wall.png)

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

## Facts

- Category: Buildings › Modular Kit
- Size (W × H × D): 2.00 × 1.00 × 0.32 m — units are meters, +Y up, front faces +Z
- Origin: center of the base (y = 0)
- Triangles: 108 · Meshes: 9 · Materials: 6
- License: CC0-1.0 (Codels built-in)
- Tags: balcony, grid, house, parapet, railing, wall, low-poly, stylized, fantasy, medieval, castle, exterior, interior, village, adventure, rpg, strategy, building, modular, obstacle, brick, metal, stone, wood, game-ready, instancing-friendly, mobile-friendly, parametric, color-gray, size-medium, poly-ultra-low
- Page: https://codels.download/models/half-wall

## Files

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

## Parameters

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

| Param | Type | Range / options | Default | Current |
|---|---|---|---|---|
| `style` | select | stone \| brick \| plaster \| wood | stone | stone |
| `railing` | boolean | true \| false | false | false |
| `tint` | color | #rrggbb | #ffffff | #ffffff |

## Parts

- plinth (box · plinth)
- cap (box · dressed)
- core (box · mortar)
- stone (box · stone)
- stone (box · stone)
- stone (box · stone)
- stone (box · stone)
- stone (box · stone3)
- stone (box · stone2)

## How to use

Save the code below as `half-wall.js`, then:

```js
import { createHalfWall } from './half-wall.js';
const model = createHalfWall();
scene.add(model);
```

## Code

```js
/**
 * Modular Half Wall — Codels 3D model library (https://codels.download/models/half-wall)
 * License: CC0-1.0 · Units: meters · Y-up · Front: +Z · Origin: center of the base (y = 0)
 * Triangles: 108 · Size (W × H × D): 2.00 × 1.00 × 0.32 m
 *
 * Usage:
 *   import { createHalfWall } from './half-wall.js';
 *   
 *   const model = createHalfWall();
 *   model.position.set(0, 0, 0);
 *   scene.add(model);
 */
import * as THREE from 'three';

// Deterministic vertex displacement (organic low-poly look).
function jitter(geometry, amount, seed) {
  const pos = geometry.attributes.position;
  const h = (a, b, c, s) => {
    let x = Math.imul(a, 73856093) ^ Math.imul(b, 19349663) ^ Math.imul(c, 83492791) ^ Math.imul(s, 2654435761);
    x = Math.imul(x ^ (x >>> 16), 2246822507);
    x = Math.imul(x ^ (x >>> 13), 3266489909);
    return ((x ^ (x >>> 16)) >>> 0) / 4294967295 - 0.5;
  };
  for (let i = 0; i < pos.count; i++) {
    const x = pos.getX(i), y = pos.getY(i), z = pos.getZ(i);
    const qx = Math.round(x * 1000), qy = Math.round(y * 1000), qz = Math.round(z * 1000);
    pos.setXYZ(i, x + h(qx, qy, qz, seed) * 2 * amount, y + h(qx, qy, qz, seed + 1) * 2 * amount, z + h(qx, qy, qz, seed + 2) * 2 * amount);
  }
  pos.needsUpdate = true;
  geometry.computeVertexNormals();
  return geometry;
}

export function createHalfWall() {
  const root = new THREE.Group();
  root.name = 'HalfWall';

  // Materials
  const stoneMat = new THREE.MeshStandardMaterial({ name: 'stone', color: 0x7c7871, roughness: 0.95, flatShading: true });
  const stone2Mat = new THREE.MeshStandardMaterial({ name: 'stone2', color: 0x67635c, roughness: 0.95, flatShading: true });
  const stone3Mat = new THREE.MeshStandardMaterial({ name: 'stone3', color: 0x8b867c, roughness: 0.95, flatShading: true });
  const mortarMat = new THREE.MeshStandardMaterial({ name: 'mortar', color: 0x3f3c38, roughness: 1, flatShading: true });
  const plinthMat = new THREE.MeshStandardMaterial({ name: 'plinth', color: 0x57534d, roughness: 0.95, flatShading: true });
  const dressedMat = new THREE.MeshStandardMaterial({ name: 'dressed', color: 0x9a9488, roughness: 0.9, flatShading: true });

  // Parts
  const plinth = new THREE.Mesh(new THREE.BoxGeometry(2, 0.3, 0.31), plinthMat);
  plinth.name = 'plinth';
  plinth.position.set(0, 0.15, 0);
  root.add(plinth);
  const cap = new THREE.Mesh(new THREE.BoxGeometry(2, 0.2, 0.32), dressedMat);
  cap.name = 'cap';
  cap.position.set(0, 0.9, 0);
  root.add(cap);
  const core = new THREE.Mesh(new THREE.BoxGeometry(2, 0.5, 0.25), mortarMat);
  core.name = 'core';
  core.position.set(0, 0.55, 0);
  root.add(core);
  const stone = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.6509, 0.28, 0.27), 0.005, 850), stoneMat);
  stone.name = 'stone';
  stone.position.set(-0.6646, 0.45, 0);
  root.add(stone);
  const stone2 = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.4571, 0.28, 0.2843), 0.005, 851), stoneMat);
  stone2.name = 'stone';
  stone2.position.set(-0.0906, 0.45, 0);
  root.add(stone2);
  const stone3 = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.8321, 0.28, 0.2791), 0.005, 852), stoneMat);
  stone3.name = 'stone';
  stone3.position.set(0.574, 0.45, 0);
  root.add(stone3);
  const stone4 = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.6534, 0.18, 0.2717), 0.005, 853), stoneMat);
  stone4.name = 'stone';
  stone4.position.set(-0.6633, 0.7, 0);
  root.add(stone4);
  const stone5 = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.6986, 0.18, 0.2811), 0.005, 854), stone3Mat);
  stone5.name = 'stone';
  stone5.position.set(0.0327, 0.7, 0);
  root.add(stone5);
  const stone6 = new THREE.Mesh(jitter(new THREE.BoxGeometry(0.588, 0.18, 0.273), 0.005, 855), stone2Mat);
  stone6.name = 'stone';
  stone6.position.set(0.696, 0.7, 0);
  root.add(stone6);

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

export default createHalfWall;
```

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