diff --git a/Client/WebServer/Images/Docs-Menu/docs-anchor.png b/Client/WebServer/Images/Docs-Menu/docs-anchor.png
new file mode 100644
index 000000000..8447a9109
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-anchor.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-block.png b/Client/WebServer/Images/Docs-Menu/docs-block.png
new file mode 100644
index 000000000..6fc37309f
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-block.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-callout-style.png b/Client/WebServer/Images/Docs-Menu/docs-callout-style.png
new file mode 100644
index 000000000..e0c9cfaa3
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-callout-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-copy.png b/Client/WebServer/Images/Docs-Menu/docs-copy.png
new file mode 100644
index 000000000..d5d128b26
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-copy.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-edit.png b/Client/WebServer/Images/Docs-Menu/docs-edit.png
new file mode 100644
index 000000000..23d6956db
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-edit.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-error-style.png b/Client/WebServer/Images/Docs-Menu/docs-error-style.png
new file mode 100644
index 000000000..1410b768e
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-error-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-gif-style.png b/Client/WebServer/Images/Docs-Menu/docs-gif-style.png
new file mode 100644
index 000000000..c2b661556
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-gif-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-hierarchy-style.png b/Client/WebServer/Images/Docs-Menu/docs-hierarchy-style.png
new file mode 100644
index 000000000..6595956ba
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-hierarchy-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-important-style.png b/Client/WebServer/Images/Docs-Menu/docs-important-style.png
new file mode 100644
index 000000000..6f01959e6
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-important-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-include.png b/Client/WebServer/Images/Docs-Menu/docs-include.png
new file mode 100644
index 000000000..21e2defb3
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-include.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-javascript-code-style.png b/Client/WebServer/Images/Docs-Menu/docs-javascript-code-style.png
new file mode 100644
index 000000000..f56b6fe89
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-javascript-code-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-json-code-style.png b/Client/WebServer/Images/Docs-Menu/docs-json-code-style.png
new file mode 100644
index 000000000..ad4ed8307
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-json-code-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-link-style.png b/Client/WebServer/Images/Docs-Menu/docs-link-style.png
new file mode 100644
index 000000000..537afd0e0
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-link-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-list-style.png b/Client/WebServer/Images/Docs-Menu/docs-list-style.png
new file mode 100644
index 000000000..78abaf468
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-list-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-note-style.png b/Client/WebServer/Images/Docs-Menu/docs-note-style.png
new file mode 100644
index 000000000..0255e998e
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-note-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-png-style.png b/Client/WebServer/Images/Docs-Menu/docs-png-style.png
new file mode 100644
index 000000000..05a6c0053
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-png-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-section.png b/Client/WebServer/Images/Docs-Menu/docs-section.png
new file mode 100644
index 000000000..226cc2de7
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-section.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-subtitle-style.png b/Client/WebServer/Images/Docs-Menu/docs-subtitle-style.png
new file mode 100644
index 000000000..7b6fc3458
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-subtitle-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-sucess-style.png b/Client/WebServer/Images/Docs-Menu/docs-sucess-style.png
new file mode 100644
index 000000000..ecdb43a6a
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-sucess-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-summary-style.png b/Client/WebServer/Images/Docs-Menu/docs-summary-style.png
new file mode 100644
index 000000000..67ea31099
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-summary-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-table-style.png b/Client/WebServer/Images/Docs-Menu/docs-table-style.png
new file mode 100644
index 000000000..539318026
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-table-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-text-style.png b/Client/WebServer/Images/Docs-Menu/docs-text-style.png
new file mode 100644
index 000000000..227fbb805
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-text-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-title-style.png b/Client/WebServer/Images/Docs-Menu/docs-title-style.png
new file mode 100644
index 000000000..bebd5e2b4
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-title-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-warning-style.png b/Client/WebServer/Images/Docs-Menu/docs-warning-style.png
new file mode 100644
index 000000000..552ac1781
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-warning-style.png differ
diff --git a/Client/WebServer/Images/Docs-Menu/docs-youtube-style.png b/Client/WebServer/Images/Docs-Menu/docs-youtube-style.png
new file mode 100644
index 000000000..d9e46d9a4
Binary files /dev/null and b/Client/WebServer/Images/Docs-Menu/docs-youtube-style.png differ
diff --git a/Client/WebServer/css/context-menu.css b/Client/WebServer/css/context-menu.css
index 4d8e0c96b..e2f566d49 100644
--- a/Client/WebServer/css/context-menu.css
+++ b/Client/WebServer/css/context-menu.css
@@ -1,8 +1,8 @@
   
   #menu {
-    display: block;
-    background-color: white;
-    padding: 10px 0px;
+    display: table;
+    background-color: rgba(255, 255, 255);
+    padding: 5px;
     border-radius: 5px;
     box-shadow: 2px 2px 30px lightgrey;
     position: absolute;
@@ -11,6 +11,8 @@
     opacity: 0;
     transform: scale(0);
     transition: transform 0.2s, opacity 0.2s;
