← Back to Articles Directory
AI Models • August 11, 2026 • 2 min read

Nemotron 3.5 Lightning: The Open-Source Barrage Continues

Nvidia has just released their next-generation open-source Nemotron 3.5 Lightning model, and today, we are going to test it in SVG vector design and interactive 3D WebGL coding.

Mohid Mirza

Co-Founder & Lead Programmer of AcceleratedLogic AI

Nvidia has just released their next-generation open-source Nemotron 3.5 Lightning model, and today, we are going to test it.

Model Specs & Overview

Let's go over the specs: it's a 30B parameter Mixture-of-Experts (MoE) model with 3B active parameters, so you can run it on your computer pretty easily. It gets a 24 on the Artificial Analysis Intelligence Index, even the much smaller NVFP4 variant. This is quite low when compared to competitors, but intelligence really isn't what Nvidia is going for here—it's speed.
You can access this model for free on OpenRouter or Nvidia NIM. Just as a heads-up, we're going to be using the AcceleratedLogic AI chat application as the frontend.

Test 1: SVG Vector Generation

Let's start on SVG generation. Here is what it made when asked:
> "Make a SVG of a photorealistic 3D glass sphere containing a fully detailed 3D origami crane. Use realistic gradients, stroke paths, drop shadows, and visual refraction/reflections inside the glass. In one, fully working html file"
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Glass Sphere with Origami Crane</title>
<style>
  body { background: #111; margin: 0; display: flex; align-items: center; justify-content: center; min-height: 100vh; }
  svg { width: 100%; max-width: 500px; }
</style>
</head>
<body>

<svg viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">

  <defs>
    <!-- Glass sphere radial gradient -->
    <radialGradient id="glassGrad" cx="50%" cy="50%" r="60%">
      <stop offset="0%" stop-color="#ffffff" stop-opacity="0.9"/>
      <stop offset="35%" stop-color="#80dfff" stop-opacity="0.6"/>
      <stop offset="100%" stop-color="#00aaff" stop-opacity="0.4"/>
    </radialGradient>

    <!-- Crane body gradient -->
    <linearGradient id="craneGrad" x1="0%" y1="100%" x2="0%" y2="0%">
      <stop offset="0%" stop-color="#ffe0b2"/>
      <stop offset="50%" stop-color="#f88379"/>
      <stop offset="100%" stop-color="#e63946"/>
    </linearGradient>

    <!-- Drop shadow filter -->
    <filter id="dropShadow" x="-20%" y="-20%" width="140%" height="140%">
      <feGaussianBlur in="SourceAlpha" stdDeviation="4"/>
      <feOffset dx="3" dy="3"/>
      <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge>
    </filter>

    <!-- Glass refraction + reflection filter -->
    <filter id="glassEffect">
      <!-- Soft highlight -->
      <feGaussianBlur in="SourceAlpha" stdDeviation="1.2"/>
      <feMerge> <feMergeNode/> <feMergeNode in="SourceGraphic"/> </feMerge>
      <!-- Subtle outer glow -->
      <feGaussianBlur stdDeviation="3" result="blur"/>
      <feMerge> <feMergeNode in="blur"/> <feMergeNode/> </feMerge>
    </filter>

    <!-- Displacement map pattern for refraction simulation -->
    <pattern id="dispMap" width="8" height="8" patternUnits="userSpaceOnUse">
      <rect width="8" height="8" fill="none"/>
      <line x1="0" y1="4" x2="8" y2="4" stroke="#fff" stroke-width="0.5"/>
      <line x1="4" y1="0" x2="4" y2="8" stroke="#fff" stroke-width="0.5"/>
    </pattern>

    <!-- Crane path (stylized origami crane silhouette) -->
    <path id="craneShape" d="M200,300 C180,250 150,200 150,150 C150,100 180,80 200,80 C220,80 250,100 250,150 C250,200 220,250 200,270 Z M200,280 C160,280 130,260 110,230 C90,200 80,160 80,120 C80,90 100,70 130,60 C160,50 200,50 230,60 C260,70 280,90 280,120 C280,160 270,200 250,230 Z M260,220 C240,230 220,250 200,260 C180,250 160,230 140,220 C120,210 100,190 90,170 L100,150 L110,130 L120,140 L130,120 Z" fill="url(#craneGrad)" stroke="#fff" stroke-width="1.5"/>
  </defs>

  <!-- Drop shadow for the entire sphere + crane group -->
  <g filter="url(#dropShadow)">
    <!-- Glass sphere -->
    <circle cx="200" cy="200" r="150" fill="url(#glassGrad)" filter="url(#glassEffect)"/>
    
    <!-- Glass highlight reflection -->
    <path d="M180 150 Q200 120 220 150 L220 180 Q200 200 180 180 Z" fill="rgba(255,255,255,0.3)" />

    <!-- Crane inside the sphere -->
    <g transform="translate(80, 80)">
      <use href="#craneShape"/>
    </g>

    <!-- Optional: subtle refraction ripple over the crane using displacement -->
    <g transform="translate(200, 200) scale(1.5)" filter="url(#glassEffect)">
      <rect width="300" height="300" fill="url(#dispMap)" opacity="0.04"/>
    </g>
  </g>
</svg>

</body>
</html>
Evaluation: This isn't exactly the best output, as it doesn't look like a crane at all, but it is working and definitely is a good effort.

Test 2: Three.js Interactive 3D Globe

Now, when asked:
> "Create a single self-contained HTML file featuring an interactive 3D procedural globe using Three.js via CDN. The globe must have a procedurally generated canvas texture for continents, a translucent atmospheric glow mesh, and an orbiting ring of light particles. Include mouse drag rotation, zoom controls, and a single UI slider overlay to control the globe's continuous rotation speed. Output only valid HTML with no external image assets or console errors."
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Procedural 3D Globe</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            overflow: hidden;
            background: #05050d;
            font-family: sans-serif;
        }
        canvas {
            display: block;
        }
        .ui {
            position: fixed;
            bottom: 20px;
            left: 50%;
            transform: translateX(-50%);
            z-index: 10;
            display: flex;
            align-items: center;
            gap: 10px;
        }
        .ui input {
            width: 220px;
            height: 28px;
            padding: 0 10px;
            font-size: 13px;
        }
        .ui span {
            color: #fff;
            font-size: 13px;
        }
    </style>
