diff --git a/docs/components/f-three.md b/docs/components/f-three.md
index d3ead3a..0417fae 100644
--- a/docs/components/f-three.md
+++ b/docs/components/f-three.md
@@ -10,7 +10,7 @@
 
 First, let's create a scene with `<f-three>` component. Then let's add `<f-three-mesh>` with `geometry` and `material` props.
 
-Use the mouse or pointer to adjust the rotation of the scene.
+> <Icon id="tabler:hand-finger" /> Use the mouse or pointer to adjust the rotation of the scene.
 
 ```md
 <script setup>
diff --git a/package-lock.json b/package-lock.json
index 5364874..09de7d2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6,7 +6,7 @@
   "packages": {
     "": {
       "name": "fachwerk",
-      "version": "0.0.20",
+      "version": "0.0.22",
       "license": "MIT",
       "dependencies": {
         "d3-shape": "^3.1.0",
@@ -19,7 +19,7 @@
       },
       "devDependencies": {
         "@babel/types": "^7.17.0",
-        "@iconify-json/tabler": "^1.1.3",
+        "@iconify-json/tabler": "^1.1.8",
         "@tailwindcss/typography": "^0.5.2",
         "@types/d3-shape": "^3.0.2",
         "@types/katex": "^0.11.1",
@@ -367,9 +367,9 @@
       }
     },
     "node_modules/@iconify-json/tabler": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/@iconify-json/tabler/-/tabler-1.1.3.tgz",
-      "integrity": "sha512-QhnSYkQ4FS3uTrSOg+I9WQBLNtI7hXa00Fi8OcQhOw8isQ+Vt1BbaBkXtfdxcl1Xo5VIPhvkk8QVTyJL8k339g==",
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/@iconify-json/tabler/-/tabler-1.1.8.tgz",
+      "integrity": "sha512-uNdzJeccj/o1pbofBFxdjwnxDYgPDUIQv0pp7tjyG6ZUbmiZXWDn377pprg242bUSPI/+gE7JIBryVLZmLFbEA==",
       "dev": true,
       "dependencies": {
         "@iconify/types": "^1.0.12"
@@ -4573,9 +4573,9 @@
       }
     },
     "@iconify-json/tabler": {
-      "version": "1.1.3",
-      "resolved": "https://registry.npmjs.org/@iconify-json/tabler/-/tabler-1.1.3.tgz",
-      "integrity": "sha512-QhnSYkQ4FS3uTrSOg+I9WQBLNtI7hXa00Fi8OcQhOw8isQ+Vt1BbaBkXtfdxcl1Xo5VIPhvkk8QVTyJL8k339g==",
+      "version": "1.1.8",
+      "resolved": "https://registry.npmjs.org/@iconify-json/tabler/-/tabler-1.1.8.tgz",
+      "integrity": "sha512-uNdzJeccj/o1pbofBFxdjwnxDYgPDUIQv0pp7tjyG6ZUbmiZXWDn377pprg242bUSPI/+gE7JIBryVLZmLFbEA==",
       "dev": true,
       "requires": {
         "@iconify/types": "^1.0.12"
diff --git a/package.json b/package.json
index 4e0f518..5528bc7 100644
--- a/package.json
+++ b/package.json
@@ -42,9 +42,8 @@
   },
   "typings": "./dist/lib.esm.ts",
   "scripts": {
-    "dev": "vite --port 3000 --host -c vite.config.app.ts --open",
-    "build": "vite build -c vite.config.esm.ts && vite build -c vite.config.cjs.ts && vite build -c vite.config.app.ts && vite build -c vite.config.internal.ts",
-    "preview": "vite preview --port 5000",
+    "dev": "vite --open --port 3000 -c vite.config.app.ts",
+    "build": "vite build -c vite.config.app.ts && vite build -c vite.config.esm.ts && vite build -c vite.config.cjs.ts && vite build -c vite.config.internal.ts",
     "test": "vitest",
     "typecheck": "vue-tsc --noEmit",
     "release": "vitest --run && npm run build && vue-tsc --declaration --emitDeclarationOnly",
@@ -61,7 +60,7 @@
   },
   "devDependencies": {
     "@babel/types": "^7.17.0",
-    "@iconify-json/tabler": "^1.1.3",
+    "@iconify-json/tabler": "^1.1.8",
     "@tailwindcss/typography": "^0.5.2",
     "@types/d3-shape": "^3.0.2",
     "@types/katex": "^0.11.1",
diff --git a/src/app.ts b/src/app.ts
index dae49f7..5312d53 100644
--- a/src/app.ts
+++ b/src/app.ts
@@ -1,4 +1,4 @@
-import { createApp } from "vue";
+import { createApp, h, shallowRef, watchEffect } from "vue";
 import { createRouter, createWebHistory } from "vue-router";
 
 import routes from "virtual:generated-pages";
@@ -8,7 +8,7 @@ import App from "./App.vue";
 import Layout from "./internal/Layout.vue";
 import Editor from "./internal/Editor.vue";
 import Button from "./internal/Button.vue";
-import IconOne from "~icons/tabler/circle-1";
+import Icon from "./internal/Icon.vue";
 
 import "./app.css";
 
@@ -20,8 +20,13 @@ const router = createRouter({
 const app = createApp(App);
 app.use(router);
 app.use(Fachwerk);
+
+// Used by vue-markdown
 app.component("Layout", Layout);
+
+// Used inside markdown documents
 app.component("Editor", Editor);
 app.component("Button", Button);
-app.component("IconOne", IconOne);
+app.component("Icon", Icon);
+
 app.mount("#app");
diff --git a/src/internal/Content.vue b/src/internal/Content.vue
index e5f9caf..a40da78 100644
--- a/src/internal/Content.vue
+++ b/src/internal/Content.vue
@@ -23,6 +23,7 @@ const defaultClass = `
   prose-a:text-lightblue-700
   prose-a:underline
   prose-a:underline-offset-2
