diff --git a/.github/workflows/ccpp.yml b/.github/workflows/ccpp.yml
index 7bd3efbd7..4d5a781a6 100644
--- a/.github/workflows/ccpp.yml
+++ b/.github/workflows/ccpp.yml
@@ -1,4 +1,4 @@
-name: C/C++ CI
+name: Checkers
 
 on: [push, pull_request]
 
diff --git a/.github/workflows/docs.yml b/.github/workflows/docs.yml
index bcb5701e4..bea97e11a 100644
--- a/.github/workflows/docs.yml
+++ b/.github/workflows/docs.yml
@@ -1,22 +1,36 @@
-name: Documentation on github.io
+name: Docs, Webverion and Deploy
 
-on:
-  push:
-    branches: [ master ]
+on: [push, pull_request]
 
 jobs:
-  build-documentation:
+  build:
     runs-on: ubuntu-latest
     steps:
     - name: checkout
       uses: actions/checkout@v4
-    - name: apt-update
-      run: sudo apt-get update -qq
-    - name: apt-get doxygen
-      run: sudo apt-get install -y doxygen
+      #Documentation
+    - name: Install packages for docs
+      run: |
+        sudo apt-get update -qq
+        sudo apt-get install -y doxygen
     - name: build doc
       run: make docs
-    - name: deploy
+      #Webversion
+    - name: Install packages for webver
+      run: |
+        sudo apt-get update -qq
+        sudo apt-get install -y make
+    - name: Setup Emscripten SDK
+      uses: mymindstorm/setup-emsdk@v14
+    - name: Verify Emscripten
+      run: emcc -v
+    - name: Build SDL3 port for Emscripten
+      run: embuilder build sdl3
+    - name: Build webversion
+      run: make webver
+      #Deploy to GitHub Pages
+    - name: Deploy to GitHub Pages
+      if: ${{ github.event_name == 'push' && (github.ref == 'refs/heads/master' || github.ref == 'refs/heads/feat/webver') }}
       uses: peaceiris/actions-gh-pages@v4
       with:
         github_token: ${{ secrets.GITHUB_TOKEN }}
diff --git a/Makefile b/Makefile
index 0bf29ab51..bbbe5eeed 100644
--- a/Makefile
+++ b/Makefile
@@ -5,9 +5,18 @@
 
 ## path stuff
 DOCS_PATH:=./doc
+# Convenience shortcut to docs output path (as defined in Doxyfile)
+DOCS_OUT:=$(DOCS_PATH)/html
+
 DEMO_PATH=demo
 SRC_PATH=src
 
+WEBVER_BACKEND:=./demo/sdl3_renderer
+WEBVER_SITE:=./webver/site
+WEBVER_OUT:=$(DOCS_OUT)/webver
+WEBVER_CFLAGS:=-O2 -DINCLUDE_ALL -sEXPORTED_RUNTIME_METHODS=requestFullscreen
+#Possible choice: ccall,cwrap,requestFullscreen,FS
+WEBVER_CFLAGS+=${CFLAGS}
 
 ## Documents settings
 DOXYFILE:=$(DOCS_PATH)/Doxyfile
@@ -37,15 +46,16 @@ DEMO_LIST = $(shell find $(DEMO_PATH) -type f -name Makefile -printf "%h ")
 ######################################################################################
 
 
-.PHONY: usage all demos $(DEMO_LIST)
+.PHONY: usage all demos webver $(DEMO_LIST)
 
 usage:
-	echo "make docs		to create documentation"
-	echo "make nuke		to rebuild the single header nuklear.h from source"
-	echo "make demos	to build all of the demos"
-	echo "make all 		to re-pack the header and create documentation"
+	@echo "make docs		to create documentation"
+	@echo "make webver		to build webversion on SDL3 + Emscripten (try to run 'embuilder build sdl3' if first time)"
+	@echo "make nuke		to rebuild the single header nuklear.h from source"
+	@echo "make demos		to build all of the demos"
+	@echo "make all 		to re-pack the header and create documentation"
 
-all: docs nuke demos 
+all: docs webver nuke demos 
 demos: $(DEMO_LIST)
 
 
@@ -57,14 +67,12 @@ nuke: $(addprefix $(SRC_PATH)/, $(SRC))
 
 
 