</head>
<body>
    <canvas id="globe"></canvas>
    <div class="ui">
        <span>Speed:</span>
        <input type="range" id="rotSpeed" min="0" max="0.1" step="0.001" value="0.005">
        <span id="rotValue">0.005</span>
    </div>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/0.160.0/three.min.js"></script>
    <script>
        const canvas = document.getElementById('globe');
const rotSpeedInput = document.getElementById('rotSpeed');
const rotValueDisplay = document.getElementById('rotValue');

const scene = new THREE.Scene();

const camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 100);
camera.position.set(1.5, 2.6, 0);

const renderer = new THREE.WebGLRenderer({ canvas, antialias: true });
renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setPixelRatio(window.devicePixelRatio);
renderer.clearColor = 0x05050d;

// --- Procedural globe texture ---
const globeRadius = 1;
const globeGeo = new THREE.SphereGeometry(globeRadius, 64, 64);

const canvasTex = document.createElement('canvas');
canvasTex.width = 512;
canvasTex.height = 512;
const ctx = canvasTex.getContext('2d');
ctx.fillStyle = '#0d47a1';
ctx.fillRect(0, 0, 512, 512);
ctx.translate(0, canvasTex.height);
ctx.scale(1, -1);
const landCount = 10;
const landColors = ['#2e7d32', '#555', '#a1887f', '#d7ccc8'];
for (let i = 0; i < landCount; i++) {
const x = Math.random() * 512;
const y = Math.random() * 512;
const r = Math.random() * 90 + 60;
ctx.fillStyle = landColors[i % landColors.length];
ctx.beginPath();
ctx.arc(x, y, r, 0, Math.PI * 2);
ctx.fill();
}
ctx.setTransform(1, 0, 0, 1, 0, 0);

const tex = new THREE.Texture(canvasTex);
tex.needsUpdate = true;
tex.format = THREE.RGBFormat;
tex.magFilter = THREE.LinearFilter;
tex.minFilter = THREE.LinearFilter;

const globe = new THREE.Mesh(globeGeo, new THREE.MeshBasicMaterial({ map: tex }));
scene.add(globe);

// --- Atmospheric glow ---
const glowGeo = new THREE.SphereGeometry(globeRadius * 1.03, 64, 64);
const glow = new THREE.Mesh(glowGeo, new THREE.MeshBasicMaterial({
color: 0xffa726,
transparent: true,
opacity: 0.35,
blending: THREE.AdditiveBlending
}));
scene.add(glow);

