diff --git a/ghost/admin/app/components/custom-theme-settings/announcement.hbs b/ghost/admin/app/components/custom-theme-settings/announcement.hbs
new file mode 100644
index 0000000000..75adf39fe3
--- /dev/null
+++ b/ghost/admin/app/components/custom-theme-settings/announcement.hbs
@@ -0,0 +1,9 @@
+<div class="gh-stack-item {{if (eq @index 0) "gh-setting-first" "gh-setting"}}">
+    <div class="gh-announcement-editor">
+        <KoenigLexicalEditorInput
+            @placeholderText="Enter text"
+            @html={{'<p><span>check</span> <a href="https://ghost.org/changelog/markdown/" dir="ltr"><span data-lexical-text="true">ghost.org/changelog/markdown/</span></a></p>'}}
+            @onChangeHtml={{this.onChangeHtml}}
+        />
+    </div>
+</div>
\ No newline at end of file
diff --git a/ghost/admin/app/components/custom-theme-settings/announcement.js b/ghost/admin/app/components/custom-theme-settings/announcement.js
new file mode 100644
index 0000000000..8084e3d1d5
--- /dev/null
+++ b/ghost/admin/app/components/custom-theme-settings/announcement.js
@@ -0,0 +1,10 @@
+import Component from '@glimmer/component';
+import {action} from '@ember/object';
+
+export default class CustomThemeSettingsAnnouncementComponent extends Component {
+    @action
+    // eslint-disable-next-line no-unused-vars
+    onChangeHtml(html) {
+        this.args.onChange?.();
+    }
+}
diff --git a/ghost/admin/app/components/koenig-lexical-editor-input.js b/ghost/admin/app/components/koenig-lexical-editor-input.js
index 47ff7e3224..e32bef7487 100644
--- a/ghost/admin/app/components/koenig-lexical-editor-input.js
+++ b/ghost/admin/app/components/koenig-lexical-editor-input.js
@@ -133,7 +133,7 @@ export default class KoenigLexicalEditorInput extends Component {
                                 singleParagraph={true}
                                 className="koenig-lexical-editor-input"
                                 placeholderText={props.placeholderText}
-                                placeholderClassName=""
+                                placeholderClassName="koenig-lexical-editor-input-placeholder"
                             >
                                 <HtmlOutputPlugin html={props.html} setHtml={props.onChangeHtml} />
                             </KoenigComposableEditor>
diff --git a/ghost/admin/app/components/settings/design/theme-settings-form.hbs b/ghost/admin/app/components/settings/design/theme-settings-form.hbs
index 8e12981bd2..ff4b358543 100644
--- a/ghost/admin/app/components/settings/design/theme-settings-form.hbs
+++ b/ghost/admin/app/components/settings/design/theme-settings-form.hbs
@@ -17,5 +17,8 @@
                 <CustomThemeSettings::Image @setting={{setting}} @index={{index}} @onChange={{@updatePreview}} />
             {{/if}}
         {{/each}}
+        {{#if (feature 'announcementBar')}}
+            <CustomThemeSettings::Announcement @onChange={{@updatePreview}} />
+        {{/if}}
     </form>
 </div>
\ No newline at end of file
diff --git a/ghost/admin/app/services/feature.js b/ghost/admin/app/services/feature.js
index 224d8e7333..ca05ee2bf1 100644
--- a/ghost/admin/app/services/feature.js
+++ b/ghost/admin/app/services/feature.js
@@ -74,6 +74,7 @@ export default class FeatureService extends Service {
     @feature('migrateApp') migrateApp;
     @feature('i18n') i18n;
     @feature('postHistory') postHistory;
+    @feature('announcementBar') announcementBar;
 
     _user = null;
 
diff --git a/ghost/admin/app/styles/layouts/editor.css b/ghost/admin/app/styles/layouts/editor.css
index d7d43485b5..4d916fe233 100644
--- a/ghost/admin/app/styles/layouts/editor.css
+++ b/ghost/admin/app/styles/layouts/editor.css
@@ -1089,3 +1089,11 @@ figure {
     transform: translateX(0); /* used for dynamic positioning with js */
     padding-right: 8px; /* extra padding used for dynamic positioning with js */
 }
+
+.gh-announcement-editor {
+    width: 100%;
+}
+
+.gh-announcement-editor div {
+    width: 100%;
+}
diff --git a/ghost/admin/app/templates/settings/labs.hbs b/ghost/admin/app/templates/settings/labs.hbs
index 3a265b7541..4853934115 100644
--- a/ghost/admin/app/templates/settings/labs.hbs
+++ b/ghost/admin/app/templates/settings/labs.hbs
@@ -318,6 +318,20 @@
                         </div>
                     </div>
                 </div>
+
+                <div class="gh-expandable-block">
+                    <div class="gh-expandable-header">
+                        <div>
+                            <h4 class="gh-expandable-title">Announcement bar</h4>
+                            <p class="gh-expandable-description">
+                                Allows publishers to set a banner at the top of their site
+                            </p>
+                        </div>
+                        <div class="for-switch">
+                            <GhFeatureFlag @flag="announcementBar" />
+                        </div>
+                    </div>
+                </div>
             </div>
         </div>
         {{/if}}
diff --git a/ghost/core/core/shared/labs.js b/ghost/core/core/shared/labs.js
index 1a52915e75..897998d58f 100644
--- a/ghost/core/core/shared/labs.js
+++ b/ghost/core/core/shared/labs.js
@@ -40,7 +40,8 @@ const ALPHA_FEATURES = [
     'websockets',
     'stripeAutomaticTax',
     'makingItRain',
-    'postHistory'
+    'postHistory',
+    'announcementBar'
 ];
 
 module.exports.GA_KEYS = [...GA_FEATURES];