Arthropleura

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('./arthropleura-base.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 './arthropleura-base.mjs';

function Arthropleura(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} />
  <Arthropleura size={1.4} />
</Canvas>

Every knob is a prop. size={1.4} 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.

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

1. Buy the asset, then 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:

Your agent authenticates with an API key: create one under My assets after purchase, and it can fetch everything you own.

I own "Arthropleura" on polyfork.dev. My API key is in
the POLYFORK_KEY env var. Download it into my project and add it
to my three.js scene:

  metadata: GET https://polyfork.dev/api/assets/arthropleura-base  files:    GET https://polyfork.dev/dl/arthropleura-base.glb
            GET https://polyfork.dev/dl/arthropleura-base.mjs
  (both with header  Authorization: Bearer $POLYFORK_KEY)

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,
  { object: asset, rig },   // 'Head' stays animatable
]);
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.

Rigged parts: Head, Chest, Spine, Tail, TailTip, LeftAntenna, LeftAntennaMid, LeftAntennaTip, LeftLeg1Hip, LeftLeg1Knee, LeftLeg2Hip, LeftLeg2Knee, LeftLeg3Hip, LeftLeg3Knee, LeftLeg4Hip, LeftLeg4Knee, LeftLeg5Hip, LeftLeg5Knee, LeftLeg6Hip, LeftLeg6Knee, LeftLeg7Hip, LeftLeg7Knee, LeftLeg8Hip, LeftLeg8Knee, LeftLeg9Hip, LeftLeg9Knee, LeftLeg10Hip, LeftLeg10Knee, LeftLeg11Hip, LeftLeg11Knee, LeftLeg12Hip, LeftLeg12Knee, LeftLeg13Hip, LeftLeg13Knee, LeftLeg14Hip, LeftLeg14Knee, LeftLeg15Hip, LeftLeg15Knee, LeftLeg16Hip, LeftLeg16Knee, LeftLeg17Hip, LeftLeg17Knee, LeftLeg18Hip, LeftLeg18Knee, LeftLeg19Hip, LeftLeg19Knee, LeftLeg20Hip, LeftLeg20Knee, RightAntenna, RightAntennaMid, RightAntennaTip, RightLeg1Hip, RightLeg1Knee, RightLeg2Hip, RightLeg2Knee, RightLeg3Hip, RightLeg3Knee, RightLeg4Hip, RightLeg4Knee, RightLeg5Hip, RightLeg5Knee, RightLeg6Hip, RightLeg6Knee, RightLeg7Hip, RightLeg7Knee, RightLeg8Hip, RightLeg8Knee, RightLeg9Hip, RightLeg9Knee, RightLeg10Hip, RightLeg10Knee, RightLeg11Hip, RightLeg11Knee, RightLeg12Hip, RightLeg12Knee, RightLeg13Hip, RightLeg13Knee, RightLeg14Hip, RightLeg14Knee, RightLeg15Hip, RightLeg15Knee, RightLeg16Hip, RightLeg16Knee, RightLeg17Hip, RightLeg17Knee, RightLeg18Hip, RightLeg18Knee, RightLeg19Hip, RightLeg19Knee, RightLeg20Hip, RightLeg20Knee. Each is a named group with its pivot at the hinge or axle, so one line animates it.

const asset = createAsset();
scene.add(asset);

// swing 'Head' open (tween this value for smooth motion):
asset.getObjectByName('Head').rotation.y = Math.PI / 4;

Loading the GLB instead? The same named nodes are there: gltf.scene.getObjectByName('Head').