diff --git a/app.vue b/app.vue
index d61be25..f8ba32a 100644
--- a/app.vue
+++ b/app.vue
@@ -11,6 +11,11 @@ import '@gouvfr/dsfr/dist/dsfr.css'
 import '@gouvfr/dsfr/dist/utility/utility.css'
 import '@datagouv/components/dist/style.css'
 import '~/assets/css/overrides.css'
+import { setupI18nWithExistingInstance } from '@datagouv/components'
+
+const app = useNuxtApp()
+
+setupI18nWithExistingInstance({ global: app.$i18n })
 
 useHead({
   titleTemplate: (titleChunk) => {
diff --git a/assets/css/fonts.css b/assets/css/fonts.css
index 9aeca3a..366c854 100644
--- a/assets/css/fonts.css
+++ b/assets/css/fonts.css
@@ -1,3 +1,12 @@
+@font-face {
+  font-weight: 800;
+  font-family: "Marianne";
+  src: url("../fonts/Marianne-ExtraBold.woff2") format("woff2"),
+    url("../fonts/Marianne-ExtraBold.woff") format("woff");
+
+  font-display: swap;
+}
+
 @font-face {
   font-weight: 600;
   font-family: Spectral;
diff --git a/assets/fonts/Marianne-ExtraBold.woff b/assets/fonts/Marianne-ExtraBold.woff
new file mode 100644
index 0000000..ad85a55
Binary files /dev/null and b/assets/fonts/Marianne-ExtraBold.woff differ
diff --git a/assets/fonts/Marianne-ExtraBold.woff2 b/assets/fonts/Marianne-ExtraBold.woff2
new file mode 100644
index 0000000..b98ec4f
Binary files /dev/null and b/assets/fonts/Marianne-ExtraBold.woff2 differ
diff --git a/components/Breadcrumb/Breadcrumb.vue b/components/Breadcrumb/Breadcrumb.vue
index 8a96e6f..d18ccb6 100644
--- a/components/Breadcrumb/Breadcrumb.vue
+++ b/components/Breadcrumb/Breadcrumb.vue
@@ -2,7 +2,7 @@
   <nav
     rol="navigation"
     :aria-label="$t(`You're here:`)"
-    class="fr-breadcrumb fr-mb-5v"
+    class="fr-breadcrumb !mb-5"
   >
     <ol class="fr-breadcrumb__list">
       <slot />
diff --git a/components/MarkdownEditor/InternalEditor.vue b/components/MarkdownEditor/InternalEditor.vue
index 3e7db97..3dc7a38 100644
--- a/components/MarkdownEditor/InternalEditor.vue
+++ b/components/MarkdownEditor/InternalEditor.vue
@@ -90,14 +90,7 @@
     </div>
     <div class="p-1">
       <Milkdown
-        class="prose prose-neutral max-w-none prose-h1:text-xl prose-h1:leading-6 prose-h1:font-extrabold"
-        :class="[
-          proseTable,
-          proseHeading,
-          proseList,
-          proseCode,
-          proseOthers,
-        ]"
+        :class="markdownClasses"
       />
     </div>
   </div>
@@ -185,12 +178,6 @@ const gfmPlugins = [
   tableSelectorPlugin(widgetViewFactory),
 ].flat()
 
-const proseTable = 'prose-table:bg-neutral-200 prose-table:!overflow-visible first-of-type:prose-tr:!bg-neutral-200 first-of-type:prose-tr:border-b-2 first-of-type:prose-tr:border-black odd:prose-tr:bg-neutral-300 *:prose-th:m-0 *:prose-td:m-0 prose-th:p-4 prose-td:p-4'
-const proseHeading = 'prose-h1:text-xl prose-h1:leading-6 prose-h2:text-base prose-h3:text-sm prose-h3:leading-6 prose-headings:font-extrabold'
-const proseList = 'prose-ul:list-disc'
-const proseCode = 'prose-pre:font-mono prose-pre:bg-neutral-200 prose-pre:text-neutral-600'
-const proseOthers = 'prose-blockquote:border-neutral-800 prose-a:no-underline prose-li:p-0 *:prose-li:m-0'
-
 const editor = useEditor(root =>
   Editor.make()
     .config((ctx) => {
diff --git a/components/MarkdownViewer/MarkdownViewer.vue b/components/MarkdownViewer/MarkdownViewer.vue
new file mode 100644
index 0000000..3bce808
--- /dev/null
+++ b/components/MarkdownViewer/MarkdownViewer.vue
@@ -0,0 +1,16 @@
+<!-- eslint-disable vue/no-v-html -->
+<template>
+  <div
+    :class="markdownClasses"
+    v-html="formatMarkdown(content, minHeading)"
+  />
+</template>
+
+<script setup lang="ts">
+withDefaults(defineProps<{
+  content: string
+  minHeading?: 1 | 2 | 3 | 4 | 5 | 6
+}>(), {
+  minHeading: 3,
+})
+</script>
diff --git a/components/Post/card.vue b/components/Post/card.vue
new file mode 100644
index 0000000..579f0c1
--- /dev/null
+++ b/components/Post/card.vue
@@ -0,0 +1,31 @@
+<template>
+  <div class="max-w-[38rem] hover:bg-neutral-200 fr-enlarge-link">
+    <div v-if="post.image">
+      <img :src="post.image">
+    </div>
+    <div class="p-4">
+      <p class="text-lg mb-2.5 font-bold">
+        <NuxtLinkLocale
+          :to="`/posts/${post.slug}/`"
+        >
+          {{ post.name }}
+        </NuxtLinkLocale>
+      </p>
+      <p
+        v-if="post.published"
+        class="mb-0 text-gray-medium"
+      >
+        {{ $t('Published the {date}', { date: formatDate(post.published) }) }}
+      </p>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { formatDate } from '@datagouv/components'
+import type { Post } from '~/types/posts'
+
+defineProps<{
+  post: Post
+}>()
+</script>
diff --git a/components/SiteHeader/SiteHeader.vue b/components/SiteHeader/SiteHeader.vue
index 8bf7ec4..3f70aac 100644
--- a/components/SiteHeader/SiteHeader.vue
+++ b/components/SiteHeader/SiteHeader.vue
@@ -414,7 +414,7 @@ const menu = [
     { label: t('How to use data?'), link: '/pages/onboarding/reutilisateurs/', external: true },
     { label: t('{site} guides', { site: config.public.title }), link: config.public.guidesUrl, external: true },
   ], external: true },
-  { label: t('News'), link: '/posts/', external: true },
+  { label: t('News'), link: '/posts/' },
   { label: t('Contact us'), link: 'https://support.data.gouv.fr/', external: true },
 ]
 
diff --git a/lang/en-US.json b/lang/en-US.json
index aa614e8..f085bca 100644
--- a/lang/en-US.json
+++ b/lang/en-US.json
@@ -765,5 +765,6 @@
   "No organizations": "No organizations",
   "{n} posts": "{n} posts | {n} post | {n} posts",
   "Published the {date}": "Published the {date}",
+  "Posts": "Posts",
   "": ""
 }
diff --git a/lang/es-ES.json b/lang/es-ES.json
index 5c3761a..d61d4f9 100644
--- a/lang/es-ES.json
+++ b/lang/es-ES.json
@@ -758,5 +758,6 @@
   "No organizations": "No organizations",
   "{n} posts": "{n} posts | {n} post | {n} posts",
   "Published the {date}": "Published the {date}",
+  "Posts": "Posts",
   "": ""
 }
diff --git a/lang/fr-FR.json b/lang/fr-FR.json
index 5a841df..470e7c4 100644
--- a/lang/fr-FR.json
+++ b/lang/fr-FR.json
@@ -786,5 +786,6 @@
   "No organizations": "Pas d'organizations",
   "{n} posts": "{n} articles | {n} article | {n} articles",
   "Published the {date}": "Publié le {date}",
+  "Posts": "Articles",
   "": ""
 }
diff --git a/package-lock.json b/package-lock.json
index 35d071a..58172da 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -47,8 +47,19 @@
         "nuxt": "^3.13.0",
         "ofetch": "^1.4.1",
         "popmotion": "^11.0.5",
+        "rehype-highlight": "^7.0.1",
+        "rehype-raw": "^7.0.0",
+        "rehype-sanitize": "^6.0.0",
+        "rehype-slug": "^6.0.0",
+        "rehype-stringify": "^10.0.1",
+        "remark-behead": "^3.1.0",
+        "remark-breaks": "^4.0.0",
+        "remark-mdc": "^3.5.0",
+        "remark-parse": "^11.0.0",
+        "remark-rehype": "^11.1.1",
         "remove-markdown": "^0.5.5",
         "sortablejs": "^1.15.3",
+        "unified": "^11.0.5",
         "uuid": "^11.0.2",
         "vue": "^3.5",
         "vue-content-loader": "^2.0.1",
@@ -11095,6 +11106,20 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/hast-util-sanitize": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/hast-util-sanitize/-/hast-util-sanitize-5.0.2.tgz",
+      "integrity": "sha512-3yTWghByc50aGS7JlGhk61SPenfE/p1oaFeNwkOOyrscaOkMGrcW9+Cy/QAIOBpZxP1yqDIzFMR0+Np0i0+usg==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@ungap/structured-clone": "^1.0.0",
+        "unist-util-position": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/hast-util-to-html": {
       "version": "9.0.3",
       "resolved": "https://registry.npmjs.org/hast-util-to-html/-/hast-util-to-html-9.0.3.tgz",
@@ -11150,6 +11175,21 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/hast-util-to-text": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/hast-util-to-text/-/hast-util-to-text-4.0.2.tgz",
+      "integrity": "sha512-KK6y/BN8lbaq654j7JgBydev7wuNMcID54lkRav1P0CaE1e47P72AWWPiGKXTJU271ooYzcvTAn/Zt0REnvc7A==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "@types/unist": "^3.0.0",
+        "hast-util-is-element": "^3.0.0",
+        "unist-util-find-after": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/hast-util-whitespace": {
       "version": "3.0.0",
       "resolved": "https://registry.npmjs.org/hast-util-whitespace/-/hast-util-whitespace-3.0.0.tgz",
@@ -12517,6 +12557,11 @@
       "dev": true,
       "license": "MIT"
     },
