diff --git a/addons/website/__manifest__.py b/addons/website/__manifest__.py
index d0162551820..079fb14cf8d 100644
--- a/addons/website/__manifest__.py
+++ b/addons/website/__manifest__.py
@@ -63,6 +63,7 @@
         'views/snippets/s_showcase.xml',
         'views/snippets/s_timeline.xml',
         'views/snippets/s_process_steps.xml',
+        'views/snippets/s_text_highlight.xml',
         'views/snippets/s_mega_menu_multi_menus.xml',
         'views/snippets/s_mega_menu_menu_image_menu.xml',
         'views/website_views.xml',
diff --git a/addons/website/static/src/img/snippets_thumbs/s_color_block.png b/addons/website/static/src/img/snippets_thumbs/s_color_block.png
new file mode 100644
index 00000000000..9894311998e
Binary files /dev/null and b/addons/website/static/src/img/snippets_thumbs/s_color_block.png differ
diff --git a/addons/website/static/src/snippets/s_text_highlight/000.scss b/addons/website/static/src/snippets/s_text_highlight/000.scss
new file mode 100644
index 00000000000..7728cff487e
--- /dev/null
+++ b/addons/website/static/src/snippets/s_text_highlight/000.scss
@@ -0,0 +1,5 @@
+.s_text_highlight {
+    padding: 12px 8px 18px;
+    border-radius: 5px;
+    border: 1px solid rgba(white, 0.2);
+}
diff --git a/addons/website/views/snippets/s_text_highlight.xml b/addons/website/views/snippets/s_text_highlight.xml
new file mode 100644
index 00000000000..5db6533d293
--- /dev/null
+++ b/addons/website/views/snippets/s_text_highlight.xml
@@ -0,0 +1,41 @@
+<?xml version="1.0" encoding="utf-8"?>
+<odoo>
+
+<template name="Text Highlight" id="s_text_highlight">
+    <div class="s_text_highlight bg-gamma o_animation mt32 mb32 text-center w-100">
+        <div class="container">
+            <h3>Text Highlight</h3>
+            <h4>Change the color of this box</h4>
+            <p>Put the focus on what you have to say!</p>
+        </div>
+    </div>
+</template>
+
+<template id="s_text_highlight_options" inherit_id="website.snippet_options">
+    <xpath expr="//div[@id='so_main_colorpicker']" position="attributes">
+        <attribute name="data-selector" add=".s_text_highlight"/>
+    </xpath>
+    <xpath expr="//div[@id='so_width']" position="attributes">
+        <attribute name="data-selector" add=".s_text_highlight"/>
+    </xpath>
+    <xpath expr="//div[@id='so_text_align']" position="attributes">
+        <attribute name="data-selector" add=".s_text_highlight"/>
+    </xpath>
+    <xpath expr="//div[@data-js='background']" position="before">
+        <div data-selector=".s_text_highlight">
+            <we-select string="Position">
+                <we-button data-select-class="">Left</we-button>
+                <we-button data-select-class="mx-auto">Center</we-button>
+                <we-button data-select-class="ml-auto">Right</we-button>
+            </we-select>
+        </div>
+    </xpath>
+</template>
+
+<template id="assets_snippet_s_text_highlight_css_000" inherit_id="website.assets_frontend">
+    <xpath expr="//link[last()]" position="after">
+        <link rel="stylesheet" type="text/scss" href="/website/static/src/snippets/s_text_highlight/000.scss"/>
+    </xpath>
+</template>
+
+</odoo>
diff --git a/addons/website/views/snippets/snippets.xml b/addons/website/views/snippets/snippets.xml
index d97548de920..5d7f322f3f7 100644
--- a/addons/website/views/snippets/snippets.xml
+++ b/addons/website/views/snippets/snippets.xml
@@ -94,7 +94,7 @@
                     <t t-snippet="website.s_share" t-thumbnail="/website/static/src/img/snippets_thumbs/s_share.png"/>
                     <t id="sale_product_search_input_hook"/>
                     <t id="mass_mailing_newsletter_hook"/>
-                    <!-- Text Highlight -->
+                    <t t-snippet="website.s_text_highlight" t-thumbnail="/website/static/src/img/snippets_thumbs/s_color_block.png"/>
                     <t t-snippet="website.s_chart" t-thumbnail="/website/static/src/img/snippets_thumbs/s_chart.png"/>
                     <!-- Progress Bar -->
                     <!-- Tags -->
@@ -326,7 +326,7 @@
         t-att-data-selector="so_snippet_addition_selector"
         data-drop-in=":not(p).oe_structure:not(.oe_structure_solo), :not(p)[data-oe-type=html], :not(p).oe_structure.oe_structure_solo:not(:has(> section, > div))"/>
 
-    <t t-set="so_content_addition_selector" t-translation="off">blockquote, .s_card, .s_alert, .o_facebook_page, .s_share, .s_rating, .s_hr, .s_countdown, .s_chart</t>
+    <t t-set="so_content_addition_selector" t-translation="off">blockquote, .s_card, .s_alert, .o_facebook_page, .s_share, .s_rating, .s_hr, .s_countdown, .s_chart, .s_text_highlight</t>
     <div id="so_content_addition"
         t-att-data-selector="so_content_addition_selector"
         t-attf-data-drop-near="p, h1, h2, h3, .row > div > img, #{so_content_addition_selector}"