diff --git a/desktop/sources/index.html b/desktop/sources/index.html
index b97d513..7101695 100644
--- a/desktop/sources/index.html
+++ b/desktop/sources/index.html
@@ -71,11 +71,11 @@
         DOTGRID.controller.add("default","Effect","Thicker +5",() => { DOTGRID.tool.toggle("thickness",5) },"]");
         DOTGRID.controller.add("default","Effect","Thinner -5",() => { DOTGRID.tool.toggle("thickness",-5) },"[");
 
-        DOTGRID.controller.add("default","Manual","Add Point",() => { DOTGRID.tool.add_vertex(DOTGRID.cursor.pos); DOTGRID.guide.update() },"Enter");
-        DOTGRID.controller.add("default","Manual","Move Up",() => { DOTGRID.cursor.pos.y -= 15; DOTGRID.guide.update() },"Up");
-        DOTGRID.controller.add("default","Manual","Move Right",() => { DOTGRID.cursor.pos.x += 15; DOTGRID.guide.update() },"Right");
-        DOTGRID.controller.add("default","Manual","Move Down",() => { DOTGRID.cursor.pos.y += 15; DOTGRID.guide.update() },"Down");
-        DOTGRID.controller.add("default","Manual","Move Left",() => { DOTGRID.cursor.pos.x -= 15; DOTGRID.guide.update() },"Left");
+        DOTGRID.controller.add("default","Manual","Add Point",() => { DOTGRID.tool.add_vertex(DOTGRID.cursor.pos); DOTGRID.renderer.update() },"Enter");
+        DOTGRID.controller.add("default","Manual","Move Up",() => { DOTGRID.cursor.pos.y -= 15; DOTGRID.renderer.update() },"Up");
+        DOTGRID.controller.add("default","Manual","Move Right",() => { DOTGRID.cursor.pos.x += 15; DOTGRID.renderer.update() },"Right");
+        DOTGRID.controller.add("default","Manual","Move Down",() => { DOTGRID.cursor.pos.y += 15; DOTGRID.renderer.update() },"Down");
+        DOTGRID.controller.add("default","Manual","Move Left",() => { DOTGRID.cursor.pos.x -= 15; DOTGRID.renderer.update() },"Left");
         DOTGRID.controller.add("default","Manual","Remove Point",() => { DOTGRID.tool.remove_segments_at(DOTGRID.cursor.pos); },"Shift+Backspace");
         DOTGRID.controller.add("default","Manual","Remove Segment",() => { DOTGRID.tool.remove_segment(); },"Backspace");
 
@@ -87,7 +87,7 @@
         DOTGRID.controller.add("default","Layers","Merge Layers",() => { DOTGRID.tool.merge() },"M");
 
         DOTGRID.controller.add("default","View","Color Picker",() => { DOTGRID.picker.start(); },"G");
-        DOTGRID.controller.add("default","View","Toggle Grid",() => { DOTGRID.guide.toggle(); },"H");
+        DOTGRID.controller.add("default","View","Toggle Grid",() => { DOTGRID.renderer.toggle(); },"H");
 
         DOTGRID.controller.add("default","Theme","Open Theme",() => { DOTGRID.theme.open(); },"CmdOrCtrl+Shift+o")
         DOTGRID.controller.add("default","Theme","Reset Theme",() => { DOTGRID.theme.reset(); },"CmdOrCtrl+Shift+Backspace")
diff --git a/desktop/sources/scripts/cursor.js b/desktop/sources/scripts/cursor.js
index cd229e7..3d20030 100644
--- a/desktop/sources/scripts/cursor.js
+++ b/desktop/sources/scripts/cursor.js
@@ -24,7 +24,7 @@ DOTGRID.Cursor = function () {
       this.translate(this.pos, this.pos, e.shiftKey, e.ctrlKey || e.metaKey, e.altKey)
     }
 
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update()
     e.preventDefault()
   }
@@ -40,7 +40,7 @@ DOTGRID.Cursor = function () {
     }
 
     if (this.last_pos.x != this.pos.x || this.last_pos.y != this.pos.y) {
-      DOTGRID.guide.update()
+      DOTGRID.renderer.update()
     }
 
     DOTGRID.interface.update()