// --- Orbiting ring of light particles ---
const particleCount = 150;
const particlePositions = new Float32Array(particleCount * 3);
const particleColors = new Float32Array(particleCount * 3);
const particleSizes = new Float32Array(particleCount);

for (let i = 0; i < particleCount; i++) {
const theta = (i / particleCount) Math.PI 2;
const radius = 1.05 + Math.random() * 0.05;
const y = (Math.random() - 0.5) * 0.1;
particlePositions[i 3] = Math.cos(theta) radius;
particlePositions[i * 3 + 1] = y;
particlePositions[i 3 + 2] = Math.sin(theta) radius;

const h = 0.1 + Math.random() * 0.05;
const c = new THREE.Color().setHSL(h, 0.5, 0.85);
particleColors[i * 3] = c.r;
particleColors[i * 3 + 1] = c.g;
particleColors[i * 3 + 2] = c.b;

particleSizes[i] = Math.random() * 0.08 + 0.02;
}

const particleGeo = new THREE.BufferGeometry();
particleGeo.setAttribute('position', new THREE.BufferAttribute(particlePositions, 3));
particleGeo.setAttribute('color', new THREE.BufferAttribute(particleColors, 3));
particleGeo.setAttribute('size', new THREE.BufferAttribute(particleSizes, 1));

const particleMat = new THREE.PointsMaterial({
size: 0.04,
vertexColors: true,
transparent: true,
opacity: 0.9,
blending: THREE.AdditiveBlending,
depthWrite: false
});
const particles = new THREE.Points(particleGeo, particleMat);
scene.add(particles);

// --- Custom orbit controls (mouse drag rotate, scroll zoom) ---
let dragging = false;
let lastMouseX = 0, lastMouseY = 0;
let orbitRadius = 3;
let azimuth = 0;
let polar = Math.PI / 6;

function updateCamera() {
camera.position.x = orbitRadius Math.sin(polar) Math.cos(azimuth);
camera.position.y = orbitRadius * Math.cos(polar);
camera.position.z = orbitRadius Math.sin(polar) Math.sin(azimuth);
camera.lookAt(0, 0, 0);
}

updateCamera();

window.addEventListener('mousedown', e => {
dragging = true;
lastMouseX = e.clientX;
lastMouseY = e.clientY;
});

window.addEventListener('mousemove', e => {
if (!dragging) return;
const dx = e.clientX - lastMouseX;
const dy = e.clientY - lastMouseY;
azimuth -= dx * 0.005;
polar = Math.max(0.02, Math.PI - 0.02, polar - dy * 0.005);
lastMouseX = e.clientX;
lastMouseY = e.clientY;
updateCamera();
});

window.addEventListener('wheel', e => {
orbitRadius -= e.deltaY * 0.0005;
orbitRadius = Math.max(1.5, Math.min(10, orbitRadius));
updateCamera();
}, { passive: false });

window.addEventListener('mouseup', () => dragging = false);
window.addEventListener('mouseleave', () => dragging = false);

// --- Rotation speed slider ---
let globeSpinSpeed = 0.005;
rotSpeedInput.addEventListener('input', e => {
globeSpinSpeed = parseFloat(e.target.value);
rotValueDisplay.textContent = globeSpinSpeed.toFixed(4);
});

// --- Animation ---
const clock = new THREE.Clock();

function animate() {
requestAnimationFrame(animate);
const delta = clock.getDelta();

globe.rotation.y += globeSpinSpeed * delta;
particles.rotation.y += 0.003 * delta;

updateCamera();
renderer.render(scene, camera);
}
animate();

// --- Resize ---
window.addEventListener('resize', () => {
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
updateCamera();
});
    </script>
</body>
</html>
Evaluation: It doesn't even work, so it's definitely a fail.

Technical Analysis: Why the Code Failed

Inspecting the raw generation reveals why Nemotron's 3D code crashed during execution:
1. **Missing Arithmetic Operators (*): The model dropped multiplication symbols in mathematical loops ((i / particleCount) Math.PI 2 and orbitRadius Math.sin(polar)), causing immediate Uncaught SyntaxError halts. 2. Deprecated API Properties: The code attempted to assign THREE.RGBFormat, which was deprecated and completely removed in Three.js r160. 3. Incorrect Bounds Clamping:** The polar angle clamping in mouse movement used Math.max incorrectly across three arguments, breaking drag rotation.

Final Verdict

Overall, in our testing, it was a pretty good AI model, but not for complex coding. If you just need a light, fast orchestrator model, or something for general chat, it's great.
Overall Score: 7 / 10