# Baobab Tree

> A majestic low-poly African baobab: a massive, bulging bottle-shaped trunk in smooth gray-brown bark topped by a small, flat crown of stubby root-like branches with sparse foliage pads. Adjust height, girth and variation, or drop the leaves for the dry season — a striking landmark for savanna, safari and desert scenes.

![Baobab Tree preview](https://codels.download/m/baobab-tree.png)

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

## Facts

- Category: Nature › Trees
- Size (W × H × D): 7.76 × 9.15 × 7.54 m — units are meters, +Y up, front faces +Z
- Origin: center of the base (y = 0)
- Triangles: 1,258 · Meshes: 40 · Materials: 5
- License: CC0-1.0 (Codels built-in)
- Tags: african, baobab, savanna, tree, low-poly, stylized, desert, grassland, adventure, city-builder, background, landmark, vegetation, foliage-material, wood, tall, wide, game-ready, mobile-friendly, parametric, color-green, color-orange, size-large, poly-low
- Page: https://codels.download/models/baobab-tree

## Files

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

## Parameters

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

| Param | Type | Range / options | Default | Current |
|---|---|---|---|---|
| `height` | number | 5 – 14 | 9 | 9 |
| `girth` | number | 0.7 – 1.4 | 1 | 1 |
| `leaves` | boolean | true \| false | true | true |
| `seed` | int | 1 – 20 | 3 | 3 |

## Parts

- baobab (group)
  - trunk (lathe · bark)
  - branch1 (cylinder · bark)
  - twig1a (cylinder · barkDark)
  - leaves1a (dodecahedron · leaf)
  - twig1b (cylinder · barkDark)
  - leaves1b (dodecahedron · leafLight)
  - leavesMid1 (dodecahedron · leafDark)
  - branch2 (cylinder · bark)
  - twig2a (cylinder · barkDark)
  - leaves2a (dodecahedron · leaf)
  - twig2b (cylinder · barkDark)
  - leaves2b (dodecahedron · leaf)
  - branch3 (cylinder · bark)
  - twig3a (cylinder · barkDark)
  - leaves3a (dodecahedron · leaf)
  - twig3b (cylinder · barkDark)
  - leaves3b (dodecahedron · leafLight)
  - leavesMid3 (dodecahedron · leafDark)
  - branch4 (cylinder · bark)
  - twig4a (cylinder · barkDark)
  - leaves4a (dodecahedron · leaf)
  - twig4b (cylinder · barkDark)
  - leaves4b (dodecahedron · leaf)
  - branch5 (cylinder · bark)
  - twig5a (cylinder · barkDark)
  - leaves5a (dodecahedron · leaf)
  - twig5b (cylinder · barkDark)
  - leaves5b (dodecahedron · leafDark)
  - leavesMid5 (dodecahedron · leafDark)
  - branch6 (cylinder · bark)
  - twig6a (cylinder · barkDark)
  - leaves6a (dodecahedron · leaf)
  - twig6b (cylinder · barkDark)
  - leaves6b (dodecahedron · leaf)
  - branch7 (cylinder · bark)
  - twig7a (cylinder · barkDark)
  - leaves7a (dodecahedron · leafDark)
  - twig7b (cylinder · barkDark)
  - leaves7b (dodecahedron · leafLight)

## How to use

Save the code below as `baobab-tree.js`, then:

```js
import { createBaobabTree } from './baobab-tree.js';
const model = createBaobabTree();
scene.add(model);
```

## Code

```js
/**
 * Baobab Tree — Codels 3D model library (https://codels.download/models/baobab-tree)
 * License: CC0-1.0 · Units: meters · Y-up · Front: +Z · Origin: center of the base (y = 0)
 * Triangles: 1,258 · Size (W × H × D): 7.76 × 9.15 × 7.54 m
 *
 * Usage:
 *   import { createBaobabTree } from './baobab-tree.js';
 *   
 *   const model = createBaobabTree();
 *   model.position.set(0, 0, 0);
 *   scene.add(model);
 */
import * as THREE from 'three';

const deg = THREE.MathUtils.degToRad;

// 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;
}

// Revolve a 2D profile [[radius, y], ...] around the Y axis.
function lathe(points, segments, phiStart = 0, phiLength = Math.PI * 2) {
  return new THREE.LatheGeometry(points.map(([x, y]) => new THREE.Vector2(x, y)), segments, phiStart, phiLength);
}

export function createBaobabTree() {
  const root = new THREE.Group();
  root.name = 'BaobabTree';

  // Materials
  const barkMat = new THREE.MeshStandardMaterial({ name: 'bark', color: 0x8f7867, roughness: 0.9, flatShading: true });
  const barkDarkMat = new THREE.MeshStandardMaterial({ name: 'barkDark', color: 0x786557, roughness: 0.95, flatShading: true });
  const leafMat = new THREE.MeshStandardMaterial({ name: 'leaf', color: 0x6f9a3c, roughness: 0.85, flatShading: true });
  const leafLightMat = new THREE.MeshStandardMaterial({ name: 'leafLight', color: 0x85b349, roughness: 0.85, flatShading: true });
  const leafDarkMat = new THREE.MeshStandardMaterial({ name: 'leafDark', color: 0x55782f, roughness: 0.9, flatShading: true });

  // Parts
  const baobab = new THREE.Group();
  baobab.name = 'baobab';
  baobab.position.set(0, 0.0346, 0);
  root.add(baobab);
  const trunk = new THREE.Mesh(jitter(lathe([[0, 0], [1.62, 0], [1.458, 0.36], [1.485, 1.8], [1.4175, 3.24], [1.161, 4.5], [0.81, 5.58], [0.567, 6.3], [0.513, 6.66], [0, 6.66]], 9), 0.0473, 3), barkMat);
  trunk.name = 'trunk';
  baobab.add(trunk);
  const branch1 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.8926, 6), barkMat);
  branch1.name = 'branch1';
  branch1.position.set(1.2747, 7.1554, 0.2797);
  branch1.rotation.set(deg(10.0878), deg(-5.034), deg(-52.9511));
  baobab.add(branch1);
  const twig1a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9803, 5), barkDarkMat);
  twig1a.name = 'twig1a';
  twig1a.position.set(2.7319, 8.2316, 0.4348);
  twig1a.rotation.set(deg(-10.8853), deg(5.2801), deg(-51.6496));
  baobab.add(twig1a);
  const leaves1a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6448, 0), 0.0774, 111), leafMat);
  leaves1a.name = 'leaves1a';
  leaves1a.position.set(3.0898, 8.6014, 0.3486);
  leaves1a.rotation.set(deg(24.8729), deg(20.4524), 0);
  leaves1a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves1a);
  const twig1b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.0423, 5), barkDarkMat);
  twig1b.name = 'twig1b';
  twig1b.position.set(2.7254, 8.2282, 0.729);
  twig1b.rotation.set(deg(25.6895), deg(-11.3533), deg(-47.1087));
  baobab.add(twig1b);
  const leaves1b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6694, 0), 0.0803, 112), leafLightMat);
  leaves1b.name = 'leaves1b';
  leaves1b.position.set(3.0769, 8.5981, 0.9369);
  leaves1b.rotation.set(deg(14.0738), deg(101.0258), 0);
  leaves1b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves1b);
  const leavesMid1 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.63, 0), 0.0756, 159), leafDarkMat);
  leavesMid1.name = 'leavesMid1';
  leavesMid1.position.set(1.7804, 8.0216, 0.3907);
  leavesMid1.rotation.set(0, deg(201.1183), 0);
  leavesMid1.scale.set(1.4, 0.4, 1.4);
  baobab.add(leavesMid1);
  const branch2 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.9503, 6), barkMat);
  branch2.name = 'branch2';
  branch2.position.set(1.1209, 7.0198, 0.8771);
  branch2.rotation.set(deg(34.1716), deg(-14.8206), deg(-45.8704));
  baobab.add(branch2);
  const twig2a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.1415, 5), barkDarkMat);
  twig2a.name = 'twig2a';
  twig2a.position.set(2.541, 7.9324, 1.8338);
  twig2a.rotation.set(deg(21.1152), deg(-11.4489), deg(-56.5473));
  baobab.add(twig2a);
  const leaves2a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6013, 0), 0.0722, 113), leafMat);
  leaves2a.name = 'leaves2a';
  leaves2a.position.set(2.9817, 8.2676, 2.0241);
  leaves2a.rotation.set(deg(23.2687), deg(247.7413), 0);
  leaves2a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves2a);
  const twig2b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.1527, 5), barkDarkMat);
  twig2b.name = 'twig2b';
  twig2b.position.set(2.3042, 7.9414, 2.0799);
  twig2b.rotation.set(deg(54.9525), deg(-11.8066), deg(-22.4906));
  baobab.add(twig2b);
  const leaves2b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6346, 0), 0.0761, 114), leafMat);
  leaves2b.name = 'leaves2b';
  leaves2b.position.set(2.5081, 8.2907, 2.5163);
  leaves2b.rotation.set(deg(12.3561), deg(91.3183), 0);
  leaves2b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves2b);
  const branch3 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 3.1446, 6), barkMat);
  branch3.name = 'branch3';
  branch3.position.set(-0.495, 7.2185, 1.3253);
  branch3.rotation.set(deg(50.7613), deg(8.0224), deg(16.8158));
  baobab.add(branch3);
  const twig3a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.2376, 5), barkDarkMat);
  twig3a.name = 'twig3a';
  twig3a.position.set(-0.9864, 8.4074, 2.9692);
  twig3a.rotation.set(deg(56.1606), deg(3.0921), deg(5.7923));
  baobab.add(twig3a);
  const leaves3a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6131, 0), 0.0736, 115), leafMat);
  leaves3a.name = 'leaves3a';
  leaves3a.position.set(-1.0455, 8.822, 3.4561);
  leaves3a.rotation.set(deg(13.3719), deg(10.4691), 0);
  leaves3a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves3a);
  const twig3b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9622, 5), barkDarkMat);
  twig3b.name = 'twig3b';
  twig3b.position.set(-1.1591, 8.3317, 2.7777);
  twig3b.rotation.set(deg(42.3498), deg(12.6473), deg(31.9295));
  baobab.add(twig3b);
  const leaves3b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6642, 0), 0.0797, 116), leafLightMat);
  leaves3b.name = 'leaves3b';
  leaves3b.position.set(-1.3909, 8.6781, 3.073);
  leaves3b.rotation.set(deg(14.9354), deg(187.1924), 0);
  leaves3b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves3b);
  const leavesMid3 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.63, 0), 0.0756, 161), leafDarkMat);
  leavesMid3.name = 'leavesMid3';
  leavesMid3.position.set(-0.6954, 8.1479, 1.8618);
  leavesMid3.rotation.set(0, deg(342.1365), 0);
  leavesMid3.scale.set(1.4, 0.4, 1.4);
  baobab.add(leavesMid3);
  const branch4 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.6326, 6), barkMat);
  branch4.name = 'branch4';
  branch4.position.set(-1.0379, 6.9692, 0.7315);
  branch4.rotation.set(deg(31.0844), deg(13.8254), deg(47.1071));
  baobab.add(branch4);
  const twig4a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.0734, 5), barkDarkMat);
  twig4a.name = 'twig4a';
  twig4a.position.set(-2.1747, 7.9054, 1.664);
  twig4a.rotation.set(deg(37.8057), deg(10.3505), deg(29.6303));
  baobab.add(twig4a);
  const leaves4a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.5544, 0), 0.0665, 117), leafMat);
  leaves4a.name = 'leaves4a';
  leaves4a.position.set(-2.4203, 8.3078, 1.9684);
  leaves4a.rotation.set(deg(16.1913), deg(140.8268), 0);
  leaves4a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves4a);
  const twig4b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9892, 5), barkDarkMat);
  twig4b.name = 'twig4b';
  twig4b.position.set(-2.2637, 7.8988, 1.4269);
  twig4b.rotation.set(deg(8.3889), deg(3.6015), deg(46.4086));
  baobab.add(twig4b);
  const leaves4b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.5498, 0), 0.066, 118), leafMat);
  leaves4b.name = 'leaves4b';
  leaves4b.position.set(-2.5982, 8.2939, 1.4943);
  leaves4b.rotation.set(deg(21.4364), deg(315.7201), 0);
  leaves4b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves4b);
  const branch5 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.7138, 6), barkMat);
  branch5.name = 'branch5';
  branch5.position.set(-1.2214, 6.9909, -0.4569);
  branch5.rotation.set(deg(-17.9943), deg(-9.5599), deg(55.6793));
  baobab.add(branch5);
  const twig5a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.1282, 5), barkDarkMat);
  twig5a.name = 'twig5a';
  twig5a.position.set(-2.6777, 7.9721, -0.9117);
  twig5a.rotation.set(deg(-6.577), deg(-3.0203), deg(49.2937));
  baobab.add(twig5a);
  const leaves5a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6656, 0), 0.0799, 119), leafMat);
  leaves5a.name = 'leaves5a';
  leaves5a.position.set(-3.0807, 8.4144, -0.9726);
  leaves5a.rotation.set(deg(18.5068), deg(178.1201), 0);
  leaves5a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves5a);
  const twig5b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9325, 5), barkDarkMat);
  twig5b.name = 'twig5b';
  twig5b.position.set(-2.5357, 7.8699, -1.1017);
  twig5b.rotation.set(deg(-36.3173), deg(-12.9027), deg(38.0443));
  baobab.add(twig5b);
  const leaves5b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6711, 0), 0.0805, 120), leafDarkMat);
  leaves5b.name = 'leaves5b';
  leaves5b.position.set(-2.7967, 8.2108, -1.3525);
  leaves5b.rotation.set(deg(23.7406), deg(109.7036), 0);
  leaves5b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves5b);
  const leavesMid5 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.63, 0), 0.0756, 163), leafDarkMat);
  leavesMid5.name = 'leavesMid5';
  leavesMid5.position.set(-1.706, 7.6926, -0.6381);
  leavesMid5.rotation.set(0, deg(276.2141), 0);
  leavesMid5.scale.set(1.4, 0.4, 1.4);
  baobab.add(leavesMid5);
  const branch6 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.55, 6), barkMat);
  branch6.name = 'branch6';
  branch6.position.set(-0.4833, 7.0293, -1.0809);
  branch6.rotation.set(deg(-50.1196), deg(-9.4593), deg(20.0687));
  baobab.add(branch6);
  const twig6a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9915, 5), barkDarkMat);
  twig6a.name = 'twig6a';
  twig6a.position.set(-1.1345, 8.0188, -2.2419);
  twig6a.rotation.set(deg(-32.2257), deg(-9.406), deg(31.7923));
  baobab.add(twig6a);
  const leaves6a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.7124, 0), 0.0855, 121), leafMat);
  leaves6a.name = 'leaves6a';
  leaves6a.position.set(-1.3756, 8.4379, -2.486);
  leaves6a.rotation.set(deg(29.6725), deg(68.4377), 0);
  leaves6a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves6a);
  const twig6b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.0112, 5), barkDarkMat);
  twig6b.name = 'twig6b';
  twig6b.position.set(-0.891, 8.0604, -2.3129);
  twig6b.rotation.set(deg(-41.6758), deg(0.1066), deg(-0.28));
  baobab.add(twig6b);
  const leaves6b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.5965, 0), 0.0716, 122), leafMat);
  leaves6b.name = 'leaves6b';
  leaves6b.position.set(-0.8887, 8.5037, -2.6279);
  leaves6b.rotation.set(deg(7.1748), deg(195.5751), 0);
  leaves6b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves6b);
  const branch7 = new THREE.Mesh(new THREE.CylinderGeometry(0.1336, 0.3181, 2.3897, 6), barkMat);
  branch7.name = 'branch7';
  branch7.position.set(0.6313, 6.9819, -0.9243);
  branch7.rotation.set(deg(-44.5168), deg(11.9163), deg(-28.6109));
  baobab.add(branch7);
  const twig7a = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 1.0607, 5), barkDarkMat);
  twig7a.name = 'twig7a';
  twig7a.position.set(1.2127, 7.958, -2.0552);
  twig7a.rotation.set(deg(-45.4336), deg(2.48), deg(-5.9194));
  baobab.add(twig7a);
  const leaves7a = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6553, 0), 0.0786, 123), leafDarkMat);
  leaves7a.name = 'leaves7a';
  leaves7a.position.set(1.2641, 8.4027, -2.41);
  leaves7a.rotation.set(deg(28.642), deg(342.3947), 0);
  leaves7a.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves7a);
  const twig7b = new THREE.Mesh(new THREE.CylinderGeometry(0.0509, 0.1272, 0.9861, 5), barkDarkMat);
  twig7b.name = 'twig7b';
  twig7b.position.set(1.4232, 7.9344, -1.9002);
  twig7b.rotation.set(deg(-25.9748), deg(8.3225), deg(-35.0162));
  baobab.add(twig7b);
  const leaves7b = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.6593, 0), 0.0791, 124), leafLightMat);
  leaves7b.name = 'leaves7b';
  leaves7b.position.set(1.6851, 8.3561, -2.1001);
  leaves7b.rotation.set(deg(2.9693), deg(268.0271), 0);
  leaves7b.scale.set(1.3, 0.45, 1.3);
  baobab.add(leaves7b);
  const leavesMid7 = new THREE.Mesh(jitter(new THREE.DodecahedronGeometry(0.63, 0), 0.0756, 165), leafDarkMat);
  leavesMid7.name = 'leavesMid7';
  leavesMid7.position.set(0.871, 7.6746, -1.2753);
  leavesMid7.rotation.set(0, deg(58.1621), 0);
  leavesMid7.scale.set(1.4, 0.4, 1.4);
  baobab.add(leavesMid7);

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

export default createBaobabTree;
```

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