diff --git a/Frontend/tools/xmlFormatter.html b/Frontend/tools/xmlFormatter.html
index 02a23d4..466d5ea 100644
--- a/Frontend/tools/xmlFormatter.html
+++ b/Frontend/tools/xmlFormatter.html
@@ -4,7 +4,12 @@
     <head>
         <!-- <link rel="stylesheet" href="styles.css"> -->
         <link rel="stylesheet" href="../assets/css/tools/r11form.css">
+        <link rel="stylesheet" href="../assets/css/highlight.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/highlight.js"></script>
+        <script>hljs.highlightAll();</script>
+
         <meta name="viewport" content="width=device-width, initial-scale=1.0">
         <meta charset="utf-8" />
     </head>
@@ -34,10 +39,7 @@
 
                     </div>
 
-                    <textarea id="xmlArea" name="xmlArea" rows="15"
-                        class="textarea-700 bordered-field vertically-resizeable max-width"
-                        onblur="setDefaultContent(this, 'Insert XML here');"
-                        onfocus="clearDefaultContent(this, 'Insert XML here');"></textarea>
+                    <pre><code class="language-xml bordered-field textarea-700" id="xmlArea" contenteditable="True"></code></pre>
                     <br><br>
                     <button id="prettifyButton" class="max-width block-label action-button active"
                         onclick="performFormatRequest('prettify', true, 'xmlArea', 'xmlArea')">Prettify XML</button>
