diff --git a/src/css/layout.css b/src/css/layout.css
index d243173..acb2e3c 100644
--- a/src/css/layout.css
+++ b/src/css/layout.css
@@ -396,6 +396,7 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
 .layer_add{
 	display:inline-block;
 	padding:1px 8px;
+	margin-right: 10px;
 	background-color: #419147;
 	background-color: var(--background-color-active);
 	border:1px solid #444;
@@ -411,6 +412,8 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
 	display:block;
 	padding:1px 5px 3px 5px;
 	height:19px;
+	width: calc(100% - 44px);
+	text-align: left;
 	overflow:hidden;
 	background-color:#989898;
 	background-color: var(--area-background-color);
@@ -455,6 +458,9 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
 	width:20px;
 	height:19px;
 	opacity:0.1;
+	border: none;
+	background: transparent;
+	box-shadow: none;
 }
 .layers_list .visibility:after{
 	position: absolute;
@@ -475,8 +481,10 @@ IMPORTANT: any new icon should also must be added on /service-worker.js + its ve
 	width:12px;
 	height:19px;
 	margin-left: 5px;
-	background: url(images/icons/delete.svg) no-repeat center center;
+	background: transparent url(images/icons/delete.svg) no-repeat center center;
 	background-size: 10px 10px;
+	border: none;
+	box-shadow: none;
 }
 /* filters */
 .layers_list .filters{
diff --git a/src/js/core/gui/gui-layers.js b/src/js/core/gui/gui-layers.js
index 6c74359..25a65d1 100644
--- a/src/js/core/gui/gui-layers.js
+++ b/src/js/core/gui/gui-layers.js
@@ -9,13 +9,16 @@ import Base_layers_class from './../base-layers.js';
 import Helper_class from './../../libs/helpers.js';
 import Layer_rename_class from './../../modules/layer/rename.js';
 import Effects_browser_class from './../../modules/effects/browser.js';
+import Layer_duplicate_class from './../../modules/layer/duplicate.js';
+import Layer_raster_class from './../../modules/layer/raster.js';
 
 var template = `
-	<span class="trn">Insert:</span>
-	<button type="button" class="layer_add" id="insert_layer">+</button>
+	<button type="button" class="layer_add" id="insert_layer" title="Insert new layer">+</button>
+	<button type="button" class="layer_duplicate" id="layer_duplicate" title="Duplicate layer">D</button>
+	<button type="button" class="layer_raster" id="layer_raster" title="Convert layer to raster">R</button>
 
-	<button type="button" class="layers_arrow" title="Move down" id="layer_down">&darr;</button>
-	<button type="button" class="layers_arrow" title="Move up" id="layer_up">&uarr;</button>
+	<button type="button" class="layers_arrow" title="Move layer down" id="layer_down">&darr;</button>
+	<button type="button" class="layers_arrow" title="Move layer up" id="layer_up">&uarr;</button>
 
 	<div class="layers_list" id="layers"></div>
 `;
@@ -30,6 +33,8 @@ class GUI_layers_class {
 		this.Helper = new Helper_class();
 		this.Layer_rename = new Layer_rename_class();
 		this.Effects_browser = new Effects_browser_class();
+		this.Layer_duplicate = new Layer_duplicate_class();
+		this.Layer_raster = new Layer_raster_class();
 	}
 
 	render_main_layers() {
@@ -50,6 +55,14 @@ class GUI_layers_class {
 					new app.Actions.Insert_layer_action()
 				);
 			}
+			else if (target.id == 'layer_duplicate') {
+				//duplicate
+				_this.Layer_duplicate.duplicate();
+			}
+			else if (target.id == 'layer_raster') {
+				//raster
+				_this.Layer_raster.raster();
+			}
 			else if (target.id == 'layer_up') {
 				//move layer up
 				app.State.do_action(
@@ -134,16 +147,16 @@ class GUI_layers_class {
 				else
 					html += '<div class="item">';
 				if (value.visible == true)
-					html += '	<span class="visibility visible" id="visibility" data-id="' + value.id + '" title="hide"></span>';
+					html += '	<button class="visibility visible" id="visibility" data-id="' + value.id + '" title="Hide"></button>';
 				else
-					html += '	<span class="visibility" id="visibility" data-id="' + value.id + '" title="show"></span>';
-				html += '	<span class="delete" id="delete" data-id="' + value.id + '" title="delete"></span>';
+					html += '	<button class="visibility" id="visibility" data-id="' + value.id + '" title="Show"></button>';
+				html += '	<button class="delete" id="delete" data-id="' + value.id + '" title="Delete"></button>';
 				
 				if(value.composition === 'source-atop'){
-					html += '	<span class="arrow_down" data-id="' + value.id + '" ></span>';
+					html += '	<button class="arrow_down" data-id="' + value.id + '" ></button>';
 				}
 				
-				html += '	<span class="layer_name" id="layer_name" data-id="' + value.id + '">' + value.name + '</span>';
+				html += '	<button class="layer_name" id="layer_name" data-id="' + value.id + '">' + value.name + '</button>';
 				html += '	<div class="clear"></div>';
 				html += '</div>';
 
diff --git a/src/js/core/gui/gui-preview.js b/src/js/core/gui/gui-preview.js
index ae62eed..8316da3 100644
--- a/src/js/core/gui/gui-preview.js
+++ b/src/js/core/gui/gui-preview.js
@@ -18,7 +18,7 @@ var template = `
 			<button title="Zoom out" class="layer_add trn" id="zoom_less"">-</button>
 			<button title="Reset zoom level"  class="layer_add trn" id="zoom_100">100%</button>
 			<button title="Zoom in" class="layer_add trn" id="zoom_more"">+</button>
-			<button class="layer_add trn" id="zoom_fit">Fit</button>
+			<button title="Fit window" class="layer_add trn" id="zoom_fit">Fit</button>
 		</div>
 		<input id="zoom_range" type="range" value="100" min="50" max="1000" step="50" />
 	</div>
diff --git a/src/js/core/gui/gui-tools.js b/src/js/core/gui/gui-tools.js
index 4c2b983..71de105 100644
--- a/src/js/core/gui/gui-tools.js
+++ b/src/js/core/gui/gui-tools.js
@@ -200,6 +200,7 @@ class GUI_tools_class {
 					element.classList.add('ui_icon_button');
 					element.classList.add('input_height');
 					element.innerHTML = icon;
+					element.title = k;
 					element.innerHTML = '<img style="width:16px;height:16px;" alt="'+title+'" src="images/icons/'+icon+'" />';
 				} else {
 					element.classList.add('ui_toggle_button');
diff --git a/src/js/libs/popup.js b/src/js/libs/popup.js
index e7dd592..bdcdce4 100644
--- a/src/js/libs/popup.js
+++ b/src/js/libs/popup.js
@@ -44,7 +44,7 @@ import Base_gui_class from './../core/base-gui.js';
 import Tools_translate_class from './../modules/tools/translate.js';
 
 var template = `
-	<button type="button" class="close" data-id="popup_close">&times;</button>
+	<button type="button" class="close" data-id="popup_close" title="Close">&times;</button>
 	<div data-id="pretitle_area"></div>
 	<span class="text_muted right" data-id="popup_comment"></span>
 	<h2 class="trn" data-id="popup_title"></h2>
diff --git a/src/js/tools/media.js b/src/js/tools/media.js
index d5488a4..a7fc630 100644
--- a/src/js/tools/media.js
+++ b/src/js/tools/media.js
@@ -61,7 +61,7 @@ class Media_class extends Base_tools_class {
 
 			//paging
 			html_paging += '<div class="media-paging" id="media_paging">';
-			html_paging += '<button type="button" data-value="1">&lt;</button> ';
+			html_paging += '<button type="button" data-value="1" title="Previous">&lt;</button> ';
 			for(var i = 1; i <= Math.min(10, pages); i++) {
 				var selected = '';
 				if(this.page == i){
@@ -69,7 +69,7 @@ class Media_class extends Base_tools_class {
 				}
 				html_paging += '<button type="button" class="'+selected+'" data-value="'+i+'">'+i+'</button> ';
 			}
-			html_paging += '<button type="button" data-value="'+Math.min(this.page + 1, pages)+'">&gt;</button> ';
+			html_paging += '<button type="button" data-value="'+Math.min(this.page + 1, pages)+'" title="Next">&gt;</button> ';
 			html_paging += '</div>';
 		}
 		else{