+    "node_modules/lodash.iteratee": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/lodash.iteratee/-/lodash.iteratee-4.7.0.tgz",
+      "integrity": "sha512-yv3cSQZmfpbIKo4Yo45B1taEvxjNvcpF1CEOc0Y6dEyvhPIfEJE3twDwPgWTPQubcSgXyBwBKG6wpQvWMDOf6Q=="
+    },
     "node_modules/lodash.memoize": {
       "version": "4.1.2",
       "resolved": "https://registry.npmjs.org/lodash.memoize/-/lodash.memoize-4.1.2.tgz",
@@ -12820,6 +12865,19 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/mdast-util-newline-to-break": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mdast-util-newline-to-break/-/mdast-util-newline-to-break-2.0.0.tgz",
+      "integrity": "sha512-MbgeFca0hLYIEx/2zGsszCSEJJ1JSCdiY5xQxRcLDDGa8EPvlLPupJ4DSajbMPAnC0je8jfb9TiUATnxxrHUog==",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-find-and-replace": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/mdast-util-phrasing": {
       "version": "4.1.0",
       "resolved": "https://registry.npmjs.org/mdast-util-phrasing/-/mdast-util-phrasing-4.1.0.tgz",
@@ -16891,11 +16949,48 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/rehype-highlight": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/rehype-highlight/-/rehype-highlight-7.0.1.tgz",
+      "integrity": "sha512-dB/vVGFsbm7xPglqnYbg0ABg6rAuIWKycTvuXaOO27SgLoOFNoTlniTBtAxp3n5ZyMioW1a3KwiNqgjkb6Skjg==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "hast-util-to-text": "^4.0.0",
+        "lowlight": "^3.0.0",
+        "unist-util-visit": "^5.0.0",
+        "vfile": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/rehype-highlight/node_modules/highlight.js": {
+      "version": "11.11.0",
+      "resolved": "https://registry.npmjs.org/highlight.js/-/highlight.js-11.11.0.tgz",
+      "integrity": "sha512-6ErL7JlGu2CNFHyRQEuDogOyGPNiqcuWdt4iSSFUPyferNTGlNTPFqeV36Y/XwA4V/TJ8l0sxp6FTnxud/mf8g==",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/rehype-highlight/node_modules/lowlight": {
+      "version": "3.3.0",
+      "resolved": "https://registry.npmjs.org/lowlight/-/lowlight-3.3.0.tgz",
+      "integrity": "sha512-0JNhgFoPvP6U6lE/UdVsSq99tn6DhjjpAj5MxG49ewd2mOBVtwWYIT8ClyABhq198aXXODMU6Ox8DrGy/CpTZQ==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "devlop": "^1.0.0",
+        "highlight.js": "~11.11.0"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/wooorm"
+      }
+    },
     "node_modules/rehype-raw": {
       "version": "7.0.0",
       "resolved": "https://registry.npmjs.org/rehype-raw/-/rehype-raw-7.0.0.tgz",
       "integrity": "sha512-/aE8hCfKlQeA8LmyeyQvQF3eBiLRGNlfBJEvWH7ivp9sBqs7TNqBL5X3v157rM4IFETqDnIOO+z5M/biZbo9Ww==",
-      "license": "MIT",
       "dependencies": {
         "@types/hast": "^3.0.0",
         "hast-util-raw": "^9.0.0",
@@ -16906,11 +17001,23 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/rehype-sanitize": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/rehype-sanitize/-/rehype-sanitize-6.0.0.tgz",
+      "integrity": "sha512-CsnhKNsyI8Tub6L4sm5ZFsme4puGfc6pYylvXo1AeqaGbjOYyzNv3qZPwvs0oMJ39eryyeOdmxwUIo94IpEhqg==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "hast-util-sanitize": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/rehype-slug": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/rehype-slug/-/rehype-slug-6.0.0.tgz",
       "integrity": "sha512-lWyvf/jwu+oS5+hL5eClVd3hNdmwM1kAC0BUvEGD19pajQMIzcNUd/k9GsfQ+FfECvX+JE+e9/btsKH0EjJT6A==",
-      "license": "MIT",
       "dependencies": {
         "@types/hast": "^3.0.0",
         "github-slugger": "^2.0.0",
@@ -16952,6 +17059,20 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/rehype-stringify": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/rehype-stringify/-/rehype-stringify-10.0.1.tgz",
+      "integrity": "sha512-k9ecfXHmIPuFVI61B9DeLPN0qFHfawM6RsuX48hoqlaKSF61RskNjSm1lI8PhBEM0MRdLxVVm4WmTqJQccH9mA==",
+      "dependencies": {
+        "@types/hast": "^3.0.0",
+        "hast-util-to-html": "^9.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/remark": {
       "version": "15.0.1",
       "resolved": "https://registry.npmjs.org/remark/-/remark-15.0.1.tgz",
@@ -16968,6 +17089,79 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/remark-behead": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/remark-behead/-/remark-behead-3.1.0.tgz",
+      "integrity": "sha512-rKns7st91lgppaD5YaH58O4ECFVXTVnkyYQBuCw4ISRE2TFK/iVySMaKbvV2pVbUVIjAaDciugrTI/tyuPOlWQ==",
+      "dependencies": {
+        "unist-util-find": "^1.0.2",
+        "unist-util-find-all-after": "^4.0.0",
+        "unist-util-find-all-before": "^4.0.0",
+        "unist-util-find-all-between": "^2.1.0",
+        "unist-util-visit": "^4.1.0"
+      },
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      }
+    },
+    "node_modules/remark-behead/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA=="
+    },
+    "node_modules/remark-behead/node_modules/unist-util-is": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-5.2.1.tgz",
+      "integrity": "sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==",
+      "dependencies": {
+        "@types/unist": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-behead/node_modules/unist-util-visit": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-4.1.2.tgz",
+      "integrity": "sha512-MSd8OUGISqHdVvfY9TPhyK2VdUrPgxkUtWSuMHF6XAAFuL4LokseigBnZtPnJMu+FbynTkFNnFlyjxpVKujMRg==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^5.0.0",
+        "unist-util-visit-parents": "^5.1.1"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-behead/node_modules/unist-util-visit-parents": {
+      "version": "5.1.3",
+      "resolved": "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-5.1.3.tgz",
+      "integrity": "sha512-x6+y8g7wWMyQhL1iZfhIPhDAs7Xwbn9nRosDXl7qoPTSCy0yNxnKc+hWokFifWQIDGi154rdUqKvbCa4+1kLhg==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/remark-breaks": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/remark-breaks/-/remark-breaks-4.0.0.tgz",
+      "integrity": "sha512-IjEjJOkH4FuJvHZVIW0QCDWxcG96kCq7An/KVH2NfJe6rKZU2AsHeB3OEjPNRxi4QC34Xdx7I2KGYn6IpT7gxQ==",
+      "dependencies": {
+        "@types/mdast": "^4.0.0",
+        "mdast-util-newline-to-break": "^2.0.0",
+        "unified": "^11.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/remark-emoji": {
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/remark-emoji/-/remark-emoji-5.0.1.tgz",
@@ -17018,36 +17212,34 @@
       }
     },
     "node_modules/remark-mdc": {
-      "version": "3.2.1",
-      "resolved": "https://registry.npmjs.org/remark-mdc/-/remark-mdc-3.2.1.tgz",
-      "integrity": "sha512-MLNqQE7ryygOA3TtH4hKmIvmjFAqTMzCs2zrMzXs4MWJXYM2vbtdwR2NfgcN3vxIp5Pllgq3oLGuKgQSs8J19w==",
-      "license": "MIT",
+      "version": "3.5.0",
+      "resolved": "https://registry.npmjs.org/remark-mdc/-/remark-mdc-3.5.0.tgz",
+      "integrity": "sha512-Amz+Km+E3IkIS23ZbzPM+JRmLUT0iNkNCBHBSTWB187vi3Uv0iIWxHiH8EtoOqCCTDWEYrIh+KAIEf5kvqxT1Q==",
       "dependencies": {
-        "@types/mdast": "^4.0.3",
-        "@types/unist": "^3.0.2",
+        "@types/mdast": "^4.0.4",
+        "@types/unist": "^3.0.3",
         "flat": "^6.0.1",
-        "js-yaml": "^4.1.0",
-        "mdast-util-from-markdown": "^2.0.0",
-        "mdast-util-to-markdown": "^2.1.0",
-        "micromark": "^4.0.0",
-        "micromark-core-commonmark": "^2.0.0",
-        "micromark-factory-space": "^2.0.0",
-        "micromark-factory-whitespace": "^2.0.0",
-        "micromark-util-character": "^2.1.0",
-        "micromark-util-types": "^2.0.0",
+        "mdast-util-from-markdown": "^2.0.2",
+        "mdast-util-to-markdown": "^2.1.2",
+        "micromark": "^4.0.1",
+        "micromark-core-commonmark": "^2.0.2",
+        "micromark-factory-space": "^2.0.1",
+        "micromark-factory-whitespace": "^2.0.1",
+        "micromark-util-character": "^2.1.1",
+        "micromark-util-types": "^2.0.1",
         "parse-entities": "^4.0.1",
         "scule": "^1.3.0",
-        "stringify-entities": "^4.0.3",
-        "unified": "^11.0.4",
+        "stringify-entities": "^4.0.4",
+        "unified": "^11.0.5",
         "unist-util-visit": "^5.0.0",
-        "unist-util-visit-parents": "^6.0.1"
+        "unist-util-visit-parents": "^6.0.1",
+        "yaml": "^2.6.1"
       }
     },
     "node_modules/remark-parse": {
       "version": "11.0.0",
       "resolved": "https://registry.npmjs.org/remark-parse/-/remark-parse-11.0.0.tgz",
       "integrity": "sha512-FCxlKLNGknS5ba/1lmpYijMUzX2esxW5xQqjWxw2eHFfS2MSdaHVINFmhjo+qN1WhZhNimq0dZATN9pH0IDrpA==",
-      "license": "MIT",
       "dependencies": {
         "@types/mdast": "^4.0.0",
         "mdast-util-from-markdown": "^2.0.0",
@@ -17063,7 +17255,6 @@
       "version": "11.1.1",
       "resolved": "https://registry.npmjs.org/remark-rehype/-/remark-rehype-11.1.1.tgz",
       "integrity": "sha512-g/osARvjkBXb6Wo0XvAeXQohVta8i84ACbenPpoSsxTOQH/Ae0/RGP4WZgnMH5pMLpsj4FG7OHmcIcXxpza8eQ==",
-      "license": "MIT",
       "dependencies": {
         "@types/hast": "^3.0.0",
         "@types/mdast": "^4.0.0",
@@ -19229,7 +19420,6 @@
       "version": "11.0.5",
       "resolved": "https://registry.npmjs.org/unified/-/unified-11.0.5.tgz",
       "integrity": "sha512-xKvGhPWw3k84Qjh8bI3ZeJjqnyadK+GEFtazSfZv/rKeTkTjOJho6mFqh2SM96iIcZokxiOpg78GazTSg8+KHA==",
-      "license": "MIT",
       "dependencies": {
         "@types/unist": "^3.0.0",
         "bail": "^2.0.0",
@@ -19278,6 +19468,150 @@
         "url": "https://opencollective.com/unified"
       }
     },
+    "node_modules/unist-util-find": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/unist-util-find/-/unist-util-find-1.0.4.tgz",
+      "integrity": "sha512-T5vI7IkhroDj7KxAIy057VbIeGnCXfso4d4GoUsjbAmDLQUkzAeszlBtzx1+KHgdsYYBygaqUBvrbYCfePedZw==",
+      "dependencies": {
+        "lodash.iteratee": "^4.7.0",
+        "unist-util-visit": "^2.0.0"
+      }
+    },
+    "node_modules/unist-util-find-after": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/unist-util-find-after/-/unist-util-find-after-5.0.0.tgz",
+      "integrity": "sha512-amQa0Ep2m6hE2g72AugUItjbuM8X8cGQnFoHk0pGfrFeT9GZhzN5SW8nRsiGKK7Aif4CrACPENkA6P/Lw6fHGQ==",
+      "dependencies": {
+        "@types/unist": "^3.0.0",
+        "unist-util-is": "^6.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find-all-after": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/unist-util-find-all-after/-/unist-util-find-all-after-4.0.1.tgz",
+      "integrity": "sha512-AO8++e6HJfwNoTrqkV7xSeW65e6uSsLRQST/9LWi8FmFSz1gS7TBd+DkL/CYiElsSZIQgT4J5U54v5/kJX5Nqg==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find-all-after/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA=="
+    },
+    "node_modules/unist-util-find-all-after/node_modules/unist-util-is": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-5.2.1.tgz",
+      "integrity": "sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==",
+      "dependencies": {
+        "@types/unist": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find-all-before": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/unist-util-find-all-before/-/unist-util-find-all-before-4.0.1.tgz",
+      "integrity": "sha512-xg4UHtZ6VbcjQbfDtmLZch6kQYQFF3nfaW05Ie3+t2UectzeqSx/iqLmh/wWogwU+YDWnD40PjZKK7ORmCma+g==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^5.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find-all-before/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA=="
+    },
+    "node_modules/unist-util-find-all-before/node_modules/unist-util-is": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-5.2.1.tgz",
+      "integrity": "sha512-u9njyyfEh43npf1M+yGKDGVPbY/JWEemg5nH05ncKPfi+kBbKBJoTdsogMu33uhytuLlv9y0O7GH7fEdwLdLQw==",
+      "dependencies": {
+        "@types/unist": "^2.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find-all-between": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/unist-util-find-all-between/-/unist-util-find-all-between-2.1.0.tgz",
+      "integrity": "sha512-OCCUtDD8UHKeODw3TPXyFDxPCbpgBzbGTTaDpR68nvxkwiVcawBqMVrokfBMvUi7ij2F5q7S4s4Jq5dvkcBt+w==",
+      "dependencies": {
+        "unist-util-find": "^1.0.1",
+        "unist-util-is": "^4.0.2"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/unist-util-find-all-between/node_modules/unist-util-is": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-4.1.0.tgz",
+      "integrity": "sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg==",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find/node_modules/@types/unist": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@types/unist/-/unist-2.0.11.tgz",
+      "integrity": "sha512-CmBKiL6NNo/OqgmMn95Fk9Whlp2mtvIv+KNpQKN2F4SjvrEesubTRWGYSg+BnWZOnlCaSTU1sMpsBOzgbYhnsA=="
+    },
+    "node_modules/unist-util-find/node_modules/unist-util-is": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-4.1.0.tgz",
+      "integrity": "sha512-ZOQSsnce92GrxSqlnEEseX0gi7GH9zTJZ0p9dtu87WRb/37mMPO2Ilx1s/t9vBHrFhbgweUwb+t7cIn5dxPhZg==",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find/node_modules/unist-util-visit": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/unist-util-visit/-/unist-util-visit-2.0.3.tgz",
+      "integrity": "sha512-iJ4/RczbJMkD0712mGktuGpm/U4By4FfDonL7N/9tATGIF4imikjOuagyMY53tnZq3NP6BcmlrHhEKAfGWjh7Q==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^4.0.0",
+        "unist-util-visit-parents": "^3.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
+    "node_modules/unist-util-find/node_modules/unist-util-visit-parents": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/unist-util-visit-parents/-/unist-util-visit-parents-3.1.1.tgz",
+      "integrity": "sha512-1KROIZWo6bcMrZEwiH2UrXDyalAa0uqzWCxCJj6lPOvTve2WkfgCytoDTPaMnodXh1WrXOq0haVYHj99ynJlsg==",
+      "dependencies": {
+        "@types/unist": "^2.0.0",
+        "unist-util-is": "^4.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/unified"
+      }
+    },
     "node_modules/unist-util-is": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/unist-util-is/-/unist-util-is-6.0.0.tgz",
@@ -20887,10 +21221,9 @@
       "license": "ISC"
     },
     "node_modules/yaml": {
-      "version": "2.6.0",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.6.0.tgz",
-      "integrity": "sha512-a6ae//JvKDEra2kdi1qzCyrJW/WZCgFi8ydDV+eXExl95t+5R+ijnqHJbz9tmMh8FUjx3iv2fCQ4dclAQlO2UQ==",
-      "license": "ISC",
+      "version": "2.6.1",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.6.1.tgz",
+      "integrity": "sha512-7r0XPzioN/Q9kXBro/XPnA6kznR73DHq+GXh5ON7ZozRO6aMjbmiBuKste2wslTFkC5d1dw0GooOCepZXJ2SAg==",
       "bin": {
         "yaml": "bin.mjs"
       },
diff --git a/package.json b/package.json
index dbd4240..4ccc22c 100644
--- a/package.json
+++ b/package.json
@@ -52,8 +52,19 @@
     "nuxt": "^3.13.0",
     "ofetch": "^1.4.1",
     "popmotion": "^11.0.5",
+    "rehype-highlight": "^7.0.1",
+    "rehype-raw": "^7.0.0",
+    "rehype-sanitize": "^6.0.0",
+    "rehype-slug": "^6.0.0",
+    "rehype-stringify": "^10.0.1",
+    "remark-behead": "^3.1.0",
+    "remark-breaks": "^4.0.0",
+    "remark-mdc": "^3.5.0",
+    "remark-parse": "^11.0.0",
+    "remark-rehype": "^11.1.1",
     "remove-markdown": "^0.5.5",
     "sortablejs": "^1.15.3",
+    "unified": "^11.0.5",
     "uuid": "^11.0.2",
     "vue": "^3.5",
     "vue-content-loader": "^2.0.1",
diff --git a/pages/beta/admin/organizations/[oid]/discussions.vue b/pages/beta/admin/organizations/[oid]/discussions.vue
index 5ba934c..07a085f 100644
--- a/pages/beta/admin/organizations/[oid]/discussions.vue
+++ b/pages/beta/admin/organizations/[oid]/discussions.vue
@@ -80,7 +80,8 @@ import { Pagination } from '@datagouv/components'
 import { refDebounced } from '@vueuse/core'
 import { computed, ref } from 'vue'
 import { useI18n } from 'vue-i18n'
-import type { DiscussionSortedBy, PaginatedArray, SortDirection, Thread } from '~/types/types'
+import type { DiscussionSortedBy, Thread } from '~/types/discussions'
+import type { PaginatedArray, SortDirection } from '~/types/types'
 import AdminDiscussionsTable from '~/components/AdminTable/AdminDiscussionsTable/AdminDiscussionsTable.vue'
 import Breadcrumb from '~/components/Breadcrumb/Breadcrumb.vue'
 
diff --git a/pages/posts/[id].vue b/pages/posts/[id].vue
new file mode 100644
index 0000000..dbb475f
--- /dev/null
+++ b/pages/posts/[id].vue
@@ -0,0 +1,71 @@
+<!-- eslint-disable vue/no-v-html -->
+<template>
+  <div class="container mb-24">
+    <Breadcrumb>
+      <li>
+        <NuxtLinkLocale
+          class="fr-breadcrumb__link"
+          :external="true"
+          to="/"
+        >
+          {{ $t('Home') }}
+        </NuxtLinkLocale>
+      </li>
+      <li>
+        <NuxtLinkLocale
+          class="fr-breadcrumb__link"
+          to="/posts"
+        >
+          {{ $t('Posts') }}
+        </NuxtLinkLocale>
+      </li>
+      <li>
+        <a
+          class="fr-breadcrumb__link"
+          aria-current="page"
+        >
+          {{ post.name }}
+        </a>
+      </li>
+    </Breadcrumb>
+    <h1 class="text-4.5xl font-extrabold !mb-0">
+      {{ post.name }}
+    </h1>
+    <p
+      v-if="post.published"
+      class="text-xs mb-0"
+    >
+      {{ $t('Published on {date}', { date: formatDate(post.published) }) }}
+    </p>
+    <p class="mt-4 mb-6">
+      {{ post.headline }}
+    </p>
+    <img
+      v-if="post.image"
+      :src="post.image"
+      class="w-full h-auto"
+    >
+    <MarkdownViewer
+      v-if="post.body_type === 'markdown'"
+      :content="post.content"
+      :min-heading="2"
+    />
+    <div
+      v-else
+      :class="markdownClasses"
+      v-html="post.content"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { formatDate } from '@datagouv/components'
+import type { Post } from '~/types/posts'
+
+const route = useRoute()
+const me = useMaybeMe()
+
+const { data: post } = await useAPI<Post>(`/api/1/posts/${route.params.id}/`, {
+  key: `${me.value ? me.value.id : 'guest'}-posts-${route.params.id}`,
+})
+</script>
diff --git a/pages/posts/index.vue b/pages/posts/index.vue
new file mode 100644
index 0000000..3f2172a
--- /dev/null
+++ b/pages/posts/index.vue
@@ -0,0 +1,58 @@
+<template>
+  <div>
+    <div class="container">
+      <Breadcrumb>
+        <li>
+          <NuxtLinkLocale
+            class="fr-breadcrumb__link"
+            :external="true"
+            to="/"
+          >
+            {{ $t('Home') }}
+          </NuxtLinkLocale>
+        </li>
+        <li>
+          <a
+            class="fr-breadcrumb__link"
+            aria-current="page"
+          >
+            {{ $t('Posts') }}
+          </a>
+        </li>
+      </Breadcrumb>
+    </div>
+    <div class="border-b border-grey-lowest">
+      <div class="container">
+        <h1 class="text-4.5xl font-extrabold pt-10 pb-[3.75rem] !mb-0">
+          {{ $t('Posts') }}
+        </h1>
+      </div>
+    </div>
+    <div class="container mt-16">
+      <div class="grid grid-cols-3 gap-5">
+        <PostCard
+          v-for="post in posts.data"
+          :key="post.id"
+          :post
+        />
+      </div>
+      <Pagination
+        :page="posts.page"
+        :page-size="posts.page_size"
+        :total-results="posts.total"
+      />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { Pagination } from '@datagouv/components'
+import type { Post } from '~/types/posts'
+import type { PaginatedArray } from '~/types/types'
+
+const { data: posts } = await useAPI<PaginatedArray<Post>>('api/1/posts', { params:
+  {
+    page_size: 15,
+  },
+})
+</script>
diff --git a/plugins/api.ts b/plugins/api.ts
index 56d859e..81c69bd 100644
--- a/plugins/api.ts
+++ b/plugins/api.ts
@@ -1,55 +1,65 @@
-export default defineNuxtPlugin((nuxtApp) => {
-  const config = useRuntimeConfig()
-  const token = useToken()
-  const cookie = useRequestHeader('cookie')
-  const localePath = useLocalePath()
-  const { toast } = useToast()
+import type { NuxtApp } from '#app'
 
-  const makeApi = (sendJson = true) => {
-    return $fetch.create({
-      baseURL: config.public.apiBase,
-      onRequest({ options }) {
-        if (sendJson) {
-          options.headers.set('Content-Type', 'application/json')
-        }
-        options.headers.set('Accept', 'application/json')
-        options.credentials = 'include'
-        if (token.value) {
-          options.headers.set('Authentication-Token', token.value)
-        }
-        if (cookie) {
-          options.headers.set('Cookie', cookie)
-        }
-      },
-      async onResponseError({ response }) {
-        if (response.status === 401) {
-          await nuxtApp.runWithContext(() => navigateTo(localePath('/login')))
-        }
+export default defineNuxtPlugin({
+  async setup(nuxtApp) {
+    const config = useRuntimeConfig()
+    const token = useToken()
+    const cookie = useRequestHeader('cookie')
+    const localePath = useLocalePath()
+    const { toast } = useToast()
+    const makeApi = (sendJson = true) => {
+      return $fetch.create({
+        baseURL: config.public.apiBase,
+        onRequest({ options }) {
+          if (sendJson) {
+            options.headers.set('Content-Type', 'application/json')
+          }
+          options.headers.set('Accept', 'application/json')
+          options.credentials = 'include'
+          if (token.value) {
+            options.headers.set('Authentication-Token', token.value)
+          }
+          if (cookie) {
+            options.headers.set('Cookie', cookie)
+          }
+          const i18n = nuxtApp.$i18n as NuxtApp['$i18n']
+          if (i18n.locale.value) {
+            if (!options.params) {
+              options.params = {}
+            }
+            options.params['lang'] = i18n.locale.value
+          }
+        },
+        async onResponseError({ response }) {
+          if (response.status === 401) {
+            await nuxtApp.runWithContext(() => navigateTo(localePath('/login')))
+          }
 
-        let message
-        try {
-          if ('error' in response._data) {
-            message = response._data.error
+          let message
+          try {
+            if ('error' in response._data) {
+              message = response._data.error
+            }
+            else if ('message' in response._data) {
+              message = response._data.message
+            }
           }
-          else if ('message' in response._data) {
-            message = response._data.message
+          catch (e) {
+            console.error(e)
+            message = (nuxtApp.$i18n as NuxtApp['$i18n']).t('The API returned an unexpected error')
           }
-        }
-        catch (e) {
-          console.error(e)
-          message = nuxtApp.$i18n.t('The API returned an unexpected error')
-        }
 
-        toast.error(message)
-      },
-    })
-  }
+          toast.error(message)
+        },
+      })
+    }
 
-  // Expose to useNuxtApp().$api
-  return {
-    provide: {
-      api: makeApi(),
-      fileApi: makeApi(false),
-    },
-  }
+    // Expose to useNuxtApp().$api
+    return {
+      provide: {
+        api: makeApi(),
+        fileApi: makeApi(false),
+      },
+    }
+  },
 })
diff --git a/tailwind.config.js b/tailwind.config.js
index e9a69ea..c4c9c66 100644
--- a/tailwind.config.js
+++ b/tailwind.config.js
@@ -28,6 +28,9 @@ export default {
         spectral: 'Spectral',
         gothic: 'URW Gothic',
       },
+      fontSize: {
+        '4.5xl': '2.75rem',
+      },
       colors: {
         primary: '#3558a2',
         mentionGrey: '#666', // Copy from --text-mention-grey
@@ -35,6 +38,7 @@ export default {
           title: '#161616',
           medium: '#666666',
           lower: '#eeeeee',
+          lowest: '#e8eaed',
           default: '#e5e5e5',
           plain: '#3a3a3a',
           some: '#f6f6f6',
diff --git a/types/discussions.ts b/types/discussions.ts
new file mode 100644
index 0000000..9d0eafa
--- /dev/null
+++ b/types/discussions.ts
@@ -0,0 +1,46 @@
+import type { Dataservice, Dataset, Reuse, User } from '@datagouv/components'
+import type { Post } from './posts'
+
+export type DiscussionSortedBy = 'title' | 'created' | 'closed'
+
+export type Spam = {
+  status?: string
+}
+
+export type Subject = {
+  id: string
+  class: string
+}
+
+export type Comment = { content: string, posted_by: User, posted_on: string, spam?: Spam }
+
+export type Discussion = Array<Comment>
+
+export type DiscussionSubjectTypes = Dataservice | Dataset | Reuse | Post
+
+export type DiscussionSubject = {
+  class: 'Dataservice' | 'Dataset' | 'Reuse' | 'Post' | 'Topic' | 'Organization'
+  id: string
+}
+
+export type NewDiscussion = {
+  title: string
+  comment: string
+  subject: Subject
+}
+
+export type CreateDiscussion = (discussion: NewDiscussion) => Promise<Thread>
+
+export type CreateComment = (comment: string) => Promise<Thread>
+
+export type Thread = {
+  id: string
+  discussion: Discussion
+  title: string
+  url: string
+  created: string
+  closed: string
+  closed_by: User
+  spam?: Spam
+  subject: DiscussionSubject
+}
diff --git a/types/posts.ts b/types/posts.ts
new file mode 100644
index 0000000..a7d49cf
--- /dev/null
+++ b/types/posts.ts
@@ -0,0 +1,22 @@
+import type { Dataset, Reuse, User } from '@datagouv/components'
+
+export type Post = {
+  body_type: 'markdown' | 'html'
+  content: string
+  created_at: string
+  credit_to: string
+  credit_url: string
+  datasets: Array<Pick<Dataset, 'acronym' | 'id' | 'page' | 'title' | 'uri'>>
+  headline: string
+  id: string
+  image: string | null
+  last_modified: string
+  name: string
+  owner: User
+  page: string
+  published: string | null
+  reuses: Array<Pick<Reuse, 'id' | 'image' | 'image_thumbnail' | 'page' | 'title' | 'uri'>>
+  slug: string
+  tags: Array<string>
+  url: string
+}
diff --git a/types/types.d.ts b/types/types.d.ts
index ea16c38..5d831e4 100644
--- a/types/types.d.ts
+++ b/types/types.d.ts
@@ -1,9 +1,14 @@
-import type { Dataset, Dataservice, Reuse, User, Frequency, Organization, License, ReuseType, Schema, RegisteredSchema, OwnedWithId } from '@datagouv/components'
+import type { Dataset, Dataservice, Reuse, User, Frequency, Organization, License, ReuseType, RegisteredSchema } from '@datagouv/components'
 
 export type AxisAlignment = 'start' | 'center' | 'end'
 
 export type SortDirection = 'asc' | 'desc'
 
+export type Sort = {
+  name: string
+  key: string
+}
+
 export type DSFRFormDefaultState = 'default'
 
 export type DSFRFormFunctionalState = 'error' | 'success'
@@ -41,35 +46,8 @@ export type DataserviceSortedBy = 'title'
 
 export type ReuseSortedBy = 'title' | 'created' | 'datasets' | 'followers' | 'views'
 
-export type DiscussionSortedBy = 'title' | 'created' | 'closed'
-
 export type CommunityResourceSortedBy = 'created_at_internal' | 'last_modified_internal' | 'title'
 
-// DISCUSSIONS
-
-export type Comment = { content: string, posted_by: User, posted_on: string, spam?: Spam }
-
-export type Discussion = Array<Comment>
-
-export type DiscussionSubjectTypes = Dataservice | Dataset | Reuse
-
-export type DiscussionSubject = {
-  class: 'Dataservice' | 'Dataset' | 'Reuse' | 'Post' | 'Topic' | 'Organization'
-  id: string
-}
-
-export type Thread = {
-  id: string
-  discussion: Discussion
-  title: string
-  url: string
-  created: string
-  closed: string
-  closed_by: User
-  spam?: Spam
-  subject: DiscussionSubject
-}
-
 // MEMBERS
 
 export type MembershipStatus = 'pending' | 'accepted' | 'refused'
diff --git a/utils/discussions.ts b/utils/discussions.ts
index a94e910..d631e18 100644
--- a/utils/discussions.ts
+++ b/utils/discussions.ts
@@ -1,7 +1,7 @@
 import type { Dataservice, Dataset, Reuse } from '@datagouv/components'
 import { RiArticleLine, RiDatabase2Line, RiLineChartLine, RiTerminalLine } from '@remixicon/vue'
 import type { $Fetch } from 'ofetch'
-import type { DiscussionSubject, DiscussionSubjectTypes } from '~/types/types'
+import type { DiscussionSubject, DiscussionSubjectTypes } from '~/types/discussions'
 
 export async function getSubject(api: $Fetch, subject: DiscussionSubject): Promise<DiscussionSubjectTypes | null> {
   switch (subject.class) {
@@ -24,7 +24,7 @@ export function getSubjectTitle(subject: DiscussionSubjectTypes) {
     return subject.title
   }
 
-  return throwOnNever(subject, `Unknown type ${subject}`)
+  return throwOnNever(subject as never, `Unknown type ${subject}`)
 };
 
 export function getSubjectPage(subject: DiscussionSubjectTypes) {
diff --git a/utils/markdown.ts b/utils/markdown.ts
new file mode 100644
index 0000000..c3cb53a
--- /dev/null
+++ b/utils/markdown.ts
@@ -0,0 +1,54 @@
+import behead from 'remark-behead'
+import remarkBreaks from 'remark-breaks'
+import rehypeHighlight from 'rehype-highlight'
+import remarkMDC from 'remark-mdc'
+import remarkParse from 'remark-parse'
+import remarkRehype from 'remark-rehype'
+import rehypeRaw from 'rehype-raw'
+import rehypeSanitize from 'rehype-sanitize'
+import rehypeSlug from 'rehype-slug'
+import rehypeStringify from 'rehype-stringify'
+import { unified } from 'unified'
+import { RiLinksLine } from '@remixicon/vue'
+import { render } from 'vue'
+
+const prose = 'prose prose-neutral max-w-none prose-strong:text-gray-plain'
+const proseTable = 'prose-table:bg-neutral-200 prose-table:!overflow-visible first-of-type:prose-tr:!bg-neutral-200 first-of-type:prose-tr:border-b-2 first-of-type:prose-tr:border-black odd:prose-tr:bg-neutral-300 *:prose-th:m-0 *:prose-td:m-0 prose-th:p-4 prose-td:p-4'
+const proseHeading = 'prose-h2:!text-2xl prose-h2:!leading-7 prose-h3:!text-xl prose-h3:!leading-6 prose-h4:!text-base prose-h5:!text-sm prose-h5:!leading-6 prose-headings:!font-extrabold'
+const proseList = 'prose-ul:list-disc'
+const proseCode = 'prose-pre:font-mono prose-pre:bg-neutral-200 prose-pre:text-neutral-600'
+const proseOthers = 'prose-blockquote:border-neutral-800 prose-a:no-underline prose-a:text-gray-plain prose-a:font-[number:inherit] prose-li:p-0 *:prose-li:m-0'
+
+export const markdownClasses = [prose, proseTable, proseHeading, proseList, proseCode, proseOthers].join(' ')
+
+export function formatMarkdown(md: string, minDepth = 3) {
+  let el: HTMLElement | string = ''
+  if (document) {
+    el = document.createElement('span')
+    render(h(RiLinksLine), el)
+  }
+
+  return unified()
+    // somehow this type is working when `minDepth` is required but not when it has a default value
+    .use(behead, { minDepth })
+    // Take Markdown as input and turn it into MD syntax tree
+    .use(remarkParse, { fragment: true })
+    .use(remarkBreaks)
+    // Use `remark-mdc` plugin to parse MDC syntax
+    .use(remarkMDC)
+    // Switch from MD syntax tree to HTML syntax tree (remakr -> rehype)
+    .use(remarkRehype, {
+    // Necessary for support HTML embeds (see next plugin)
+      allowDangerousHtml: true,
+    })
+    // Support HTML embedded inside markdown
+    .use(rehypeRaw)
+    // Improve code highlighting
+    .use(rehypeHighlight)
+    .use(rehypeSlug)
+    .use(rehypeSanitize)
+    // Serialize syntax tree to HTML
+    .use(rehypeStringify)
+    // And finally, process the input
+    .processSync(md)
+}