diff --git a/index.html b/index.html
new file mode 100644
index 0000000000..79689495a5
--- /dev/null
+++ b/index.html
@@ -0,0 +1,25 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>P5 Sketch</title>
+  <!-- Add full p5.js with WebGL support -->
+  <script src="lib/p5.js"></script>
+
+  <script src="test_tint.js"></script>
+  <style>
+    #debug {
+      position: fixed;
+      top: 10px;
+      left: 10px;
+      background: #333;
+      color: white;
+      padding: 10px;
+      font-family: monospace;
+    }
+  </style>
+</head>
+<body>
+  <div id="debug"></div>
+</body>
+</html>
diff --git a/src/image/loading_displaying.js b/src/image/loading_displaying.js
index c0ce679117..c2d439028e 100644
--- a/src/image/loading_displaying.js
+++ b/src/image/loading_displaying.js
@@ -1378,7 +1378,7 @@ p5.prototype.tint = function(...args) {
  * </div>
  */
 p5.prototype.noTint = function() {
-  this._renderer._tint = null;
+  this._renderer._tint = [255, 255, 255, 255];
 };
 
 /**
@@ -1501,4 +1501,4 @@ p5.prototype.imageMode = function(m) {
   }
 };
 
-export default p5;
+export default p5;
\ No newline at end of file
diff --git a/src/webgl/p5.RendererGL.js b/src/webgl/p5.RendererGL.js
index d3864a8171..b4c3cf7b47 100644
--- a/src/webgl/p5.RendererGL.js
+++ b/src/webgl/p5.RendererGL.js
@@ -2545,4 +2545,4 @@ p5.prototype._assert3d = function (name) {
 
 p5.RendererGL.prototype.tessyVertexSize = 12;
 
-export default p5.RendererGL;
+export default p5.RendererGL;
\ No newline at end of file
diff --git a/src/webgl/p5.Shader.js b/src/webgl/p5.Shader.js
index a82f112361..0c94952bca 100644
--- a/src/webgl/p5.Shader.js
+++ b/src/webgl/p5.Shader.js
@@ -1494,4 +1494,4 @@ p5.Shader = class {
   }
 };
 
-export default p5.Shader;
+export default p5.Shader;
\ No newline at end of file
diff --git a/src/webgl/shaders/basic.frag b/src/webgl/shaders/basic.frag
index e583955d36..56b45ce180 100644
--- a/src/webgl/shaders/basic.frag
+++ b/src/webgl/shaders/basic.frag
@@ -3,4 +3,4 @@ void main(void) {
   HOOK_beforeFragment();
   OUT_COLOR = HOOK_getFinalColor(vec4(vColor.rgb, 1.) * vColor.a);
   HOOK_afterFragment();
-}
+}
\ No newline at end of file
diff --git a/test_tint.js b/test_tint.js
new file mode 100644
index 0000000000..89a49fe0d4
--- /dev/null
+++ b/test_tint.js
@@ -0,0 +1,52 @@
+let img;
+let tintOn = true;
+let button;
+
+function preload() {
+  img = loadImage('testfile.png');
+}
+
+function setup() {
+  createCanvas(600, 400);
+  
+  // Create button
+  button = createButton('Toggle Tint');
+  button.position(10, height + 10);
+  button.mousePressed(toggleTint);
+  
+  // Initial button styling
+  button.style('background-color', '#4CAF50');
+  button.style('color', 'white');
+  button.style('padding', '10px 20px');
+  button.style('border', 'none');
+  button.style('border-radius', '4px');
+  button.style('cursor', 'pointer');
+}
+
+function draw() {
+  background(220);
+  
+  // Apply tint if enabled
+  if (tintOn) {
+    tint(255, 0, 0); // Red tint
+  } else {
+    noTint();
+  }
+  
+  // Draw image centered
+  imageMode(CENTER);
+  image(img, width/2, height/2);
+  
+  // Add text to show current state
+  noTint();  // Reset tint for text
+  fill(0);
+  textSize(16);
+  textAlign(LEFT, TOP);
+  text('Tint: ' + (tintOn ? 'ON' : 'OFF'), 10, 10);
+}
+
+function toggleTint() {
+  tintOn = !tintOn;
+  // Update button color based on state
+  button.style('background-color', tintOn ? '#4CAF50' : '#f44336');
+}
diff --git a/testfile.png b/testfile.png
new file mode 100644
index 0000000000..57471d59f7
Binary files /dev/null and b/testfile.png differ