diff --git a/js/data/consts.js b/js/data/consts.js
index c049d25..275578f 100644
--- a/js/data/consts.js
+++ b/js/data/consts.js
@@ -4,4 +4,7 @@ const MAX_Z_INDEX = 5000;
 // Index of the first layer the user can use in the layers array
 const firstUserLayerIndex = 2;
 
-const MIN_ZOOM_LEVEL = 0.5;
\ No newline at end of file
+const MIN_ZOOM_LEVEL = 0.5;
+
+const MAX_CANVAS_SIZE = 3000;
+const MIN_CANVAS_SIZE = 0;
\ No newline at end of file
diff --git a/js/pixel-editor.js b/js/pixel-editor.js
index d0a9052..2ee7fcb 100644
--- a/js/pixel-editor.js
+++ b/js/pixel-editor.js
@@ -84,9 +84,11 @@ window.onload = function () {
         // apply a listener to each input
         for (let i = 0; i < canvasSizeInputs.length; i++) {
             canvasSizeInputs[i].addEventListener('keyup', e => {
-                const maxCanvasSize = 5000;
-                if (e.target.value > maxCanvasSize) {
-                    e.target.value = maxCanvasSize;
+            
+                if (e.target.value > MAX_CANVAS_SIZE) {
+                    e.target.value = MAX_CANVAS_SIZE;
+                } else if (e.target.value < MIN_CANVAS_SIZE) {
+                    e.target.value = MIN_CANVAS_SIZE;
                 }
             }, true);
         }
@@ -163,10 +165,6 @@ window.onload = function () {
     }
 }
 
-function validateInput(canvasSize) {
-    console.log(canvasSize);
-}  
-
 //prevent user from leaving page with unsaved data
 // window.onbeforeunload = function() {
 //     if (EditorState.documentCreated)
diff --git a/views/popups/canvas-resize.hbs b/views/popups/canvas-resize.hbs
index 0904bbb..2cc9705 100644
--- a/views/popups/canvas-resize.hbs
+++ b/views/popups/canvas-resize.hbs
@@ -17,16 +17,21 @@
 	</span>
 	<!-- SIZE-->
 	<span id="rc-size-menu">
-		<h2>Size</h2>
+		<div>
+		<h2 style="text-align:initial">Size</h2>
+		<h4 class="max-canvas-size">Max canvas size is 3000 x 3000</h4>
+		</div>
 		<div>
 			<span>
 				Width: <input id="rc-width" type="number" default="0" step="1" 
-				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
+				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"
+				class="size-input" type="number" min="0" max="5000"/>
 			</span>
 			
 			<span>
 				Height: <input id="rc-height" default="0" step="1" type="number" 
-				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
+				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"
+				class="size-input" type="number" min="0" max="5000"/>
 			</span>
 		</div>
 	</span>        
diff --git a/views/popups/new-pixel.hbs b/views/popups/new-pixel.hbs
index bdcc39f..a1ca3fc 100644
--- a/views/popups/new-pixel.hbs
+++ b/views/popups/new-pixel.hbs
@@ -9,8 +9,8 @@
 	<div id="preset-menu" class="dropdown-menu"></div>
 
 	<h2>Size</h2>
-	<h4 class="max-canvas-size">Max canvas size is 5000 x 5000</h4>
-	<input id="size-width" class="size-input" type="number" min="1" max="5000" value="{{#if width}}{{width}}{{else}}64{{/if}}" autocomplete="off" />{{svg "x.svg" width="16" height="16" class="dimentions-x"}}<input id="size-height" class="size-input" value="{{#if height}}{{height}}{{else}}64{{/if}}" autocomplete="off" />
+	<h4 class="max-canvas-size">Max canvas size is 3000 x 3000</h4>
+	<input id="size-width" class="size-input" type="number" min="0" max="5000" value="{{#if width}}{{width}}{{else}}64{{/if}}" autocomplete="off" />{{svg "x.svg" width="16" height="16" class="dimentions-x"}}<input id="size-height" class="size-input" value="{{#if height}}{{height}}{{else}}64{{/if}}" autocomplete="off"  type="number" min="0" max="5000" />
 	<h2>Palette</h2>
 	<button id="palette-button" class="dropdown-button">Choose a palette...</button>
 	<div id="palette-menu" class="dropdown-menu"><button id="no-palette-button">Empty Palette</button><button id="load-palette-button">Load palette...</button></div>
diff --git a/views/popups/splash-page.hbs b/views/popups/splash-page.hbs
index 9a63ef5..e7b1bbf 100644
--- a/views/popups/splash-page.hbs
+++ b/views/popups/splash-page.hbs
@@ -24,9 +24,9 @@
 				<h1>New Custom Pixel</h1>
 
 				<h2>Size</h2>
-				<h4 class="max-canvas-size">Max canvas size is 5000 x 5000</h4>
+				<h4 class="max-canvas-size">Max canvas size is 3000 x 3000</h4>
 				<div class="sp-np-entry">
-					<input id="size-width-splash" value="{{#if width}}{{width}}{{else}}64{{/if}}" autocomplete="off" class="size-input" type="number" min="1" max="5000"/>{{svg "x.svg" width="16" height="16" class="dimentions-x"}}<input id="size-height-splash" value="{{#if height}}{{height}}{{else}}64{{/if}}" autocomplete="off" class="size-input" type="number" min="1" max="5000"/>
+					<input id="size-width-splash" value="{{#if width}}{{width}}{{else}}64{{/if}}" autocomplete="off" class="size-input" type="number" min="0" max="5000"/>{{svg "x.svg" width="16" height="16" class="dimentions-x"}}<input id="size-height-splash" value="{{#if height}}{{height}}{{else}}64{{/if}}" autocomplete="off" class="size-input" type="number" min="0" max="5000"/>
 				</div>
 				
 				<h2>Palette</h2>
diff --git a/views/popups/sprite-resize.hbs b/views/popups/sprite-resize.hbs
index 9172a2d..3a34686 100644
--- a/views/popups/sprite-resize.hbs
+++ b/views/popups/sprite-resize.hbs
@@ -4,16 +4,19 @@
 	<h1>Scale sprite</h1>
 	<!-- SIZE-->
 	<h2>New size</h2>
+	<h4 class="max-canvas-size">Max canvas size is 3000 x 3000</h4>
 	<span id="rs-size-menu">
 		<div>
 			<span>
 				Width: <input id="rs-width" type="number" default="0" step="1" 
-				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
+				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"
+				class="size-input" type="number" min="0" max="5000"/>
 			</span>
 			
 			<span>
 				Height: <input id="rs-height" default="0" step="1" type="number" 
-				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"/>
+				value="{{#if border}}{{border}}{{else}}0{{/if}}" autocomplete="off"
+				class="size-input" type="number" min="0" max="5000"/>
 			</span>
 		</div>
 	</span>