-
-
 ########################################################################################
 ##   Docs
 
-docs: $(DOCS_PATH)/html/index.html 
+docs: $(DOCS_OUT)/index.html 
 
-$(DOCS_PATH)/html/index.html: $(DOCS_PATH)/doxygen-awesome-css/doxygen-awesome.css $(DOXYFILE)
+$(DOCS_OUT)/index.html: $(DOCS_PATH)/doxygen-awesome-css/doxygen-awesome.css $(DOXYFILE)
 	doxygen $(DOXYFILE)
 
 $(DOXYFILE):
@@ -75,6 +83,16 @@ $(DOCS_PATH)/doxygen-awesome-css/doxygen-awesome.css:
 
 
 
+########################################################################################
+##   webver
+
+webver: 
+	mkdir -p $(WEBVER_OUT)
+	emmake make -C $(WEBVER_BACKEND) CFLAGS="$(WEBVER_CFLAGS)" BIN=$(abspath $(WEBVER_OUT)/demo_sdl3_renderer.js) TEMPDIR=$(abspath $(WEBVER_OUT))
+	cp -r $(WEBVER_SITE)/* $(WEBVER_OUT)/
+#[NOTE]We pass TEMPDIR directly for hide a potential issue 
+
+
 ########################################################################################
 ##   Demos
 
@@ -87,4 +105,4 @@ $(DEMO_LIST):
 ##   Utility helpers
 
 clean:
-	rm -rf $(DOCS_PATH)/html $(OUTPUT)
+	rm -rf $(DOCS_OUT) $(OUTPUT)
diff --git a/Readme.md b/Readme.md
index e535a5ec7..b109adc9f 100644
--- a/Readme.md
+++ b/Readme.md
@@ -11,6 +11,8 @@ draw commands describing primitive shapes as output. So instead of providing a
 layered library that tries to abstract over a number of platform and
 render backends, it focuses only on the actual UI.
 
+<a href="https://immediate-mode-ui.github.io/Nuklear/webver" target="_blank">Try Nuklear in Browser</a>
+
 ## Features
 
 - Immediate-mode graphical user interface toolkit
diff --git a/src/HEADER.md b/src/HEADER.md
index 60b24788c..33b081a61 100644
--- a/src/HEADER.md
+++ b/src/HEADER.md
@@ -34,6 +34,10 @@ commands describing primitive shapes as output. So instead of providing a
 layered library that tries to abstract over a number of platform and
 render backends it only focuses on the actual UI.
 
+<a href="webver/index.html" target="_blank">Try Nuklear in Browser</a>
+
+Nuklear in a <a href="webver/minshell.html" target="_blank">minimal shell</a> is also provided for compatibility and testing
+
 ## Highlights
 - Graphical user interface toolkit
 - Single header library
diff --git a/webver/Readme.md b/webver/Readme.md
new file mode 100644
index 000000000..24f41826d
--- /dev/null
+++ b/webver/Readme.md
@@ -0,0 +1,22 @@
+Webversion notes
+===
+
+## Terminology
+
+**Webversion** (or **webver** for short) is a demonstration of Nuklear being run in the browser via Emscripten.
+Currently it supports only the SDL3 backend, but long-term, additional backends may be added.
+
+We use the consistent term **webversion** because it is already referenced across other files and may appear in user-created issues and pull requests.
+
+## Folder Structure
+
+We use the `site` subfolder to store all public webversion files.
+Current folder contains **internal** files for webversion support that do not need to be published.
+
+## Update Policy
+
+The webversion is auto-updated through CI/CD workflow scripts. Any push triggers an automated build and deployment process, so no manual steps are required.
+
+## About Logo
+
+The Nuklear logo was suggested by Rafał Jopek and published in [issue #401](https://github.com/Immediate-Mode-UI/Nuklear/issues/401#issuecomment-2066737874)
diff --git a/webver/site/emscripten_logo.png b/webver/site/emscripten_logo.png
new file mode 100644
index 000000000..8bb832f34
Binary files /dev/null and b/webver/site/emscripten_logo.png differ
diff --git a/webver/site/favicon.ico b/webver/site/favicon.ico
new file mode 100644
index 000000000..1263aeb15
Binary files /dev/null and b/webver/site/favicon.ico differ
diff --git a/webver/site/index.html b/webver/site/index.html
new file mode 100644
index 000000000..9de4c3404
--- /dev/null
+++ b/webver/site/index.html
@@ -0,0 +1,295 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Nuklear Emscripten Demo</title>
+    <link rel="icon" type="image/x-icon" href="favicon.ico">
+    <link rel="home" href="https://github.com/Immediate-Mode-UI/Nuklear">
+    <meta name="description" content="Run Nuklear demos in the browser with Emscripten">
+    <meta name="author" content="Initially created by PavelSharp(https://github.com/PavelSharp) (2026.02.11)">
+    <!--This work is released under Public Domain-->
+    <!--Inspired by Emscripten default shell, see https://github.com/emscripten-core/emscripten/blob/main/html/shell.html-->
+    <!--The purpose of this shell is to provide a visually polished, production-quality showcase for Nuklear demos-->
+    <style>
+        /*================================
+                    BASIC SECTION
+        ==================================*/
+        html, body {
+            width: 100%;
+            height: 100%;
+        }
+
+        * {
+            padding: 0;
+            margin: 0;
+            box-sizing: border-box;
+            scrollbar-width: thin; /* Firefox */
+        }
+
+        /*================================
+                    TAG SECTION
+        ==================================*/
+        body {
+            font-family: arial;
+            background: #222;
+            scrollbar-color: #555 #111;
+        }
+
+        button {
+            -webkit-tap-highlight-color: transparent;
+            background: #444;
+            color: white;
+            border: 1px solid #666;
+            padding: 6px 12px;
+            cursor: pointer;
+        }
+
+        @media (hover:hover) {
+            button:hover {
+                background: #555;
+            }
+        }
+
+        input[type="checkbox"] {
+            display: none;
+        }
+
+            input[type="checkbox"]:checked + button {
+                background: #762F84; /*#256839*/
+                border-color: #A245B2; /*#38935E*/
+            }
+
+        #app {
+            display: flex;
+            flex-direction: column;
+            height: 100%;
+        }
+
+        /*================================
+                    HEADER SECTION
+        ==================================*/
+        #header {
+            display: flex;
+            justify-content: flex-start;
+            align-items: center;
+            flex-wrap: wrap;
+            padding: 4px 7px;
+            gap: 5px;
+            background: #333;
+            color: white;
+        }
+
+        .header-clickable-logo {
+            display: flex;
+            align-items: center;
+            height: 70px;
+        }
+
+            .header-clickable-logo img {
+                object-fit: contain;
+                display: block;
+                height: 100%;
+                width: auto;
+                max-width: 300px;
+            }
+
+        .header-spacer {
+            flex: 1;
+        }
+
+        /*================================
+                    MAIN SECTION
+        ==================================*/
+        main {
+            flex: 1;
+            background: #222;
+            overflow: auto;
+            display: flex;
+        }
+
+        #main-canvas-block {
+            display: flex;
+            border: 1px solid #555;
+        }
+
+            #main-canvas-block:not(.fixed) {
+                flex: 1 1 auto;
+            }
+
+            #main-canvas-block.fixed {
+                flex: 0 0 auto;
+                width: var(--canvas-fixed-width);
+                height: var(--canvas-fixed-height);
+            }
+
+            /* the canvas *must not* have any border or padding, or mouse coords will be wrong */
+            #main-canvas-block canvas {
+                width: 100%;
+                height: 100%;
+                border: 0;
+            }
+
+        #app:has(#consoleshow-toggle:not(:checked)) #footer-console {
+            display: none;
+        }
+
+        /*================================
+                    FOOTER SECTION
+        ==================================*/
+        #footer-console {
+            padding: 3px;
+            width: 100%;
+            height: 3.5lh;
+            font-family: 'Lucida Console', Monaco, monospace;
+            font-size: 12px;
+            line-height: 1.4;
+            overflow-y: auto;
+            white-space: pre-wrap;
+            overflow-wrap: break-word;
+        }
+
+            #footer-console > .line {
+                display: block;
+                margin: 0;
+                padding: 0;
+            }
+
+                #footer-console > .line.ok {
+                    color: #ddd;
+                }
+
+                #footer-console > .line.error {
+                    color: #ff5555;
+                }
+    </style>
+    <script>
+        class UIConsole {
+            constructor(container, toggle) {
+                this.container = container;
+                this.toggle = toggle;
+                this.line_style = "line";
+                this.ok_style = "ok";
+                this.error_style = "error";
+            }
+            #append(text, style) {
+                this.toggle.checked = true;
+                const line = document.createElement('div');
+                line.textContent = String(text);//textContent protects from XSS attacks
+                line.classList.add(this.line_style, style);
+                this.container.appendChild(line);
+                line.scrollIntoView({ behavior: 'smooth', block: 'end' });
+            }
+            print(text) { this.#append(text, this.ok_style); }
+            print_error(text) { this.#append(text, this.error_style); }
+        }
+
+        class EmscriptenLogMonitor {
+            constructor(uiconsole) {
+                this.uiconsole = uiconsole;
+                this.total_depends = 0;
+            }
+            report_dependencies(left) {
+                if (!this.total_depends) this.total_depends = left;
+                const msg = left ? 'Preparing... (' + (this.total_depends - left) + '/' + this.total_depends + ')' : 'All downloads complete.';
+                console.log(`[dependencies] ${msg}`);
+                if (!left) this.total_depends = 0;
+            }
+            report_status(text) {
+                if (!text) return;
+                console.log(`[status] ${text}`);
+            }
+            report_glcontext_lost() {
+                alert('WebGL context lost. You will need to reload the page.');
+            }
+            report_runtime_initialized() {
+                this.report_status("WASM runtime initialized!")
+            }
+            report_window_error(e) {
+                this.uiconsole.print_error('Exception thrown, see JavaScript console');
+            }
+        }
+
+        document.addEventListener('DOMContentLoaded', function () {
+            const ui = {
+                canvas: document.getElementById('canvas'),
+                console: new UIConsole(document.getElementById('footer-console'), document.getElementById('consoleshow-toggle')),
+                init: function () {
+                    this.ems_monitor = new EmscriptenLogMonitor(this.console);
+                    return this;
+                }
+            }.init();
+            // As a default initial behavior, pop up an alert when webgl context is lost. To make your
+            // application robust, you may want to override this behavior before shipping!
+            // See http://www.khronos.org/registry/webgl/specs/latest/1.0/#5.15.2
+            ui.canvas.addEventListener('webglcontextlost', e => { ui.ems_monitor.report_glcontext_lost(); e.preventDefault(); }, false);
+            window.addEventListener('error', e => {
+                // TODO: do not warn on ok events like simulating an infinite loop or exitStatus
+                ui.ems_monitor.report_window_error(e);
+            });
+            //[NOTE] Manual resize event dispatch seems to work around an Emscripten/SDL3 issue
+            const onresize_observe = () => { requestAnimationFrame(() => { window.dispatchEvent(new Event('resize')); }); }
+            const size_observer = new ResizeObserver(onresize_observe);
+            size_observer.observe(ui.canvas);
+            //TODO[Future]: use MODULARIZE or even EXPORT_ES6
+            window.Module = {
+                canvas: ui.canvas,
+                onRuntimeInitialized: () => { ui.ems_monitor.report_runtime_initialized(); onresize_observe(); },
+                print: text => { ui.console.print(text); console.log(text); },
+                printErr: text => { ui.console.print_error(text); console.error(text); },
+                monitorRunDependencies: left => { ui.ems_monitor.report_dependencies(left); },
+                setStatus: text => { ui.ems_monitor.report_status(text); }
+            };
+            const script = document.createElement('script');
+            script.async = true;
+            script.src = 'demo_sdl3_renderer.js';
+            document.body.appendChild(script);
+        });
+
+        function liveresize_changed(enabled) {
+            const canvas = document.getElementById('main-canvas-block');
+            if (enabled) {
+                canvas.classList.remove('fixed');
+            } else {
+                canvas.style.setProperty('--canvas-fixed-width', canvas.offsetWidth + 'px');
+                canvas.style.setProperty('--canvas-fixed-height', canvas.offsetHeight + 'px');
+                canvas.classList.add('fixed');
+            }
+        }
+
+        function fullscreen_click() {
+            const LOCK_POINTER = false;
+            const RESIZE_CANVAS = true;
+            window.Module.requestFullscreen(LOCK_POINTER, RESIZE_CANVAS);
+        }
+    </script>
+</head>
+<body>
+    <div id="app">
+        <header id="header">
+            <a class="header-clickable-logo" href="https://github.com/Immediate-Mode-UI/Nuklear" target="_blank">
+                <img src="nuklear_logo.png" alt="Nuklear Homepage">
+            </a>
+            <a class="header-clickable-logo" href="http://emscripten.org" target="_blank">
+                <img src="emscripten_logo.png" alt="Powered by Emscripten">
+            </a>
+            <div class="header-spacer"></div>
+            <!--NOTE[Future]: This is a good place to add a combobox for select backend/renderer-->
+            <input type="checkbox" id="liveresize-toggle" checked onchange="liveresize_changed(this.checked)" />
+            <button onclick="this.previousElementSibling.click();">Live resize</button>
+            <input type="checkbox" id="consoleshow-toggle" />
+            <button onclick="this.previousElementSibling.click();">Show console</button>
+            <button onclick="fullscreen_click()">Fullscreen</button>
+        </header>
+        <main>
+            <div id="main-canvas-block">
+                <canvas id="canvas" oncontextmenu="event.preventDefault()" tabindex=-1></canvas>
+            </div>
+        </main>
+        <footer>
+            <div id="footer-console"></div>
+        </footer>
+    </div>
+</body>
+</html>
+
diff --git a/webver/site/minshell.html b/webver/site/minshell.html
new file mode 100644
index 000000000..ead8a0724
--- /dev/null
+++ b/webver/site/minshell.html
@@ -0,0 +1,67 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Nuklear Emscripten Demo with minimal shell</title>
+    <meta name="description" content="Run Nuklear demos in the browser with Emscripten. Our homepage is https://github.com/Immediate-Mode-UI/Nuklear">
+    <meta name="author" content="Initially created by PavelSharp(https://github.com/PavelSharp) (2026.02.11)">
+    <!--This work is released under Public Domain-->
+    <!--Inspired by Emscripten default shell, see https://github.com/emscripten-core/emscripten/blob/main/html/shell.html-->
+    <!--The purpose of this shell is to be minimal and widely compatible-->
+    <style>
+        html, body {
+            width: 100%;
+            height: 100%;
+        }
+
+        * {
+            padding: 0;
+            margin: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            background: #555;
+            padding: 3px;
+        }
+
+        #canvas-block {
+            width: 100%;
+            height: 100%;
+            border: 1px solid red;
+        }
+
+            /* the canvas *must not* have any border or padding, or mouse coords will be wrong */
+            #canvas-block canvas {
+                display: block;
+                width: 100%;
+                height: 100%;
+                border: 0;
+            }
+    </style>
+    <script>
+        document.addEventListener('DOMContentLoaded', function () {
+            var canvas = document.getElementById('canvas');
+            canvas.addEventListener('webglcontextlost', function (e) { alert('WebGL context lost. Please reload the page.'); e.preventDefault(); }, false);
+            window.addEventListener('error', function (e) { alert('Exception thrown, see JavaScript console'); });
+            window.Module = {
+                canvas: canvas,
+                print: function (text) { console.log(text); },
+                printErr: function (text) { console.error(text); },
+                monitorRunDependencies: function (left) { console.log('[dependencies]', left); },
+                setStatus: function (text) { if (text) console.log('[status]', text); }
+            };
+            const script = document.createElement('script');
+            script.async = true;
+            script.src = 'demo_sdl3_renderer.js';
+            document.body.appendChild(script);
+        });
+    </script>
+</head>
+<body>
+    <div id="canvas-block">
+        <canvas id="canvas" oncontextmenu="event.preventDefault()" tabindex="-1"></canvas>
+    </div>
+</body>
+</html>
diff --git a/webver/site/nuklear_logo.png b/webver/site/nuklear_logo.png
new file mode 100644
index 000000000..ceaa00977
Binary files /dev/null and b/webver/site/nuklear_logo.png differ