Polyfork BrowseKitsCharactersSteerPricingBlog
←

Beach Towel

free remixable HD · show flat
drag to orbit · scroll to zoom
Coast and Boardwalk low-poly 3D kit Part of Coast and Boardwalk 59 matching parts, one palette and scale

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 './beach-towel-adb6c0-hd.mjs';
scene.add(createAsset());
Print your logo on it (1 declared area — the same thing the sticker button up in the viewer does)
import * as asset from './beach-towel-adb6c0-hd.mjs';
import { decalsFromSvg } from 'https://polyfork.dev/cdn/decal.mjs';

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

// any SVG with flat colours (up to three, plus transparency); text as paths
const svg = await (await fetch('/your-logo.svg')).text();
await decalsFromSvg(model, asset.decals, svg);

Areas on this asset: towel-field (0.24m×0.16m) — pass a filtered asset.decals to print on some only. The bake runs in a worker; on a GLB mount read the areas from https://polyfork.dev/cdn/beach-towel-adb6c0-hd-params.json and pass them in place of asset.decals. Full reference: llms.txt § Your own logo.

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 './beach-towel-adb6c0-hd.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('./beach-towel-adb6c0-hd.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 './beach-towel-adb6c0.mjs';

function BeachTowel(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} />
  <BeachTowel colorway="harbour-blue" />
</Canvas>

Every knob is a prop. colorway="harbour-blue" 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.

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. The HD .glb downloads from this page with Pro; the low poly one is free.
  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 "Beach Towel" 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/beach-towel-adb6c0  files:    GET https://polyfork.dev/dl/beach-towel-adb6c0-hd.glb
            GET https://polyfork.dev/dl/beach-towel-adb6c0-hd.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,
  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.

Beach Towel HDPro

The HD edition comes with Pro: high poly, PBR materials made in code, every slider still works. The low poly model stays free.

or $149/year · what is included

Lifetime $100once

One-time purchase, no renewal. Every HD edition, current and future, and everything in Pro.

KCTJRPSW+55

10 of 200 seats left

A beach towel on the sand, 1.8 x 0.9 m of thick faded stripes with a soft ridge along every fold, a frayed end and a rucked corner; tide at 0 lies it spread flat with a pressed body hollow and a pebble holding one corner. Part of the Coast and Boardwalk kit.

  • 3,196 triangles · 8 materials
  • 0.94 × 0.21 × 1.92 m, real-world scale
  • GLB (3.1 MB) + drop-in ES module, PBR materials generated in code
  • The viewer here is preview quality: the download is the full-detail file
  • Detachable: pebble (surface behind stays closed)
  • Commercial license: games, apps, client work, anything. No attribution required. (No reselling the raw assets, and no building a commercial asset generator from them.)

Need a different version of this? Request a variant.

Related assets

Free Beach Shower Post low-poly 3D model
Beach Shower Post
792 tris
Free Lifeguard Tower low-poly 3D model
Lifeguard Tower
1,175 tris
Free Beach Flag Pole low-poly 3D model
Beach Flag Pole
648 tris
Free Beach Cafe Kiosk low-poly 3D model
Beach Cafe Kiosk
1,198 tris
Free Beach Windbreak low-poly 3D model
Beach Windbreak
724 tris
Free Rowing Dinghy low-poly 3D model
Rowing Dinghy
2,265 tris

One of 3,025 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.