diff --git a/package-lock.json b/package-lock.json
index 43b49f6d8705..2778b13e2a54 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -58,6 +58,7 @@
                 "lodash-es": "4.17.21",
                 "markdown-it": "14.1.0",
                 "markdown-it-class": "1.0.0",
+                "markdown-it-github-alerts": "0.3.0",
                 "markdown-it-highlightjs": "4.2.0",
                 "mobile-drag-drop": "3.0.0-rc.0",
                 "monaco-editor": "0.52.2",
@@ -16132,6 +16133,18 @@
             "integrity": "sha512-CVDYqSgmErLAqInwWu8WmAR2nX6MMIBIt8LB6qg8DNldca9+aoC6ZyuY0lvBMsaTSHNFJRkcHVR1XjLw9nr9qQ==",
             "license": "MIT"
         },
+        "node_modules/markdown-it-github-alerts": {
+            "version": "0.3.0",
+            "resolved": "https://registry.npmjs.org/markdown-it-github-alerts/-/markdown-it-github-alerts-0.3.0.tgz",
+            "integrity": "sha512-qyIuDyfdrVGHhY+E/44yMyNA3ZnayaT/KKT2VgkIz1nmrgiuPkdgPUh4YBZwgJ9VKEGJvGd82Ndrc4oGftrJWg==",
+            "license": "MIT",
+            "funding": {
+                "url": "https://github.com/sponsors/antfu"
+            },
+            "peerDependencies": {
+                "markdown-it": "^14.0.0"
+            }
+        },
         "node_modules/markdown-it-highlightjs": {
             "version": "4.2.0",
             "resolved": "https://registry.npmjs.org/markdown-it-highlightjs/-/markdown-it-highlightjs-4.2.0.tgz",
diff --git a/package.json b/package.json
index 434edc7d2908..77f09e64b2d4 100644
--- a/package.json
+++ b/package.json
@@ -61,6 +61,7 @@
         "lodash-es": "4.17.21",
         "markdown-it": "14.1.0",
         "markdown-it-class": "1.0.0",
+        "markdown-it-github-alerts": "0.3.0",
         "markdown-it-highlightjs": "4.2.0",
         "mobile-drag-drop": "3.0.0-rc.0",
         "monaco-editor": "0.52.2",
diff --git a/src/main/webapp/app/shared/util/markdown.conversion.util.ts b/src/main/webapp/app/shared/util/markdown.conversion.util.ts
index d5166b70d690..07e5640c4207 100644
--- a/src/main/webapp/app/shared/util/markdown.conversion.util.ts
+++ b/src/main/webapp/app/shared/util/markdown.conversion.util.ts
@@ -6,7 +6,7 @@ import markdownItClass from 'markdown-it-class';
 import markdownItKatex from '@vscode/markdown-it-katex';
 import markdownItHighlightjs from 'markdown-it-highlightjs';
 import TurndownService from 'turndown';
-
+import MarkdownItGitHubAlerts from 'markdown-it-github-alerts';
 /**
  * Add these classes to the converted html.
  */
@@ -66,12 +66,13 @@ export function htmlForMarkdown(
         md.use(extension);
     }
 
-    // Add default extensions (Code Highlight, Latex)
+    // Add default extensions (Code Highlight, Latex, Alerts)
     md.use(markdownItHighlightjs)
         .use(formulaCompatibilityPlugin.getExtension())
         .use(markdownItKatex, {
             enableMathInlineInHtml: true,
         })
+        .use(MarkdownItGitHubAlerts)
         .use(markdownItClass, classMap);
     let markdownRender = md.render(markdownText);
     if (markdownRender.endsWith('\n')) {
diff --git a/src/main/webapp/content/scss/global.scss b/src/main/webapp/content/scss/global.scss
index 0f0cb5e6705d..227f3f2590e0 100644
--- a/src/main/webapp/content/scss/global.scss
+++ b/src/main/webapp/content/scss/global.scss
@@ -10,6 +10,10 @@
 @import 'node_modules/@siemens/ngx-datatable/themes/bootstrap';
 // Needed for emojis in metis reactions
 @import 'node_modules/@ctrl/ngx-emoji-mart/picker';
+// Needed for markdown-it-github-alerts and markdown callouts
+@import 'markdown-it-github-alerts/styles/github-colors-light.css';
+@import 'markdown-it-github-alerts/styles/github-colors-dark-media.css';
+@import 'markdown-it-github-alerts/styles/github-base.css';
 
 // Smooth transition between themes
 * {