Nemotron 3.5 Lightning (free)
by NVIDIAReasoning1 console error
Running live in a sandboxed frame. Click inside it before using the keyboard.
How it went
- Total time
- 46.6 s
- Cost
- $0
- Output tokens
- 3,482
- Spent thinking
- 0 tokens
- Speed
- 75.8 tok/s
- Console errors
- 1
- First token after
- 663 ms
- First visible text after
- 663 ms
- Prompt tokens
- 584
- Code size
- 11.2 KB
- Finish reason
- stop
- Served by
- Nvidia
- Model id
nvidia/nemotron-3.5-lightning:free- Reasoning sent
{"effort":"none"}- Max output
- 32,000 tokens
- Generated
- Nov 9, 2026
Console errors
Caught in the first 3 seconds after load, in a sandboxed iframe like the one above.
THREE.WebGLProgram: Shader Error 0 - VALIDATE_STATUS false
Material Name:
Material Type: ShaderMaterial
Program Info Log: Vertex shader is not compiled.
VERTEX
ERROR: 0:76: '*' : wrong operand types - no operation '*' exists that takes a left-hand operand of type 'highp float' and a right operand of type 'const int' (or there is no acceptable conversion)
71: attribute float size;
72: uniform float time;
73: varying float vAlpha;
74: void main() {
75What it was asked
The prompt
Build a low-poly 3D scene of a campfire in a forest clearing at night, with Three.js in a single HTML file. Load Three.js only through this import map (do not use any other URL or version): <script type="importmap">{"imports":{"three":"https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js","three/addons/":"https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/"}}</script> Requirements: - A ground with a few low-poly rocks and logs around a campfire in the center. - At least 30 low-poly trees placed randomly around the clearing (not on the fire). - The campfire has animated flames and a warm point light that flickers and casts shadows. - Sparks rising from the fire as a simple particle system. - A dark night sky with stars and a moon, plus fog that fades the distant trees. - OrbitControls to look around, with limits so the camera stays above the ground. - The renderer fills the window and handles resizing correctly.
System prompt, sent with every prompt
You are generating a self-contained web demo. It will be rendered automatically in a sandboxed iframe and compared side by side with the output of other AI models given the exact same task. Output rules: - Reply with exactly ONE fenced code block containing the complete file: ```html (or ```svg when the task asks for an SVG). No text before or after the code block. - Everything must be inline: CSS in <style>, JavaScript in <script>. No external files, images, fonts or network requests, except the CDN URLs explicitly allowed by the task. - Do not use localStorage, sessionStorage, cookies, IndexedDB, alert(), confirm(), prompt() or window.open(): they are blocked in the sandbox and will throw. - The page must look right in a 1280×800 viewport and adapt gracefully down to 375px wide. No horizontal scrollbar. - Something meaningful must be visible on first paint: a screenshot is taken automatically about 3 seconds after load, without any interaction. - Everything that makes the demo interesting must be visible within the first seconds: nothing hidden behind a high score, a later level or a long play session. - Games must start in a self-playing demo mode (a simple AI plays) behind a "Click or press a key to start" message, so the game can be judged in action without playing. - The iframe only receives keyboard events after the user clicks it: if the demo uses the keyboard, display a clear "Click or press a key to start" message. - The code must run with zero errors in the console of the latest Chrome.
Code run-1.html · 329 lines
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Low-Poly Campfire Scene</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { width: 100%; height: 100%; overflow: hidden; background: #000; }
canvas { display: block; }
</style>
</head>
<body>
<script type="importmap">
{"imports":{"three":"https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js","three/addons/":"https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/"}}
</script>
<script type="module">
import * as THREE from 'three';
import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
// Scene setup
const scene = new THREE.Scene();
scene.fog = new THREE.Fog(0x000000, 20, 80);
const camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.set(10, 12, 15);
const renderer = new THREE.WebGLRenderer({ antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setPixelRatio(Math.min(window.devicePixelRatio, 2));
renderer.shadowMap.enabled = true;
renderer.shadowMap.type = THREE.PCFSoftShadowMap;
document.body.appendChild(renderer.domElement);
const controls = new OrbitControls(camera, renderer.domElement);
controls.maxPolarAngle = Math.PI / 2.1;
controls.minPolarAngle = Math.PI / 5;
controls.enableDamping = true;
// Ground
const groundGeo = new THREE.PlaneGeometry(50, 50, 10, 10);
const groundMat = new THREE.MeshStandardMaterial({ color: 0x2a1f10 });
const ground = new THREE.Mesh(groundGeo, groundMat);
ground.rotation.x = -Math.PI / 2;
ground.receiveShadow = true;
scene.add(ground);
// Rocks
function createRock(x, z) {
const sizes = [2, 2.5, 3, 3.5];
const geo = new THREE.IcosahedronGeometry(sizes[Math.floor(Math.random()*sizes.length)], 1);
const mat = new THREE.MeshStandardMaterial({ color: 0x5a5a5a });
const rock = new THREE.Mesh(geo, mat);
rock.position.set(x, 0, z);
rock.scale.setScalar(0.5 + Math.random() * 0.5);
rock.castShadow = true;
rock.receiveShadow = true;
rock.userData = { type: 'rock' };
return rock;
}
// Logs
function createLog(x, z) {
const length = 4 + Math.random() * 4;
const geo = new THREE.CylinderGeometry(0.4, 0.4, length, 12, 1);
const mat = new THREE.MeshStandardMaterial({ color: 0x8b5a2b });
const log = new THREE.Mesh(geo, mat);
log.position.set(x, length / 2, z);
log.rotation.z = Math.random() * Math.PI * 2;
log.castShadow = true;
log.receiveShadow = true;
log.userData = { type: 'log' };
return log;
}
// Tree - low poly
function createTree(x, z) {
// Trunk
const trunkGeo = new THREE.CylinderGeometry(0.3, 0.6, 5, 8, 1);
const trunkMat = new THREE.MeshStandardMaterial({ color: 0x8b4513 });
const trunk = new THREE.Mesh(trunkGeo, trunkMat);
trunk.position.set(x, 2.5, z);
trunk.castShadow = true;
trunk.receiveShadow = true;
// Leaves - low poly sphere
const leafGeo = new THREE.IcosahedronGeometry(2 + Math.random() * 1.5, 0);
const leafMat = new THREE.MeshStandardMaterial({ color: 0x228b22 });
const leaves = new THREE.Mesh(leafGeo, leafMat);
leaves.position.set(x, 7, z);
leaves.scale.setScalar(0.8 + Math.random() * 0.4);
leaves.castShadow = true;
leaves.receiveShadow = true;
const group = new THREE.Group();
group.add(trunk);
group.add(leaves);
group.position.set(x, 0, z);
group.userData = { type: 'tree' };
return group;
}
// Rocks and logs around fire
for (let i = 0; i < 8; i++) {
const angle = (Math.PI * 2 / 8) * i;
const radius = 6 + Math.random() * 4;
const x = Math.cos(angle) * radius;
const z = Math.sin(angle) * radius;
if (Math.random() > 0.5) scene.add(createRock(x, z));
else scene.add(createLog(x, z));
}
// Trees (at least 30, not on fire)
for (let i = 0; i < 35; i++) {
let x, z;
let tooClose = true;
while (tooClose) {
x = (Math.random() - 0.5) * 40;
z = (Math.random() - 0.5) * 40;
tooClose = Math.abs(x) < 4 && Math.abs(z) < 4;
}
scene.add(createTree(x, z));
}
// Campfire center
const fireCenter = new THREE.Group();
scene.add(fireCenter);
// Fire base
const fireGeo = new THREE.ConeGeometry(0.5, 1.5, 8);
const fireMat = new THREE.MeshBasicMaterial({ color: 0xff6600 });
const fireBase = new THREE.Mesh(fireGeo, fireMat);
fireBase.position.y = 0.75;
fireCenter.add(fireBase);
// Flame layers - animated
const flameCount = 6;
const flames = [];
for (let i = 0; i < flameCount; i++) {
const height = 1.5 + (i / flameCount) * 2;
const geo = new THREE.ConeGeometry(0.3 + Math.random() * 0.3, height, 6);
const color = new THREE.Color().setHSL(0.06 + Math.random() * 0.02, 0.7, 0.4 - i * 0.05);
const mat = new THREE.MeshBasicMaterial({ color: color, transparent: true, opacity: 0.8 - i * 0.1 });
const flame = new THREE.Mesh(geo, mat);
flame.position.y = height / 2;
flame.rotation.z = Math.random() * Math.PI * 2;
flame.userData = { baseY: flame.position.y, speed: 0.02 + Math.random() * 0.03 };
flames.push(flame);
fireCenter.add(flame);
}
// Point light - flickering campfire
const fireLight = new THREE.PointLight(0xffa500, 1.5, 20);
fireLight.position.set(0, 3, 0);
fireLight.castShadow = true;
fireLight.shadow.mapSize.width = 256;
fireLight.shadow.mapSize.height = 256;
fireLight.shadow.radius = 4;
scene.add(fireLight);
// Sparks particle system
const sparkCount = 50;
const sparkGeometry = new THREE.BufferGeometry();
const sparkPositions = new Float32Array(sparkCount * 3);
const sparkColors = new Float32Array(sparkCount * 3);
const sparkSizes = new Float32Array(sparkCount);
for (let i = 0; i < sparkCount * 3; i++) sparkPositions[i] = 0;
for (let i = 0; i < sparkCount; i++) {
sparkColors[i * 3 + 0] = 1.0;
sparkColors[i * 3 + 1] = 0.5;
sparkColors[i * 3 + 2] = 0.1;
sparkSizes[i] = 0.1 + Math.random() * 0.3;
}
sparkGeometry.setAttribute('position', new THREE.BufferAttribute(sparkPositions, 3));
sparkGeometry.setAttribute('color', new THREE.BufferAttribute(sparkColors, 3));
sparkGeometry.setAttribute('size', new THREE.BufferAttribute(sparkSizes, 1));
const sparkMaterial = new THREE.ShaderMaterial({
uniforms: {
time: { value: 0 }
},
vertexShader: `
attribute float size;
uniform float time;
varying float vAlpha;
void main() {
vAlpha = 1.0 - size * 0.5;
vec4 mvPosition = modelViewMatrix * vec4(position + normal * sin(time + position.y * 10) * 0.1, 1.0);
gl_PointSize = size * (300.0 / -mvPosition.z);
gl_Position = projectionMatrix * mvPosition;
}
`,
fragmentShader: `
uniform float time;
varying float vAlpha;
void main() {
float dist = distance(gl_PointCoord, vec2(0.5));
if (dist > 0.5) discard;
float alpha = smoothstep(0.5, 0.0, dist) * vAlpha;
gl_FragColor = vec4(1.0, 0.5, 0.1, alpha);
}
`,
transparent: true,
blending: THREE.AdditiveBlending,
depthWrite: false
});
const sparks = new THREE.Points(sparkGeometry, sparkMaterial);
sparks.position.set(0, 1, 0);
fireCenter.add(sparks);
// Sky with stars and moon
const skyGeo = new THREE.SphereGeometry(50, 32, 32);
skyGeo.scale(-1, 1, 1);
const skyMat = new THREE.MeshBasicMaterial({ color: 0x0a0a20, side: THREE.BackSide });
const sky = new THREE.Mesh(skyGeo, skyMat);
scene.add(sky);
// Stars
const starCount = 100;
const starGeom = new THREE.BufferGeometry();
const starPos = new Float32Array(starCount * 3);
const starSize = new Float32Array(starCount);
for (let i = 0; i < starCount; i++) {
const radius = 20 + Math.random() * 30;
const theta = Math.random() * Math.PI * 2;
const phi = Math.acos(2 * Math.random() - 1);
starPos[i * 3] = radius * Math.sin(phi) * Math.cos(theta);
starPos[i * 3 + 1] = radius * Math.sin(phi) * Math.sin(theta);
starPos[i * 3 + 2] = radius * Math.cos(phi);
starSize[i] = 0.5 + Math.random() * 1.5;
}
starGeom.setAttribute('position', new THREE.BufferAttribute(starPos, 3));
starGeom.setAttribute('size', new THREE.BufferAttribute(starSize, 1));
const starMat = new THREE.ShaderMaterial({
uniforms: {},
vertexShader: `
attribute float size;
varying float vAlpha;
void main() {
vAlpha = 0.8;
vec4 mvPosition = modelViewMatrix * vec4(position, 1.0);
gl_PointSize = size * (300.0 / -mvPosition.z);
gl_Position = projectionMatrix * mvPosition;
}
`,
fragmentShader: `
varying float vAlpha;
void main() {
float dist = distance(gl_PointCoord, vec2(0.5));
if (dist > 0.5) discard;
gl_FragColor = vec4(1.0, 1.0, 1.0, vAlpha);
}
`,
transparent: true,
blending: THREE.AdditiveBlending,
depthWrite: false
});
const stars = new THREE.Points(starGeom, starMat);
scene.add(stars);
// Moon
const moonGeo = new THREE.SphereGeometry(2, 16, 16);
const moonMat = new THREE.MeshStandardMaterial({ color: 0xf0f0f0, emissive: 0x404040 });
const moon = new THREE.Mesh(moonGeo, moonMat);
moon.position.set(-8, 8, -8);
moon.receiveShadow = false;
scene.add(moon);
// Moon glow
const moonLight = new THREE.PointLight(0xffffff, 0.3, 10);
moonLight.position.copy(moon.position);
scene.add(moonLight);
// Ambient light
const ambientLight = new THREE.AmbientLight(0x202030, 0.5);
scene.add(ambientLight);
// Resize handler
window.addEventListener('resize', () => {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
});
// Animation loop
let time = 0;
function animate() {
time += 0.016;
requestAnimationFrame(animate);
// Animate flames
flames.forEach((flame, i) => {
const t = time * flame.userData.speed * (i + 1);
flame.position.y = flame.userData.baseY + Math.sin(t) * 0.1;
flame.scale.y = 0.8 + Math.sin(t * 1.3) * 0.1;
});
// Flicker light intensity
fireLight.intensity = 1.5 + Math.sin(time * 3) * 0.3 + Math.random() * 0.2;
// Sparks animation
sparkMaterial.uniforms.time.value = time;
const sparkPosAttr = sparkGeometry.attributes.position;
for (let i = 0; i < sparkCount; i++) {
const y = Math.sin(time * 2 + i) * 0.3;
sparkPosAttr.setY(i, y);
}
sparkGeometry.attributes.position.needsUpdate = true;
// Rotate sky slowly
sky.rotation.y += 0.001;
controls.update();
renderer.render(scene, camera);
}
animate();
</script>
</body>
</html>