diff --git a/package-lock.json b/package-lock.json
index 4dae595..a77f406 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,6 +14,7 @@
         "@mui/icons-material": "^5.8.4",
         "@mui/material": "^5.9.3",
         "css": "^3.0.0",
+        "html-prettify": "^1.0.7",
         "jwt-decode": "^3.1.2",
         "marked": "^4.2.5",
         "mathml-to-latex": "^1.2.0",
@@ -13677,6 +13678,11 @@
         "react-is": "^16.7.0"
       }
     },
+    "node_modules/html-prettify": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/html-prettify/-/html-prettify-1.0.7.tgz",
+      "integrity": "sha512-99pRsP2PV2DyWnrVibNyad7gNmzCP7AANO8jw7Z9yanWyXH9dPdqdMXGefySplroqCNdk95u7j5TLxfyJ1Cbbg=="
+    },
     "node_modules/htmlnano": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/htmlnano/-/htmlnano-2.0.3.tgz",
@@ -24877,6 +24883,11 @@
         "react-is": "^16.7.0"
       }
     },
+    "html-prettify": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/html-prettify/-/html-prettify-1.0.7.tgz",
+      "integrity": "sha512-99pRsP2PV2DyWnrVibNyad7gNmzCP7AANO8jw7Z9yanWyXH9dPdqdMXGefySplroqCNdk95u7j5TLxfyJ1Cbbg=="
+    },
     "htmlnano": {
       "version": "2.0.3",
       "resolved": "https://registry.npmjs.org/htmlnano/-/htmlnano-2.0.3.tgz",
diff --git a/package.json b/package.json
index b433ed7..82e5aeb 100644
--- a/package.json
+++ b/package.json
@@ -57,6 +57,7 @@
     "@mui/icons-material": "^5.8.4",
     "@mui/material": "^5.9.3",
     "css": "^3.0.0",
+    "html-prettify": "^1.0.7",
     "jwt-decode": "^3.1.2",
     "marked": "^4.2.5",
     "mathml-to-latex": "^1.2.0",
diff --git a/src/content-script/components/html-edit/html-edit.component.ts b/src/content-script/components/html-edit/html-edit.component.ts
index 45d24d3..6b5c0da 100644
--- a/src/content-script/components/html-edit/html-edit.component.ts
+++ b/src/content-script/components/html-edit/html-edit.component.ts
@@ -15,6 +15,7 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  */
 import { HtmlComponent, HtmlComponentFocusable } from '../../../common/model/html.model';
+import { HtmlPrettifyFactory } from '../../factory/html-prettify.factory';
 import { PinComponent } from '../pin.component';
 import { PinUpdateCommand } from '../../../common/command/pin/pin-update.command';
 import { applyStylesToElement } from '../../../common/style.utils';
@@ -69,7 +70,7 @@ export class HtmlEditComponent implements HtmlComponent<HTMLElement>, HtmlCompon
   }
 
   focusin(): void {
-    this.text.value = this.parent.object.data.htmlEdit || this.parent.ref.innerHTML;
+    this.text.value = HtmlPrettifyFactory.prettify(this.parent.object.data.htmlEdit || this.parent.ref.innerHTML);
     this.el.style.display = 'flex';
   }
 
diff --git a/src/content-script/factory/html-prettify.factory.ts b/src/content-script/factory/html-prettify.factory.ts
new file mode 100644
index 0000000..5e05f98
--- /dev/null
+++ b/src/content-script/factory/html-prettify.factory.ts
@@ -0,0 +1,23 @@
+/*
+ * This file is part of the pinmenote-extension distribution (https://github.com/pinmenote/pinmenote-extension).
+ * Copyright (c) 2023 Michal Szczepanski.
+ *
+ * This program is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU General Public License as published by
+ * the Free Software Foundation, version 3.
+ *
+ * This program is distributed in the hope that it will be useful, but
+ * WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
+ * General Public License for more details.
+ *
+ * You should have received a copy of the GNU General Public License
+ * along with this program. If not, see <http://www.gnu.org/licenses/>.
+ */
+import prettify from 'html-prettify';
+
+export class HtmlPrettifyFactory {
+  static prettify(value: string): string {
+    return prettify(value);
+  }
+}