diff --git a/src/components/Banner.astro b/src/components/Banner.astro
new file mode 100644
index 0000000..4125084
--- /dev/null
+++ b/src/components/Banner.astro
@@ -0,0 +1,26 @@
+---
+// src/components/Banner.astro
+import "../styles/components/Banner.css"
+
+const API_BASE = 'https://cms.gallus-pub.ch';
+
+let banner = null;
+
+try {
+  const response = await fetch(`${API_BASE}/api/banners/active`);
+  if (response.ok) {
+    const data = await response.json();
+    banner = data.banner;
+  }
+} catch (error) {
+  console.error('Failed to fetch banner:', error);
+}
+---
+
+{banner && (
+  <div class="banner-wrapper">
+    <div class="banner container">
+      <p>{banner.text}</p>
+    </div>
+  </div>
+)}