Kenzo Basar

Posted on Jul 26

🚀 Kenzo Graphics Library v2 – Build Lightweight 2D/3D Apps Without Dependencies

#webdev #javascript #rendering #engine

*KGL (Kenzo Graphics Library v2)* is a lightweight, math-based 2D/3D rendering engine made for the web. Designed with speed and simplicity in mind, it allows you to create browser-based visual applications with no external dependencies—just a and JavaScript.

✨ Why I Built KGL

As a developer who hates bloatware and overly complex engines, I wanted something fast, small, dependency-free, and still powerful enough to handle 3D scenes, voxel rendering, and UI overlays. So, I built KGL — a clean canvas-based engine that helps you go from idea to visuals in seconds.

🔧 Key Features

🚫 Zero Dependencies: No Three.js, no Babylon.js, no WebGL shaders.

🎮 2D & 3D Support: Render both flat UIs and rotating cubes in one canvas.

🧱 Voxel Engine: Chunk-style voxel rendering for sandbox-style games.

👾 Entity System: Position, animate, and update 3D objects easily.

🖱️ UI Overlay (KglUI + KglHTSTB): Build menus and overlays using HTML-like tags.

🛠️ Custom Math Engine: Pure math-based transformations (no GPU trickery).

📦 Installation

You can install KGL from npm:

npm install kenzo-graphics-library-v2
Or use JSdelivr KGL.js

You can also download manually: Manual Download

🧪 Sample Code
Here's how easy it is to create a rotating cube using Kgl:

const canvas = document.getElementById('myCanvas');
const engine = new Kgl(canvas);

const cube = new KGLentity.Cube({ x: 0, y: 0, z: 0 }, 50, '#00FF00');

function loop() {
  engine.clear();
  cube.rotateY(0.03);
  engine.drawEntity(cube);
  requestAnimationFrame(loop);
}

loop();

*✔️ No setup. No WebGL context. Just you, canvas, and code.*

🌍 Try the Demo

👉 Try out KGL Live
👉 Browse on github

🧱 Module Overview

Kgl - Main renderer and engine core
Kgl2D - 2D drawing helpers
KglUI - HTML-style GUI system for canvas
KGLvoxel - Chunk-based voxel renderer
KGLentity - Cube/sphere/shape entity renderer
KGLscenes - Scene management (load/unload)
KGLconfig - Configure engine compatibility
KglHTSTB - Lightweight HTML-style textbox builder

🧠 Who Is It For?

Developers making custom game engines
Students building canvas-based simulations
Creators who want to avoid WebGL/GLSL complexity
OS developers who need a browser-based GUI renderer

⚠️ Not for...

This is *not* a replacement for full engines like *Three.js* or *Unity WebGL*. KGL is meant for lightweight, fast, and experimental development.

🔄 Roadmap

✅ KGLv2 Complete
📦 KGL on NPM
🧩 Plugin System
🌐 Built-in Scene Editor (Prototype)
📊 Benchmark & GPU fallback (Planned)

🙌 Support & Contributions

If you like what I’m doing, you can:

⭐ Star the repo
🐛 File issues
📢 Share the project

💬 Final Words

KGL started as a *hobby project*, but I believe it can help others who want control, speed, and simplicity in their graphics projects. If you're building something cool with it — let me know!

*Happy rendering! 🎨*

— Kenzo

DEV Community