+  prose-blockquote:text-gray-600
   prose-blockquote:border-l-4
   prose-blockquote:border-yellow-400
   prose-blockquote:pl-6
@@ -68,4 +69,24 @@ const mergedClass = computed(() => twMerge(`${defaultClass} ${customClass}`));
 .prose button {
   @apply text-lightblue-800 inline-block rounded border-2 border-sky-800 px-3 py-1 text-center font-medium hover:bg-black/5;
 }
+.prose > * > h1:first-child,
+.prose > * > h2:first-child,
+.prose > * > h3:first-child,
+.prose > * > h3:first-child,
+.prose > * > h3:first-child,
+.prose > * > h3:first-child,
+.prose > * > h3:first-child,
+.prose > * > h5:first-child,
+.prose > * > h6:first-child {
+  @apply !mt-0;
+}
+
+.prose > * > * > h1,
+.prose > * > * > h2,
+.prose > * > * > h3,
+.prose > * > * > h4,
+.prose > * > * > h5,
+.prose > * > * > h6 {
+  @apply !mt-0;
+}
 </style>
diff --git a/src/internal/Icon.vue b/src/internal/Icon.vue
new file mode 100644
index 0000000..d7a80f7
--- /dev/null
+++ b/src/internal/Icon.vue
@@ -0,0 +1,26 @@
+<script setup lang="ts">
+import tabler from "@iconify-json/tabler/icons.json";
+const icons = { tabler };
+
+type Props = {
+  id: string;
+};
+const { id } = defineProps<Props>();
+const [collection, name] = id.split(":");
+//@ts-ignore
+const icon = icons[collection]?.icons[name]?.body;
+</script>
+
+<template>
+  <svg
+    sstyle="
+      display: inline-block;
+      width: 24px;
+      height: 24px;
+      vertical-align: -webkit-baseline-middle;
+    "
+    class="text-lightgray-600 !inline-block h-5 align-[-webkit-baseline-middle]"
+    viewBox="0 0 24 24"
+    v-html="icon"
+  />
+</template>
diff --git a/vite.config.app.ts b/vite.config.app.ts
index 8c856e6..37e26c7 100644
--- a/vite.config.app.ts
+++ b/vite.config.app.ts
@@ -71,7 +71,6 @@ export default defineConfig({
     ViteIcons({ autoInstall: true }),
   ],
   build: {
-    emptyOutDir: false,
     outDir: "dist/docs",
   },
 });