diff --git a/Frontend/tools/xpath.html b/Frontend/tools/xpath.html
index 563a52e..c89e429 100644
--- a/Frontend/tools/xpath.html
+++ b/Frontend/tools/xpath.html
@@ -2,11 +2,13 @@
 <html>
 
 <head>
-    <!-- <link rel="stylesheet" href="../common.css"> -->
-    <!-- <link rel="stylesheet" href="styles.css"> -->
     <link rel="stylesheet" href="../assets/css/tools/r11form.css">
-    <script src="../assets/scripts/tools/scripts.js"></script>
+    <link rel="stylesheet" href="../assets/css/json.css">
     <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
+    <script src="../assets/scripts/tools/scripts.js"></script>
+    <script src="../assets/scripts/tools/json.js"></script>
+    <script>hljs.highlightAll();</script>
+    
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta charset="utf-8" />
 </head>
@@ -47,10 +49,13 @@
                 </div>
                 <br>
                 <label for="xmlArea"><b>Insert your XML:</b></label>
-                <textarea id="xmlArea" name="xmlArea" rows="15"
+                <!-- <textarea id="xmlArea" name="xmlArea" rows="15"
                     class="textarea-300 bordered-field vertically-resizeable max-width"
                     onblur="setDefaultContent(this, 'Insert XML here');"
-                    onfocus="clearDefaultContent(this, 'Insert XML here');"></textarea>
+                    onfocus="clearDefaultContent(this, 'Insert XML here');"></textarea> -->
+                    <pre>
+                        <code class="language-xml bordered-field" id="xmlBlock" contenteditable="True">Insert XML here</code>
+                    </pre>
                 <br><br>
                 <label for="transformArea"><b>Insert your XPath:</b></label>
                 <textarea id="transformArea" name="transformArea" class="bordered-field vertically-resizeable max-width"