@@ -62,7 +62,7 @@ DOTGRID.Cursor = function () {
     this.translate()
 
     DOTGRID.interface.update()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     e.preventDefault()
   }
 
@@ -83,8 +83,8 @@ DOTGRID.Cursor = function () {
 
   this.pos_relative = function (pos) {
     return {
-      x: pos.x - DOTGRID.guide.el.offsetLeft,
-      y: pos.y - DOTGRID.guide.el.offsetTop
+      x: pos.x - DOTGRID.renderer.el.offsetLeft,
+      y: pos.y - DOTGRID.renderer.el.offsetTop
     }
   }
 
diff --git a/desktop/sources/scripts/dotgrid.js b/desktop/sources/scripts/dotgrid.js
index 3a296d3..faabdd4 100644
--- a/desktop/sources/scripts/dotgrid.js
+++ b/desktop/sources/scripts/dotgrid.js
@@ -17,13 +17,13 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
 
   this.install = function (host) {
     this.manager = new Manager(this)
-    this.guide = new this.Guide()
+    this.renderer = new Renderer(this)
     this.tool = new this.Tool()
     this.interface = new this.Interface()
-    
+
     this.picker = new this.Picker()
     this.cursor = new this.Cursor()
-    host.appendChild(this.guide.el)
+    host.appendChild(this.renderer.el)
 
     this.manager.install()
     this.interface.install(host)
@@ -33,7 +33,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
   this.start = function () {
     this.theme.start()
     this.tool.start()
-    this.guide.start()
+    this.renderer.start()
     this.interface.start()
 
     document.addEventListener('mousedown', function (e) { DOTGRID.cursor.down(e) }, false)
@@ -54,7 +54,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
     DOTGRID.resize()
     DOTGRID.manager.update()
     DOTGRID.interface.update()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   // File
@@ -76,7 +76,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
     fs.readFile(paths[0], 'utf-8', (err, data) => {
       if (err) { alert('An error ocurred reading the file :' + err.message); return }
       this.tool.replace(JSON.parse(data.toString().trim()))
-      this.guide.update()
+      this.renderer.update()
     })
   }
 
@@ -127,10 +127,10 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
     this.grid_width = this.tool.settings.size.width / this.grid_x
     this.grid_height = this.tool.settings.size.height / this.grid_y
 
-    DOTGRID.guide.resize(size)
+    DOTGRID.renderer.resize(size)
 
     this.interface.update()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.set_zoom = function (scale) {
@@ -154,7 +154,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
     this.history.clear()
     this.tool.reset()
     this.reset()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
@@ -176,7 +176,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
     DOTGRID.grid_width = DOTGRID.tool.settings.size.width / DOTGRID.grid_x
     DOTGRID.grid_height = DOTGRID.tool.settings.size.height / DOTGRID.grid_y
 
-    DOTGRID.guide.resize(size)
+    DOTGRID.renderer.resize(size)
 
     document.title = `Dotgrid — ${size.width}x${size.height}`
   }
@@ -196,13 +196,13 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
       const data = e.target && e.target.result ? e.target.result : ''
       if (data && !isJson(data)) { return }
       DOTGRID.tool.replace(JSON.parse(`${data}`))
-      DOTGRID.guide.update()
+      DOTGRID.renderer.update()
     }
     reader.readAsText(file)
   }
 
   this.copy = function (e) {
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
 
     if (e.target !== this.picker.input) {
       e.clipboardData.setData('text/source', DOTGRID.tool.export(DOTGRID.tool.layer()))
@@ -212,11 +212,11 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
       e.preventDefault()
     }
 
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.cut = function (e) {
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
 
     if (e.target !== this.picker.input) {
       e.clipboardData.setData('text/source', DOTGRID.tool.export(DOTGRID.tool.layer()))
@@ -227,7 +227,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
       e.preventDefault()
     }
 
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.paste = function (e) {
@@ -240,7 +240,7 @@ function Dotgrid (width, height, grid_x, grid_y, block_x, block_y) {
       e.preventDefault()
     }
 
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 }
 
diff --git a/desktop/sources/scripts/interface.js b/desktop/sources/scripts/interface.js
index ea50d46..f58858b 100644
--- a/desktop/sources/scripts/interface.js
+++ b/desktop/sources/scripts/interface.js
@@ -72,19 +72,19 @@ DOTGRID.Interface = function () {
     DOTGRID.cursor.operation = {}
     DOTGRID.cursor.operation[type] = name
     this.update(true)
-    DOTGRID.guide.update(true)
+    DOTGRID.renderer.update(true)
   }
 
   this.out = function (type, name) {
     DOTGRID.cursor.operation = ''
-    DOTGRID.guide.update(true)
+    DOTGRID.renderer.update(true)
   }
 
   this.up = function (type, name) {
     if (!DOTGRID.tool[type]) { console.warn(`Unknown option(type): ${type}.${name}`, DOTGRID.tool); return }
 
     this.update(true)
-    DOTGRID.guide.update(true)
+    DOTGRID.renderer.update(true)
   }
 
   this.down = function (type, name) {
@@ -92,7 +92,7 @@ DOTGRID.Interface = function () {
 
     DOTGRID.tool[type](name)
     this.update(true)
-    DOTGRID.guide.update(true)
+    DOTGRID.renderer.update(true)
   }
 
   this.prev_operation = null
@@ -130,10 +130,10 @@ DOTGRID.Interface = function () {
     document.getElementById('option_export').className.baseVal = sum_segments < 1 ? 'icon inactive source' : 'icon source'
     document.getElementById('option_render').className.baseVal = sum_segments < 1 ? 'icon inactive source' : 'icon source'
 
-    document.getElementById('option_grid').className.baseVal = DOTGRID.guide.showExtras ? 'icon inactive source' : 'icon source'
+    document.getElementById('option_grid').className.baseVal = DOTGRID.renderer.showExtras ? 'icon inactive source' : 'icon source'
 
     // Grid
-    if (DOTGRID.guide.showExtras) { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 Q155,65 245,155 M155,125 A30,30 0 0,1 185,155 A30,30 0 0,1 155,185 A30,30 0 0,1 125,155 A30,30 0 0,1 155,125 ') } else { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 ') }
+    if (DOTGRID.renderer.showExtras) { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 Q155,65 245,155 M155,125 A30,30 0 0,1 185,155 A30,30 0 0,1 155,185 A30,30 0 0,1 125,155 A30,30 0 0,1 155,125 ') } else { document.getElementById('grid_path').setAttribute('d', 'M65,155 Q155,245 245,155 M65,155 ') }
 
     // Mirror
     if (DOTGRID.tool.style().mirror_style == 0) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L60,60 L120,120 M180,180 L180,180 L240,240 M210,90 L210,90 L180,120 M120,180 L120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 1) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L240,240 M180,120 L210,90 M120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 2) { document.getElementById('mirror_path').setAttribute('d', 'M210,90 L210,90 L90,210 M60,60 L60,60 L120,120 M180,180 L180,180 L240,240') } else if (DOTGRID.tool.style().mirror_style == 3) { document.getElementById('mirror_path').setAttribute('d', 'M60,60 L60,60 L120,120 L180,120 L210,90 M240,240 L240,240 L180,180 L120,180 L90,210') } else if (DOTGRID.tool.style().mirror_style == 4) { document.getElementById('mirror_path').setAttribute('d', 'M120,120 L120,120 L120,120 L180,120 M120,150 L120,150 L180,150 M120,180 L120,180 L180,180 L180,180 L180,180 L240,240 M120,210 L120,210 L180,210 M120,90 L120,90 L180,90 M60,60 L60,60 L120,120  ') }
diff --git a/desktop/sources/scripts/manager.js b/desktop/sources/scripts/manager.js
index ff1a665..b31d45f 100644
--- a/desktop/sources/scripts/manager.js
+++ b/desktop/sources/scripts/manager.js
@@ -13,13 +13,9 @@ function Manager (dotgrid) {
   this.layers = []
 
   this.install = function () {
-    this.layers[0] = document.createElementNS('http://www.w3.org/2000/svg', 'path')
-    this.layers[1] = document.createElementNS('http://www.w3.org/2000/svg', 'path')
-    this.layers[2] = document.createElementNS('http://www.w3.org/2000/svg', 'path')
-
-    this.el.appendChild(this.layers[2])
-    this.el.appendChild(this.layers[1])
-    this.el.appendChild(this.layers[0])
+    this.el.appendChild(this.layers[2] = document.createElementNS('http://www.w3.org/2000/svg', 'path'))
+    this.el.appendChild(this.layers[1] = document.createElementNS('http://www.w3.org/2000/svg', 'path'))
+    this.el.appendChild(this.layers[0] = document.createElementNS('http://www.w3.org/2000/svg', 'path'))
   }
 
   this.update = function () {
diff --git a/desktop/sources/scripts/picker.js b/desktop/sources/scripts/picker.js
index 87319ed..823f273 100644
--- a/desktop/sources/scripts/picker.js
+++ b/desktop/sources/scripts/picker.js
@@ -46,7 +46,7 @@ DOTGRID.Picker = function () {
 
     try { DOTGRID.controller.set() } catch (err) { console.log('No controller') }
 
-    setTimeout(() => { DOTGRID.interface.update(true); DOTGRID.guide.update() }, 250)
+    setTimeout(() => { DOTGRID.interface.update(true); DOTGRID.renderer.update() }, 250)
   }
 
   this.validate = function () {
diff --git a/desktop/sources/scripts/guide.js b/desktop/sources/scripts/renderer.js
similarity index 98%
rename from desktop/sources/scripts/guide.js
rename to desktop/sources/scripts/renderer.js
index 8106492..2cd3339 100644
--- a/desktop/sources/scripts/guide.js
+++ b/desktop/sources/scripts/renderer.js
@@ -1,6 +1,6 @@
 'use strict'
 
-DOTGRID.Guide = function () {
+function Renderer () {
   this.el = document.createElement('canvas')
   this.el.id = 'guide'
   this.el.width = 640
@@ -21,15 +21,10 @@ DOTGRID.Guide = function () {
     DOTGRID.manager.update()
 
     this.clear()
-
-    this.context.restore()
-
     this.drawMirror()
     this.drawRulers()
-
     this.drawRender()
-
-    this.drawMarkers() 
+    this.drawMarkers()
     this.drawVertices()
     this.drawHandles()
     this.drawTranslation()
@@ -271,7 +266,7 @@ DOTGRID.Guide = function () {
     ctx.restore()
   }
 
-  this.drawRender = function(ctx = this.context){
+  this.drawRender = function (ctx = this.context) {
     let img = new Image()
     img.src = DOTGRID.manager.svg64()
     this.context.drawImage(img, 0, 0, this.el.width, this.el.height)
diff --git a/desktop/sources/scripts/tool.js b/desktop/sources/scripts/tool.js
index 31ce0a1..7e6f397 100644
--- a/desktop/sources/scripts/tool.js
+++ b/desktop/sources/scripts/tool.js
@@ -5,9 +5,9 @@ DOTGRID.Tool = function () {
   this.settings = { size: { width: 300, height: 300 } }
   this.layers = [[], [], []]
   this.styles = [
-    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#f00', fill: 'none', mirror_style: 0, transform:'rotate(45)' },
-    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#0f0', fill: 'none', mirror_style: 0, transform:'rotate(45)' },
-    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#00f', fill: 'none', mirror_style: 0, transform:'rotate(45)' }
+    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#f00', fill: 'none', mirror_style: 0, transform: 'rotate(45)' },
+    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#0f0', fill: 'none', mirror_style: 0, transform: 'rotate(45)' },
+    { thickness: 10, strokeLinecap: 'round', strokeLinejoin: 'round', color: '#00f', fill: 'none', mirror_style: 0, transform: 'rotate(45)' }
   ]
   this.vertices = []
   this.reqs = { line: 2, arc_c: 2, arc_r: 2, arc_c_full: 2, arc_r_full: 2, bezier: 3, close: 0 }
@@ -36,19 +36,19 @@ DOTGRID.Tool = function () {
 
   this.clear = function () {
     this.vertices = []
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
   this.undo = function () {
     this.layers = DOTGRID.history.prev()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
   this.redo = function () {
     this.layers = DOTGRID.history.next()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
@@ -66,7 +66,7 @@ DOTGRID.Tool = function () {
     this.layers[this.index] = this.layers[this.index].concat(layer)
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
@@ -85,7 +85,7 @@ DOTGRID.Tool = function () {
     this.settings = dot.settings
 
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
     DOTGRID.history.push(this.layers)
   }
@@ -97,7 +97,7 @@ DOTGRID.Tool = function () {
 
     this.layer().pop()
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
@@ -115,7 +115,7 @@ DOTGRID.Tool = function () {
       }
     }
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
   }
 
@@ -170,7 +170,7 @@ DOTGRID.Tool = function () {
     DOTGRID.history.push(this.layers)
 
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
 
     console.log(`Casted ${type} -> ${this.layer().length} elements`)
@@ -197,7 +197,7 @@ DOTGRID.Tool = function () {
       console.warn('Unknown', type)
     }
     DOTGRID.interface.update(true)
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.misc = function (type) {
@@ -205,7 +205,7 @@ DOTGRID.Tool = function () {
   }
 
   this.source = function (type) {
-    if (type == 'grid') { DOTGRID.guide.toggle() }
+    if (type == 'grid') { DOTGRID.renderer.toggle() }
     if (type == 'screen') { app.toggle_fullscreen() }
 
     if (type == 'open') { DOTGRID.open() }
@@ -268,7 +268,7 @@ DOTGRID.Tool = function () {
     }
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.translate_multi = function (a, b) {
@@ -284,7 +284,7 @@ DOTGRID.Tool = function () {
 
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.translate_layer = function (a, b) {
@@ -299,7 +299,7 @@ DOTGRID.Tool = function () {
     }
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.translate_copy = function (a, b) {
@@ -316,7 +316,7 @@ DOTGRID.Tool = function () {
 
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   this.merge = function () {
@@ -326,7 +326,7 @@ DOTGRID.Tool = function () {
 
     DOTGRID.history.push(this.layers)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
   }
 
   // Style
@@ -350,7 +350,7 @@ DOTGRID.Tool = function () {
   this.select_layer = function (id) {
     this.index = clamp(id, 0, 2)
     this.clear()
-    DOTGRID.guide.update()
+    DOTGRID.renderer.update()
     DOTGRID.interface.update(true)
     console.log(`layer:${this.index}`)
   }
diff --git a/index.html b/index.html
index bead1be..d1885c2 100644
--- a/index.html
+++ b/index.html
@@ -23,8 +23,8 @@
     <script type="text/javascript" src="desktop/sources/scripts/lib/history.js"></script>
     <script type="text/javascript" src="desktop/sources/scripts/dotgrid.js"></script>
     <script type="text/javascript" src="desktop/sources/scripts/manager.js"></script>
+    <script type="text/javascript" src="desktop/sources/scripts/renderer.js"></script>
     <script type="text/javascript" src="desktop/sources/scripts/cursor.js"></script>
-    <script type="text/javascript" src="desktop/sources/scripts/guide.js"></script>
     
     <script type="text/javascript" src="desktop/sources/scripts/interface.js"></script>
     <script type="text/javascript" src="desktop/sources/scripts/tool.js"></script>
diff --git a/web/events.js b/web/events.js
index 4924b79..cd67fc5 100644
--- a/web/events.js
+++ b/web/events.js
@@ -19,7 +19,7 @@ document.onkeyup = (e) =>
   if(ch == "2"){ DOTGRID.tool.select_layer(1); e.preventDefault(); }
   if(ch == "3"){ DOTGRID.tool.select_layer(2); e.preventDefault(); }  
 
-  if(ch == "h"){ DOTGRID.guide.toggle(); e.preventDefault(); }
+  if(ch == "h"){ DOTGRID.renderer.toggle(); e.preventDefault(); }
   if(ch == "?"){ DOTGRID.reset(); DOTGRID.theme.reset(); e.preventDefault(); }
 
   if(ch == "a"){ DOTGRID.tool.cast("line"); e.preventDefault(); }