+    border-collapse: separate;
+    border-spacing: 5px;
   }
   
   #menu.show {
@@ -20,14 +22,18 @@
   }
   
   .menu-item {
-    display: block;
-    padding: 10px 30px;
+    display: table-cell;
+    padding: 10px;
+    margin: 5px;
     transition: 0.1s;
-    color: #666;
+    border: 1px solid #ddd;
+    border-radius: 5px;
+    background-color: white;
   }
   
   .menu-item:hover {
-    background-color: #eee;
+    border: 1px solid #e3493c;
+    background-color: #fff6f6;
     cursor: pointer;
   }
   
@@ -39,4 +45,13 @@
     left: 0;
     z-index: 1;
     display: none;
-  }
\ No newline at end of file
+  }
+
+.menu-row{
+  display: table-row;
+}
+
+.menu-img {
+width: 40px;
+height: 40px;
+}
\ No newline at end of file
diff --git a/Client/WebServer/index.html b/Client/WebServer/index.html
index aa243f614..5a39693be 100644
--- a/Client/WebServer/index.html
+++ b/Client/WebServer/index.html
@@ -107,33 +107,100 @@
         </form>
     </div>
 
-    <ul id="menu">
-        <li class="menu-item" onClick="window.contextMenu.editParagraph()">Edit</li>
-        <li class="menu-item" onClick="window.contextMenu.toText()">Text Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toTitle()">Title Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toSubtitle()">Subtitle Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toNote()">Note Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toWarning()">Warning Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toImportant()">Important Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toError()">Error Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toSuccess()">Success Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toList()">List Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toCallout()">Callout Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toSummary()">Summary Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toJavascript()">JS Code Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toJson()">JSON Code Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toTable()">Table Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toHierarchy()">Hierarchy Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toWebPageLink()">Web Page Link Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toYouTubeVideo()">YouTube Video Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toSection()">Section Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toGif()">Gif Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toPng()">Png Style</li>
-        <li class="menu-item" onClick="window.contextMenu.toAnchor()">Anchor</li>
-        <li class="menu-item" onClick="window.contextMenu.toBlock()">Block</li>
-        <li class="menu-item" onClick="window.contextMenu.toInclude()">Include</li>
-        <li class="menu-item" onClick="window.contextMenu.copyLink()">Copy</li> 
-    </ul>
+    <div id="menu" class="docs-menu-table">
+        <div class="menu-row">
+            <div class="menu-item" onClick="window.contextMenu.editParagraph()">
+                <img src="Images/Docs-Menu/docs-edit.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toTitle()">
+                <img src="Images/Docs-Menu/docs-title-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toSubtitle()">
+                <img src="Images/Docs-Menu/docs-subtitle-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toNote()">
+                <img src="Images/Docs-Menu/docs-note-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toJavascript()">
+                <img src="Images/Docs-Menu/docs-javascript-code-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toYouTubeVideo()">
+                <img src="Images/Docs-Menu/docs-youtube-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toBlock()">
+                <img src="Images/Docs-Menu/docs-block.png" class="menu-img">
+            </div>
+        </div>
+        <div class="menu-row">
+            <div class="menu-item" onClick="window.contextMenu.copyLink()">
+                <img src="Images/Docs-Menu/docs-copy.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toText()">
+                <img src="Images/Docs-Menu/docs-text-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toList()">
+                <img src="Images/Docs-Menu/docs-list-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toSuccess()">
+                <img src="Images/Docs-Menu/docs-sucess-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toJson()">
+                <img src="Images/Docs-Menu/docs-json-code-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toGif()">
+                <img src="Images/Docs-Menu/docs-gif-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toInclude()">
+                <img src="Images/Docs-Menu/docs-include.png" class="menu-img">
+            </div>
+        </div>
+        <div class="menu-row">
+            <div class="menu-item">
+
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toSummary()">
+                <img src="Images/Docs-Menu/docs-summary-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toCallout()">
+                <img src="Images/Docs-Menu/docs-callout-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toImportant()">
+                <img src="Images/Docs-Menu/docs-important-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toTable()">
+                <img src="Images/Docs-Menu/docs-table-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toPng()">
+                <img src="Images/Docs-Menu/docs-png-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toSection()">
+                <img src="Images/Docs-Menu/docs-section.png" class="menu-img">
+            </div>
+        </div>
+        <div class="menu-row">
+            <div class="menu-item">
+
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toWebPageLink()">
+                <img src="Images/Docs-Menu/docs-link-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toAnchor()">
+                <img src="Images/Docs-Menu/docs-anchor.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toWarning()">
+                <img src="Images/Docs-Menu/docs-warning-style.png" class="menu-img">
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toHierarchy()">
+                <img src="Images/Docs-Menu/docs-hierarchy-style.png" class="menu-img">
+            </div>
+            <div class="menu-item">
+
+            </div>
+            <div class="menu-item" onClick="window.contextMenu.toError()">
+                <img src="Images/Docs-Menu/docs-error-style.png" class="menu-img">
+            </div>
+        </div>
+    </div>
 
 </body>