Share a p5.js or Three.js sketch as a link
A p5.js or Three.js sketch is a web page, so it can run from one HTML file. Put the code and the library link in that file, upload it, and send a link that runs the sketch in any browser.
Creative-coding sketches run in the browser, but sending one is awkward. A zip of sketch.js and index.html asks the recipient to unpack it and open it locally, and a code paste only helps someone who already has an editor set up. AI assistants now write many of these sketches, which adds people who have the code but no place to run it.
One self-contained HTML file and a link solve it. The library loads from a CDN and your code sits inside the page.
Put a p5.js sketch in one file
Create sketch.html with this structure:
- ✓<!doctype html> and <meta charset="utf-8"> in the head.
- ✓<script src="https://cdn.jsdelivr.net/npm/p5@1.11.1/lib/p5.min.js"></script> to load p5.js.
- ✓A <script> block holding your setup() and draw() functions, pasted from sketch.js.
- ✓Optional: <style>body{margin:0}</style> so the canvas sits flush with the edges.
Put a Three.js scene in one file
Three.js is loaded as a module. Add an import map in the head that maps "three" to https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js, then put your scene code in a <script type="module"> block that starts with import * as THREE from "three".
Addons such as OrbitControls load the same way: map "three/addons/" to the examples/jsm/ folder of the same version on jsDelivr. Keep the version numbers identical across both entries.
Check textures, models and sounds
A single uploaded file cannot reach files that sat next to it on your computer. loadImage("cat.png") in p5.js, or a GLTFLoader pointed at model.glb in Three.js, fails once the page is hosted alone.
Small assets can go inside the page as data: URIs, or load from a public URL that allows cross-origin requests. Making an HTML file self-contained shows how. Large models and audio files are better left at a public URL.
Upload it and send the link
Drag the .html file onto the FileShare Pro dashboard and copy the link. The sketch runs as soon as the page opens. Viewers need no account and no editor. Fullscreen is allowed, so a fullscreen() call or a Fullscreen API button works.
Sketches that ask for the webcam or microphone, such as p5.js createCapture(), do not get that permission inside the shared page. Use a recorded video or image input for those.
If the sketch works locally but shows a blank page once hosted, open the browser console and see why an AI page works in chat but breaks when hosted.
Collect feedback on the sketch
Turn on comments and viewers can leave a note on the page after typing a name. The view count shows whether the people you sent it to have opened it.
When you change the sketch, upload the new file over the old one. The link stays the same and the previous version is kept in history: updating a shared link without changing it.
Frequently asked
Put the sketch code and a script tag that loads p5.js from a CDN into one HTML file, upload it to a host that serves HTML as a web page, and send the link.
Usually a model, texture or module path points to a local file that was not uploaded, or the import map is missing. Open the browser console to see which request failed.
No. Each upload is one file with its own link. Paste the contents of sketch.js into a script block inside the HTML file.
Not with the CDN script. The page needs an internet connection to load p5.js or Three.js.
Yes. The free plan hosts up to 50 files of up to 100 MB each, with view counts and comments included. Password-protected links are on Pro.
Drop the file, copy the link — live in seconds, free plan included.
Start sharing free