From 54c79777093dea8227b3cf2d2aa932e4f1e1fe57 Mon Sep 17 00:00:00 2001
From: Brieuc-brd <brd@odoo.com>
Date: Thu, 24 Oct 2024 13:35:06 +0200
Subject: [PATCH] [IMP] theme_artists, *: adapt background shapes

*: theme_avantgarde, theme_aviato, theme_beauty, theme_bewise,
theme_bistro, theme_bookstore, theme_buzzy, theme_clean, theme_cobalt,
theme_enark, theme_graphene, theme_kea, theme_kiddo, theme_monglia,
theme_notes, theme_odoo_experts, theme_orchid, theme_real_estate,
theme_treehouse, theme_vehicle, theme_yes, theme_zap

This commit adapts background shapes in theme customizations where
shapes have been removed or added during the introduction of
"Connections" shapes.

task-4251568

closes odoo/design-themes#996

Related: odoo/odoo#185342
Signed-off-by: Benjamin Vray (bvr) <bvr@odoo.com>
---
 theme_artists/views/new_page_template.xml     | 22 +++++-----
 theme_artists/views/snippets/s_cover.xml      |  6 +--
 .../views/snippets/s_image_text_box.xml       |  4 ++
 .../views/snippets/s_key_benefits.xml         |  4 ++
 theme_artists/views/snippets/s_kickoff.xml    |  4 +-
 theme_artists/views/snippets/s_striped.xml    |  4 +-
 .../views/snippets/s_striped_center_top.xml   |  4 +-
 .../views/snippets/s_striped_top.xml          |  4 +-
 theme_avantgarde/views/customizations.xml     | 13 +++---
 theme_avantgarde/views/new_page_template.xml  | 12 +++---
 theme_aviato/views/new_page_template.xml      | 20 +++++-----
 theme_aviato/views/snippets/s_banner.xml      |  4 +-
 theme_aviato/views/snippets/s_big_number.xml  |  4 +-
 theme_aviato/views/snippets/s_cover.xml       |  4 +-
 theme_aviato/views/snippets/s_key_images.xml  |  4 +-
 .../views/snippets/s_masonry_block.xml        |  4 +-
 theme_beauty/views/new_page_template.xml      | 24 +++++------
 .../views/snippets/s_company_team.xml         |  4 +-
 theme_beauty/views/snippets/s_title.xml       |  4 +-
 theme_bewise/views/customizations.xml         |  4 +-
 theme_bewise/views/new_page_template.xml      | 10 +++--
 theme_bistro/views/new_page_template.xml      | 32 +++++++--------
 theme_bistro/views/snippets/s_cover.xml       |  4 +-
 .../views/snippets/s_product_catalog.xml      |  4 +-
 .../snippets/s_quotes_carousel_minimal.xml    |  4 +-
 theme_bookstore/views/snippets/s_banner.xml   |  4 +-
 theme_bookstore/views/snippets/s_cta_box.xml  |  4 +-
 theme_bookstore/views/snippets/s_title.xml    |  4 +-
 theme_buzzy/views/new_page_template.xml       |  4 +-
 theme_buzzy/views/snippets/s_key_benefits.xml |  4 ++
 theme_clean/views/new_page_template.xml       |  8 ++--
 .../views/snippets/s_numbers_showcase.xml     |  4 +-
 .../views/snippets/s_pricelist_boxed.xml      |  4 +-
 .../views/snippets/s_three_columns.xml        |  4 +-
 theme_cobalt/views/customizations.xml         | 16 ++++----
 theme_cobalt/views/new_page_template.xml      |  8 ++--
 theme_enark/views/snippets/s_freegrid.xml     |  4 +-
 theme_graphene/views/customizations.xml       |  4 +-
 .../views/snippets/s_accordion_image.xml      |  4 +-
 theme_kiddo/views/new_page_template.xml       | 16 ++++----
 .../views/snippets/s_company_team_shapes.xml  |  4 +-
 .../views/snippets/s_three_columns.xml        |  4 +-
 theme_monglia/views/customizations.xml        |  7 ++--
 theme_notes/views/new_page_template.xml       | 12 +++---
 theme_notes/views/snippets/s_company_team.xml |  4 +-
 .../views/snippets/s_product_catalog.xml      |  4 +-
 .../views/snippets/s_big_number.xml           |  7 ++--
 .../views/snippets/s_cta_box.xml              |  4 +-
 .../views/snippets/s_pricelist_boxed.xml      |  4 +-
 .../views/snippets/s_wavy_grid.xml            |  4 +-
 theme_orchid/views/new_page_template.xml      | 16 ++++----
 theme_orchid/views/snippets/s_kickoff.xml     |  4 +-
 .../views/snippets/s_pricelist_boxed.xml      |  4 +-
 .../views/snippets/s_big_number.xml           |  7 ++--
 theme_vehicle/views/customizations.xml        |  4 +-
 theme_vehicle/views/new_page_template.xml     | 15 ++-----
 theme_yes/views/new_page_template.xml         | 40 +++++++++----------
 theme_yes/views/snippets/s_kickoff.xml        |  4 +-
 theme_yes/views/snippets/s_three_columns.xml  |  5 ++-
 theme_zap/views/new_page_template.xml         | 12 +++---
 60 files changed, 233 insertions(+), 231 deletions(-)

diff --git a/theme_artists/views/new_page_template.xml b/theme_artists/views/new_page_template.xml
index fffa15144..0f2910e9d 100644
--- a/theme_artists/views/new_page_template.xml
+++ b/theme_artists/views/new_page_template.xml
@@ -93,11 +93,11 @@
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/02_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-1"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_02_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/02_001.svg?c3=o-color-5&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -165,7 +165,7 @@
 
 <template id="new_page_template_landing_0_s_cover" inherit_id="website.new_page_template_landing_0_s_cover">
     <xpath expr="//section" position="attributes">
-        <attribute name="class" remove="pt200 pb200" separator=" "/>
+        <attribute name="class" remove="pt224 pb200" separator=" "/>
     </xpath>
 </template>
 
@@ -184,11 +184,11 @@
 <template id="new_page_template_landing_5_s_banner" inherit_id="website.new_page_template_landing_5_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/02_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-1"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_02_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/02_001.svg?c3=o-color-5&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -197,11 +197,11 @@
 <template id="new_page_template_gallery_s_banner" inherit_id="website.new_page_template_gallery_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/02_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-1"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_02_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/02_001.svg?c3=o-color-5&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -222,11 +222,11 @@
 <template id="new_page_template_services_s_image_text_2nd" inherit_id="website.new_page_template_services_s_image_text_2nd">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/05","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/04","flip":["y","x"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_05"/>
+        <div class="o_we_shape o_web_editor_Wavy_04" style="background-image: url('/web_editor/shape/web_editor/Wavy/04.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=xy'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -280,11 +280,11 @@
 <template id="new_page_template_team_s_image_text_2nd" inherit_id="website.new_page_template_team_s_image_text_2nd">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/05","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/04","flip":["y","x"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_05"/>
+        <div class="o_we_shape o_web_editor_Wavy_04" style="background-image: url('/web_editor/shape/web_editor/Wavy/04.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=xy'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_artists/views/snippets/s_cover.xml b/theme_artists/views/snippets/s_cover.xml
index 0b0b3efe6..923e147a7 100644
--- a/theme_artists/views/snippets/s_cover.xml
+++ b/theme_artists/views/snippets/s_cover.xml
@@ -4,12 +4,12 @@
 <template id="s_cover" inherit_id="website.s_cover">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="class" add="pt200 pb200" remove="pt232 pb232 s_parallax_bg parallax s_parallax_is_fixed bg-black-50" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3': 'o-color-1'},'flip':[], 'showOnMobile':true}</attribute>
+        <attribute name="class" add="pt224 pb200" remove="pt232 pb232 s_parallax_bg parallax s_parallax_is_fixed bg-black-50" separator=" "/>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-1'},'flip':['y'], 'showOnMobile':true}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001 o_we_animated" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_20 o_we_animated" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
     <!-- Remove filter & parallax -->
     <xpath expr="//div[hasclass('o_we_bg_filter')]" position="replace"/>
diff --git a/theme_artists/views/snippets/s_image_text_box.xml b/theme_artists/views/snippets/s_image_text_box.xml
index 2c5ce0e8f..58cc68f17 100644
--- a/theme_artists/views/snippets/s_image_text_box.xml
+++ b/theme_artists/views/snippets/s_image_text_box.xml
@@ -5,6 +5,10 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc5" separator=" "/>
+        <attribute name="data-oe-shape-data">{'shape': 'web_editor/Connections/08','colors':{'c5':'o-color-1'}}</attribute>
+    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/08.svg?c5=o-color-1');</attribute>
     </xpath>
     <!-- Text box -->
     <xpath expr="//div[hasclass('o_grid_item')][2]" position="attributes">
diff --git a/theme_artists/views/snippets/s_key_benefits.xml b/theme_artists/views/snippets/s_key_benefits.xml
index 800b331fd..4bcb58585 100644
--- a/theme_artists/views/snippets/s_key_benefits.xml
+++ b/theme_artists/views/snippets/s_key_benefits.xml
@@ -5,6 +5,10 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc5 pt56 pb56" remove="pt48 pb48" separator=" "/>
+        <attribute name="data-oe-shape-data">{'shape': 'web_editor/Connections/14','colors':{'c5':'o-color-1'}}</attribute>
+    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/14.svg?c5=o-color-1');</attribute>
     </xpath>
     <!-- Titles -->
     <xpath expr="(//h3)[1]" position="replace" mode="inner">
diff --git a/theme_artists/views/snippets/s_kickoff.xml b/theme_artists/views/snippets/s_kickoff.xml
index f9d4b3f65..1ed71ef02 100644
--- a/theme_artists/views/snippets/s_kickoff.xml
+++ b/theme_artists/views/snippets/s_kickoff.xml
@@ -4,11 +4,11 @@
 <template id="s_kickoff" inherit_id="website.s_kickoff">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape': 'web_editor/Origins/14_001', 'colors': {'c3': 'o-color-5', 'c4': 'rgba(255, 0, 0, 0)'}, 'flip': [], 'showOnMobile': false}</attribute>
+        <attribute name="data-oe-shape-data">{'shape': 'web_editor/Connections/06', 'flip': [], 'showOnMobile': false}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
-        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-5&amp;c4=rgba(255, 0, 0, 0.04)');</attribute>
+        <attribute name="style"/>
     </xpath>
 </template>
 
diff --git a/theme_artists/views/snippets/s_striped.xml b/theme_artists/views/snippets/s_striped.xml
index 43c3e156a..0bf1d23ca 100644
--- a/theme_artists/views/snippets/s_striped.xml
+++ b/theme_artists/views/snippets/s_striped.xml
@@ -4,11 +4,11 @@
 <template id="s_striped" inherit_id="website.s_striped">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3': 'o-color-1'},'flip':['y'], 'showOnMobile':true}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-1'},'flip':[], 'showOnMobile':true}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
-        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;</attribute>
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1');</attribute>
     </xpath>
 </template>
 
diff --git a/theme_artists/views/snippets/s_striped_center_top.xml b/theme_artists/views/snippets/s_striped_center_top.xml
index 6b9ad1ebd..caa067105 100644
--- a/theme_artists/views/snippets/s_striped_center_top.xml
+++ b/theme_artists/views/snippets/s_striped_center_top.xml
@@ -4,11 +4,11 @@
 <template id="s_striped_center_top" inherit_id="website.s_striped_center_top">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3': 'o-color-1'},'flip':['y'], 'showOnMobile':true}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-1'},'flip':[], 'showOnMobile':true}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
-        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;</attribute>
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1');</attribute>
     </xpath>
     <!-- Title -->
     <xpath expr="//h1" position="replace" mode="inner">
diff --git a/theme_artists/views/snippets/s_striped_top.xml b/theme_artists/views/snippets/s_striped_top.xml
index 72d59c83b..07bade626 100644
--- a/theme_artists/views/snippets/s_striped_top.xml
+++ b/theme_artists/views/snippets/s_striped_top.xml
@@ -4,11 +4,11 @@
 <template id="s_striped_top" inherit_id="website.s_striped_top">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3': 'o-color-1'},'flip':['y'], 'showOnMobile':true}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-1'},'flip':[], 'showOnMobile':true}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
-        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;</attribute>
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1');</attribute>
     </xpath>
     <!-- Title -->
     <xpath expr="//h1" position="attributes">
diff --git a/theme_avantgarde/views/customizations.xml b/theme_avantgarde/views/customizations.xml
index 1ffe1dfb8..50d846b1e 100644
--- a/theme_avantgarde/views/customizations.xml
+++ b/theme_avantgarde/views/customizations.xml
@@ -13,13 +13,12 @@
 <template id="s_cover" inherit_id="website.s_cover" name="Avantgarde s_cover">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="s_parallax_no_overflow_hidden o_full_screen_height" remove="s_parallax_is_fixed s_parallax" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
     </xpath>
     <xpath expr="//span[hasclass('s_parallax_bg')]" position="attributes">
         <attribute name="style" remove="background-position: 50% 75%;" add="background-position: 50% 80%;" separator=";"/>
     </xpath>
-    <xpath expr="//div[hasclass('s_allow_columns')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-2&amp;flip=x'); background-position: 50% 50%;"/>
+    <xpath expr="//div[hasclass('o_we_bg_filter')]" position="attributes">
+        <attribute name="class" remove="bg-black-50" add="bg-black-75" separator=" "/>
     </xpath>
     <xpath expr="//h1" position="replace" mode="inner">
         We are Avantgarde.
@@ -176,10 +175,10 @@
 
 <template id="configurator_s_three_columns" inherit_id="website.configurator_s_three_columns" name="Avantgarde s_three_columns">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/20"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/02","colors":{"c5":"o-color-1"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_20"/>
+        <div class="o_we_shape o_web_editor_Connections_02" style="background-image: url('/web_editor/shape/web_editor/Connections/02.svg?c5=o-color-1');"/>
     </xpath>
 </template>
 
@@ -594,13 +593,13 @@
 <template id="s_big_number" inherit_id="website.s_big_number">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/03"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/04"}</attribute>
         <attribute name="class" add="o_cc1" remove="o_cc5" separator=" "/>
     </xpath>
 
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Blocks_03"/>
+        <div class="o_we_shape o_web_editor_Blocks_04"/>
     </xpath>
 
     <!-- Text -->
diff --git a/theme_avantgarde/views/new_page_template.xml b/theme_avantgarde/views/new_page_template.xml
index 740e30a50..b0889d6e9 100644
--- a/theme_avantgarde/views/new_page_template.xml
+++ b/theme_avantgarde/views/new_page_template.xml
@@ -5,28 +5,28 @@
 
 <template id="new_page_template_s_call_to_action" inherit_id="website.new_page_template_s_call_to_action">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors": {"c5": "o-color-1"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-1')"/>
     </xpath>
 </template>
 
 <template id="new_page_template_s_call_to_action_about" inherit_id="website.new_page_template_s_call_to_action_about">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors": {"c5": "o-color-1"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-1')"/>
     </xpath>
 </template>
 
 <template id="new_page_template_s_call_to_action_menu" inherit_id="website.new_page_template_s_call_to_action_menu">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06",""colors": {"c5": "o-color-1"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-1')"/>
     </xpath>
 </template>
 
diff --git a/theme_aviato/views/new_page_template.xml b/theme_aviato/views/new_page_template.xml
index 91448cbd2..096310e79 100644
--- a/theme_aviato/views/new_page_template.xml
+++ b/theme_aviato/views/new_page_template.xml
@@ -15,10 +15,10 @@
 
 <template id="new_page_template_about_s_cover" inherit_id="website.new_page_template_about_s_cover">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -63,10 +63,10 @@
 <template id="new_page_template_landing_2_s_cover" inherit_id="website.new_page_template_landing_2_s_cover">
     <xpath expr="//section" position="attributes">  
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -84,10 +84,10 @@
 
 <template id="new_page_template_landing_4_s_cover" inherit_id="website.new_page_template_landing_4_s_cover">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -95,10 +95,10 @@
 
 <template id="new_page_template_gallery_s_cover" inherit_id="website.new_page_template_gallery_s_cover">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -120,10 +120,10 @@
 
 <template id="new_page_template_pricing_s_cover" inherit_id="website.new_page_template_pricing_s_cover">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_aviato/views/snippets/s_banner.xml b/theme_aviato/views/snippets/s_banner.xml
index f993d51b3..ff63b3121 100644
--- a/theme_aviato/views/snippets/s_banner.xml
+++ b/theme_aviato/views/snippets/s_banner.xml
@@ -5,10 +5,10 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc2 pt80 pb144" remove="pt96 pb96" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape": "web_editor/Origins/14_001", "colors": {"c3": "o-color-4", "c4": "o-color-3"}, "flip": [], "showOnMobile": false, "shapeAnimationSpeed": "0"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape": "web_editor/Connections/06", "colors": {"c5": "o-color-4"}, "flip": [], "showOnMobile": false, "shapeAnimationSpeed": "0"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-4&amp;c4=o-color-3'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
     <!-- Title -->
     <xpath expr="//h1" position="replace">
diff --git a/theme_aviato/views/snippets/s_big_number.xml b/theme_aviato/views/snippets/s_big_number.xml
index ece149969..b01ba540a 100644
--- a/theme_aviato/views/snippets/s_big_number.xml
+++ b/theme_aviato/views/snippets/s_big_number.xml
@@ -4,13 +4,13 @@
 <template id="s_big_number" inherit_id="website.s_big_number">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06", "colors": {"c5": "o-color-3"}}</attribute>
         <attribute name="class" add="o_cc4" remove="o_cc5" separator=" "/>
     </xpath>
 
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14.svg?c3=o-color-4&amp;c4=o-color-4&amp;');"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 
     <!-- Text -->
diff --git a/theme_aviato/views/snippets/s_cover.xml b/theme_aviato/views/snippets/s_cover.xml
index 1f543f4c1..594200f74 100644
--- a/theme_aviato/views/snippets/s_cover.xml
+++ b/theme_aviato/views/snippets/s_cover.xml
@@ -27,11 +27,11 @@
 <template id="configurator_s_cover" inherit_id="website.configurator_s_cover">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/21","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/09","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_21" style="background-image: url('/web_editor/shape/web_editor/Wavy/21.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_09" style="background-image: url('/web_editor/shape/web_editor/Connections/09.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_aviato/views/snippets/s_key_images.xml b/theme_aviato/views/snippets/s_key_images.xml
index 4a366d3b0..8491da062 100644
--- a/theme_aviato/views/snippets/s_key_images.xml
+++ b/theme_aviato/views/snippets/s_key_images.xml
@@ -4,10 +4,10 @@
 <template id="s_key_images" inherit_id="website.s_key_images">
     <!-- Layout -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001",'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5": "o-color-3"},"flip":[],"showOnMobile":false,"shapeAnimationSpeed":"0"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 
     <!-- Texts -->
diff --git a/theme_aviato/views/snippets/s_masonry_block.xml b/theme_aviato/views/snippets/s_masonry_block.xml
index ebc452ffe..ad92707c7 100644
--- a/theme_aviato/views/snippets/s_masonry_block.xml
+++ b/theme_aviato/views/snippets/s_masonry_block.xml
@@ -3,8 +3,8 @@
 
 <template id="s_masonry_block" inherit_id="website.s_masonry_block" name="Masonry">
     <xpath expr="//section" position="replace">
-        <section class="s_masonry_block o_cc1 pt24 pb104" data-vcss="001" data-vxml="001" data-oe-shape-data="{'shape':'web_editor/Origins/04_001','flip':[],'showOnMobile':true}">
-            <div class="o_we_shape o_web_editor_Origins_04_001 o_shape_show_mobile"/>
+        <section class="s_masonry_block o_cc1 pt24 pb104" data-vcss="001" data-vxml="001" data-oe-shape-data="{'shape':'web_editor/Connections/20','colors':{'c5':'o-color-3'},'flip':['y'],'showOnMobile':true}">
+            <div class="o_we_shape o_web_editor_Connections_20 o_shape_show_mobile" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
             <div class="container">
                 <t t-call="website.s_masonry_block_default_template"/>
             </div>
diff --git a/theme_beauty/views/new_page_template.xml b/theme_beauty/views/new_page_template.xml
index 00b27fa06..0697dc019 100644
--- a/theme_beauty/views/new_page_template.xml
+++ b/theme_beauty/views/new_page_template.xml
@@ -5,37 +5,37 @@
 
 <template id="new_page_template_s_call_to_action" inherit_id="website.new_page_template_s_call_to_action">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
 <template id="new_page_template_s_call_to_action_about" inherit_id="website.new_page_template_s_call_to_action_about">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
 <template id="new_page_template_s_call_to_action_digital" inherit_id="website.new_page_template_s_call_to_action_digital">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
 <template id="new_page_template_s_call_to_action_menu" inherit_id="website.new_page_template_s_call_to_action_menu">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
@@ -92,19 +92,19 @@
 
 <template id="new_page_template_landing_2_s_call_to_action" inherit_id="website.new_page_template_landing_2_s_call_to_action">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
 <template id="new_page_template_landing_3_s_call_to_action" inherit_id="website.new_page_template_landing_3_s_call_to_action">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Rainy/05_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Airy/02"}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Rainy_05_001"/>
+        <div class="o_we_shape o_web_editor_Airy_02"/>
     </xpath>
 </template>
 
diff --git a/theme_beauty/views/snippets/s_company_team.xml b/theme_beauty/views/snippets/s_company_team.xml
index 6b9ca5c0b..707300572 100644
--- a/theme_beauty/views/snippets/s_company_team.xml
+++ b/theme_beauty/views/snippets/s_company_team.xml
@@ -37,11 +37,11 @@
 <template id="configurator_s_company_team" inherit_id="website.configurator_s_company_team">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/20","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/02","colors":{"c5":"o-color-4"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_20" style="background-image: url('/web_editor/shape/web_editor/Wavy/20.svg?c2=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_02" style="background-image: url('/web_editor/shape/web_editor/Connections/02.svg?c5=o-color-4&amp;flip=y');"/>
     </xpath>
 </template>
 
diff --git a/theme_beauty/views/snippets/s_title.xml b/theme_beauty/views/snippets/s_title.xml
index 5e26bc0e1..3fae3ba55 100644
--- a/theme_beauty/views/snippets/s_title.xml
+++ b/theme_beauty/views/snippets/s_title.xml
@@ -15,11 +15,11 @@
 <template id="configurator_s_title" inherit_id="website.configurator_s_title">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/13_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/10","colors":{"c5":"o-color-2"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_13_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/13_001.svg?c1=o-color-2&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_10" style="background-image: url('/web_editor/shape/web_editor/Connections/10.svg?c5=o-color-2&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_bewise/views/customizations.xml b/theme_bewise/views/customizations.xml
index a35689cbd..8abad1d17 100644
--- a/theme_bewise/views/customizations.xml
+++ b/theme_bewise/views/customizations.xml
@@ -215,11 +215,11 @@
 <template id="configurator_s_quotes_carousel" inherit_id="website.configurator_s_quotes_carousel" name="Be Wise s_quotes_carousel">
     <!-- Shape option -->
     <xpath expr="//div[hasclass('s_quotes_carousel')]" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5": "o-color-3"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('carousel-indicators')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-4&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_bewise/views/new_page_template.xml b/theme_bewise/views/new_page_template.xml
index 23db9be89..1e8058710 100644
--- a/theme_bewise/views/new_page_template.xml
+++ b/theme_bewise/views/new_page_template.xml
@@ -37,11 +37,12 @@
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/08","colors":{"c5":"o-color-4"}}</attribute>
+        <attribute name="class" add="o_cc o_cc4" separator=" "/>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-1&amp;flip=x'); background-position: 50% 50%;"/>
+        <div class="o_we_shape o_web_editor_Connections_08" style="background-image: url('/web_editor/shape/web_editor/Connections/08.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -86,11 +87,12 @@
 <template id="new_page_template_landing_1_s_banner" inherit_id="website.new_page_template_landing_1_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/08","colors":{"c5":"o-color-4"}}</attribute>
+        <attribute name="class" add="o_cc o_cc4" separator=" "/>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-1&amp;flip=x'); background-position: 50% 50%;"/>
+        <div class="o_we_shape o_web_editor_Connections_08" style="background-image: url('/web_editor/shape/web_editor/Connections/08.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_bistro/views/new_page_template.xml b/theme_bistro/views/new_page_template.xml
index 92e05b468..515b25a92 100644
--- a/theme_bistro/views/new_page_template.xml
+++ b/theme_bistro/views/new_page_template.xml
@@ -16,11 +16,11 @@
 <template id="new_page_template_s_picture_only" inherit_id="website.new_page_template_s_picture_only">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-5"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_container_small')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-5&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -62,22 +62,22 @@
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
 <template id="new_page_template_about_s_picture" inherit_id="website.new_page_template_about_s_picture">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('o_container_small')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-5&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -185,11 +185,11 @@
 <template id="new_page_template_landing_0_s_cover" inherit_id="website.new_page_template_landing_0_s_cover">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -197,11 +197,11 @@
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -232,11 +232,11 @@
 <template id="new_page_template_landing_4_s_cover" inherit_id="website.new_page_template_landing_4_s_cover">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -252,11 +252,11 @@
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18"}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18"/>
     </xpath>
 </template>
 
@@ -304,11 +304,11 @@
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_bistro/views/snippets/s_cover.xml b/theme_bistro/views/snippets/s_cover.xml
index b5f875ee3..4b583e330 100644
--- a/theme_bistro/views/snippets/s_cover.xml
+++ b/theme_bistro/views/snippets/s_cover.xml
@@ -29,11 +29,11 @@
 <template id="configurator_s_cover" inherit_id="website.configurator_s_cover">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_bistro/views/snippets/s_product_catalog.xml b/theme_bistro/views/snippets/s_product_catalog.xml
index 6a2925a0b..ac59f4657 100644
--- a/theme_bistro/views/snippets/s_product_catalog.xml
+++ b/theme_bistro/views/snippets/s_product_catalog.xml
@@ -19,11 +19,11 @@
 <template id="configurator_s_product_catalog" inherit_id="website.configurator_s_product_catalog">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Zigs/06"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/18","colors":{"c5": "o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Zigs_06"/>
+        <div class="o_we_shape o_web_editor_Connections_18" style="background-image: url('/web_editor/shape/web_editor/Connections/18.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_bistro/views/snippets/s_quotes_carousel_minimal.xml b/theme_bistro/views/snippets/s_quotes_carousel_minimal.xml
index 197b5c516..ad273be0b 100644
--- a/theme_bistro/views/snippets/s_quotes_carousel_minimal.xml
+++ b/theme_bistro/views/snippets/s_quotes_carousel_minimal.xml
@@ -4,10 +4,10 @@
 <template id="s_quotes_carousel_minimal" inherit_id="website.s_quotes_carousel_minimal">
     <!-- Layout -->
     <xpath expr="//div[hasclass('carousel')]" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06','colors':{'c5':'o-color-3'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('carousel-inner')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 
     <!-- Texts -->
diff --git a/theme_bookstore/views/snippets/s_banner.xml b/theme_bookstore/views/snippets/s_banner.xml
index b9ad2cce7..28b1f19ac 100644
--- a/theme_bookstore/views/snippets/s_banner.xml
+++ b/theme_bookstore/views/snippets/s_banner.xml
@@ -30,11 +30,11 @@
 <template id="configurator_s_banner" inherit_id="website.configurator_s_banner">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001', 'colors':{'c3':'o-color-3','c4':'o-color-4'}, 'flip':[]}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06', 'colors':{'c5':'o-color-3'}, 'flip':[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=o-color-4')"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3')"/>
     </xpath>
 </template>
 
diff --git a/theme_bookstore/views/snippets/s_cta_box.xml b/theme_bookstore/views/snippets/s_cta_box.xml
index 9e7e6633d..d598273a2 100644
--- a/theme_bookstore/views/snippets/s_cta_box.xml
+++ b/theme_bookstore/views/snippets/s_cta_box.xml
@@ -23,11 +23,11 @@
 <template id="configurator_s_cta_box" inherit_id="website.configurator_s_cta_box">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001', 'colors':{'c3':'o-color-4'}}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20', 'colors':{'c5':'o-color-4'},'flip':['y']}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-4');"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_bookstore/views/snippets/s_title.xml b/theme_bookstore/views/snippets/s_title.xml
index 75dd84040..d21953b4f 100644
--- a/theme_bookstore/views/snippets/s_title.xml
+++ b/theme_bookstore/views/snippets/s_title.xml
@@ -21,11 +21,11 @@
 <template id="configurator_s_title" inherit_id="website.configurator_s_title">
     <!-- Shape option -->
     <xpath expr="section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/11_001','colors':{'c3':'o-color-4','c4':'o-color-5'},'flip':['y']}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/05','colors':{'c5':'o-color-4'},'flip':[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_11_001" style="background-image: url('/web_editor/shape/web_editor/Origins/11_001.svg?c3=o-color-4&amp;c4=o-color-5&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_05" style="background-image: url('/web_editor/shape/web_editor/Connections/05.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_buzzy/views/new_page_template.xml b/theme_buzzy/views/new_page_template.xml
index ace99fdca..663ee4b4d 100644
--- a/theme_buzzy/views/new_page_template.xml
+++ b/theme_buzzy/views/new_page_template.xml
@@ -51,11 +51,11 @@
 <template id="new_page_template_s_showcase" inherit_id="website.new_page_template_s_showcase">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/03","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Blocks/04",'colors':{'c1':'o-color-1','c2':'o-color-2','c3':'rgba(0,0,0,0)','c5':'o-color-5'},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Blocks_03"/>
+        <div class="o_we_shape o_web_editor_Blocks_04" style="background-image: url('/web_editor/shape/web_editor/Blocks/04.svg?c1=o-color-1&amp;c2=o-color-2&amp;c3=rgba(0,0,0,0)&amp;c5=o-color-5');"/>
     </xpath>
 </template>
 
diff --git a/theme_buzzy/views/snippets/s_key_benefits.xml b/theme_buzzy/views/snippets/s_key_benefits.xml
index 540648367..ed04b1217 100644
--- a/theme_buzzy/views/snippets/s_key_benefits.xml
+++ b/theme_buzzy/views/snippets/s_key_benefits.xml
@@ -3,6 +3,10 @@
 
 <template id="s_key_benefits" inherit_id="website.s_key_benefits">
     <!-- Layout -->
+    <xpath expr="//section" position="attributes">
+        <attribute name="data-oe-shape-data"/>
+    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="replace"/>
     <xpath expr="//p[hasclass('lead')]" position="attributes">
         <attribute name="style">text-align: center;"</attribute>
     </xpath>
diff --git a/theme_clean/views/new_page_template.xml b/theme_clean/views/new_page_template.xml
index 569a43ce2..455bbb5a5 100644
--- a/theme_clean/views/new_page_template.xml
+++ b/theme_clean/views/new_page_template.xml
@@ -6,11 +6,11 @@
 <template id="new_page_template_s_call_to_action" inherit_id="website.new_page_template_s_call_to_action">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001", "flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-4&amp;c4=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -23,11 +23,11 @@
 <template id="new_page_template_s_three_columns" inherit_id="website.new_page_template_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5":"o-color-1"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%"/>
     </xpath>
 </template>
 
diff --git a/theme_clean/views/snippets/s_numbers_showcase.xml b/theme_clean/views/snippets/s_numbers_showcase.xml
index 28fbfa55d..fb54ccfcf 100644
--- a/theme_clean/views/snippets/s_numbers_showcase.xml
+++ b/theme_clean/views/snippets/s_numbers_showcase.xml
@@ -5,10 +5,10 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc4 pt88" remove="pt80" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","colors":{"c3": "#FFFFFF"},"flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-4&amp;flip=y');"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4');"/>
     </xpath>
     <!-- Grid items -->
     <xpath expr="(//div[hasclass('o_grid_item')])[2]" position="attributes">
diff --git a/theme_clean/views/snippets/s_pricelist_boxed.xml b/theme_clean/views/snippets/s_pricelist_boxed.xml
index d2fa7b81f..f3caefa87 100644
--- a/theme_clean/views/snippets/s_pricelist_boxed.xml
+++ b/theme_clean/views/snippets/s_pricelist_boxed.xml
@@ -6,10 +6,10 @@
     <xpath expr="//section" position="attributes">
         <attribute name="data-scroll-background-ratio"/>
         <attribute name="class" add="o_cc o_cc2" remove="parallax s_parallax_is_fixed s_parallax_no_overflow_hidden" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-1'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1&amp;flip=y');  background-position: 50% 0%"/>
     </xpath>
     <xpath expr="//span[hasclass('s_parallax_bg')]" position="replace"/>
 
diff --git a/theme_clean/views/snippets/s_three_columns.xml b/theme_clean/views/snippets/s_three_columns.xml
index 03138276f..adb207fb7 100644
--- a/theme_clean/views/snippets/s_three_columns.xml
+++ b/theme_clean/views/snippets/s_three_columns.xml
@@ -41,11 +41,11 @@
 <template id="configurator_s_three_columns" inherit_id="website.configurator_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-1"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%"/>
     </xpath>
 </template>
 
diff --git a/theme_cobalt/views/customizations.xml b/theme_cobalt/views/customizations.xml
index 129525b3d..130aec0b7 100644
--- a/theme_cobalt/views/customizations.xml
+++ b/theme_cobalt/views/customizations.xml
@@ -6,10 +6,10 @@
     <!-- Content -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="pt24 pb80" remove="pt96 pb96" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-3'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-3&amp;flip=y');"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-3');"/>
     </xpath>
     <!-- Row - remove grid mode -->
     <xpath expr="//div[hasclass('row')]" position="attributes">
@@ -468,10 +468,10 @@
     <!-- Layout -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="pt112" remove="pt72" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001','colors':{'c3':'o-color-3','c4':'o-color-4'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06','colors':{'c5':'o-color-3'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 
     <!-- Numbers -->
@@ -674,10 +674,10 @@
 <template id="s_company_team_detail" inherit_id="website.s_company_team_detail">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc5 pt96" remove="o_cc1 pt64" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/11_001','colors':{'c3':'o-color-4','c4':'o-color-5'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/05','colors':{'c5':'o-color-4'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_11_001" style="background-image: url('/web_editor/shape/web_editor/Origins/11_001.svg?c3=o-color-4&amp;c4=o-color-5');"/>
+        <div class="o_we_shape o_web_editor_Connections_05" style="background-image: url('/web_editor/shape/web_editor/Connections/05.svg?c5=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
     <xpath expr="//div[hasclass('col-lg-4')]" position="attributes">
         <attribute name="class" add="col-lg-3" remove="col-lg-4" separator=" "/>
@@ -699,10 +699,10 @@
 <template id="s_references_grid" inherit_id="website.s_references_grid">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="pt112" remove="pt64" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001','colors':{'c3':'o-color-5','c4':'o-color-4'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06','flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-5&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-5&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_cobalt/views/new_page_template.xml b/theme_cobalt/views/new_page_template.xml
index 8bbc10138..138752b5d 100644
--- a/theme_cobalt/views/new_page_template.xml
+++ b/theme_cobalt/views/new_page_template.xml
@@ -47,10 +47,10 @@
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc2" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/11_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/05","colors":{"c5":"o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_11_001" style="background-image: url('/web_editor/shape/web_editor/Origins/11_001.svg?c3=o-color-4&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_05" style="background-image: url('/web_editor/shape/web_editor/Connections/05.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -98,10 +98,10 @@
 <template id="new_page_template_landing_1_s_banner" inherit_id="website.new_page_template_landing_1_s_banner">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc2" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/11_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/05","colors":{"c5":"o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_11_001" style="background-image: url('/web_editor/shape/web_editor/Origins/11_001.svg?c3=o-color-4&amp;c4=o-color-4&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_05" style="background-image: url('/web_editor/shape/web_editor/Connections/05.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_enark/views/snippets/s_freegrid.xml b/theme_enark/views/snippets/s_freegrid.xml
index ecc436e32..d0ac9a0ca 100644
--- a/theme_enark/views/snippets/s_freegrid.xml
+++ b/theme_enark/views/snippets/s_freegrid.xml
@@ -4,14 +4,14 @@
 <template id="s_freegrid" inherit_id="website.s_freegrid">
     <!-- Layout -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3':'o-color-5'},'flip':[],'showOnMobile':true,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','flip':['y'],'showOnMobile':true,'shapeAnimationSpeed':'0'}</attribute>
         <attribute name="class" add="pt128" remove="pt64" separator=" "/>
     </xpath>
     <xpath expr="//div[hasclass('o_grid_mode')]" position="attributes">
         <attribute name="data-row-count">17</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container-fluid')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001 o_shape_show_mobile" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-5');"/>
+        <div class="o_we_shape o_web_editor_Connections_20 o_shape_show_mobile" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-5&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
     <xpath expr="//div[hasclass('container-fluid')]" position="attributes">
         <attribute name="class" add="container" remove="container-fluid" separator=" "/>
diff --git a/theme_graphene/views/customizations.xml b/theme_graphene/views/customizations.xml
index c1025f091..b3cbb7afb 100644
--- a/theme_graphene/views/customizations.xml
+++ b/theme_graphene/views/customizations.xml
@@ -534,10 +534,10 @@
 <template id="s_key_images" inherit_id="website.s_key_images" name="Graphene s_key_images">
     <!-- Layout -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-3'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0;"/>
     </xpath>
 
     <!-- Texts -->
diff --git a/theme_kea/views/snippets/s_accordion_image.xml b/theme_kea/views/snippets/s_accordion_image.xml
index 88a09f841..aa1abb12b 100644
--- a/theme_kea/views/snippets/s_accordion_image.xml
+++ b/theme_kea/views/snippets/s_accordion_image.xml
@@ -4,10 +4,10 @@
 <template id="s_accordion_image" inherit_id="website.s_accordion_image">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="pb128" remove="pb56" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Wavy/13_001','colors':{'c1':'o-color-2'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/10','colors':{'c5':'o-color-2'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_13_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/13_001.svg?c1=o-color-2');"/>
+        <div class="o_we_shape o_web_editor_Connections_10" style="background-image: url('/web_editor/shape/web_editor/Connections/10.svg?c5=o-color-2');"/>
     </xpath>
 </template>
 
diff --git a/theme_kiddo/views/new_page_template.xml b/theme_kiddo/views/new_page_template.xml
index d5ab163aa..9a9f99abd 100644
--- a/theme_kiddo/views/new_page_template.xml
+++ b/theme_kiddo/views/new_page_template.xml
@@ -104,11 +104,11 @@
 <template id="new_page_template_about_s_three_columns" inherit_id="website.new_page_template_about_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -180,22 +180,22 @@
 <template id="new_page_template_landing_2_s_three_columns" inherit_id="website.new_page_template_landing_2_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
 <template id="new_page_template_landing_3_s_three_columns" inherit_id="website.new_page_template_landing_3_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
@@ -353,11 +353,11 @@
 <template id="new_page_template_team_0_s_three_columns" inherit_id="website.new_page_template_team_0_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_kiddo/views/snippets/s_company_team_shapes.xml b/theme_kiddo/views/snippets/s_company_team_shapes.xml
index 83c73c110..cbc0b8084 100644
--- a/theme_kiddo/views/snippets/s_company_team_shapes.xml
+++ b/theme_kiddo/views/snippets/s_company_team_shapes.xml
@@ -4,10 +4,10 @@
 <template id="s_company_team_shapes" inherit_id="website.s_company_team_shapes">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="pb104" remove="pb48" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Wavy/13_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/10','colors':{'c5':'o-color-1'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('o_container_small')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_13_001"/>
+        <div class="o_we_shape o_web_editor_Connections_10" style="background-image: url('/web_editor/shape/web_editor/Connections/10.svg?c5=o-color-1');"/>
     </xpath>
 </template>
 
diff --git a/theme_kiddo/views/snippets/s_three_columns.xml b/theme_kiddo/views/snippets/s_three_columns.xml
index dbe70ba5b..1970352c1 100644
--- a/theme_kiddo/views/snippets/s_three_columns.xml
+++ b/theme_kiddo/views/snippets/s_three_columns.xml
@@ -122,12 +122,12 @@
 <template id="configurator_s_three_columns" inherit_id="website.configurator_s_three_columns">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001','colors':{'c3':'o-color-3','c4':'rgba(0, 0, 0, 0)'},'flip':['y'],'showOnMobile':true,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06','colors':{'c5':'o-color-3'},'flip':['y'],'showOnMobile':true,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
 
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001 o_shape_show_mobile" style="background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba%280%2C%200%2C%200%2C%200%29&amp;flip=y'); background-position: 50% 0%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06 o_shape_show_mobile" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_monglia/views/customizations.xml b/theme_monglia/views/customizations.xml
index 665672ab0..8ed95e639 100644
--- a/theme_monglia/views/customizations.xml
+++ b/theme_monglia/views/customizations.xml
@@ -697,13 +697,12 @@
 <template id="s_big_number" inherit_id="website.s_big_number">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18"}</attribute>
+        <attribute name="data-oe-shape-data"/>
+        <attribute name="style">background-image: linear-gradient(60deg, var(--o-color-5) 0%, var(--o-color-1) 200%);</attribute>
     </xpath>
 
     <!-- Shape -->
-    <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_18 o_we_animated"/>
-    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="replace"/>
 
     <!-- Text -->
     <xpath expr="//h2/div" position="attributes">
diff --git a/theme_notes/views/new_page_template.xml b/theme_notes/views/new_page_template.xml
index d33774299..934ee8268 100644
--- a/theme_notes/views/new_page_template.xml
+++ b/theme_notes/views/new_page_template.xml
@@ -14,27 +14,27 @@
 <template id="new_page_template_s_carousel" inherit_id="website.new_page_template_s_carousel">
     <!-- Slide #1 - Shape option -->
     <xpath expr="//div[hasclass('carousel-item')]" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/10","colors":{"c1": "o-color-2","c2":"o-color-2"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Slide #1 - Shape -->
     <xpath expr="//div[hasclass('carousel-item')]//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_25" style="background-image: url('/web_editor/shape/web_editor/Wavy/25.svg?c1=o-color-5&amp;c2=o-color-5&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Wavy_10" style="background-image: url('/web_editor/shape/web_editor/Wavy/10.svg?c1=o-color-2&amp;c2=o-color-2&amp;flip=y'); background-position: 50% 100%;"/>
     </xpath>
     <!-- Slide #2 - Shape option -->
     <xpath expr="//div[hasclass('carousel-item')][2]" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/10","colors":{"c1": "o-color-2","c2":"o-color-2"},"flip":[]}</attribute>
     </xpath>
     <!-- Slide #2 - Shape -->
     <xpath expr="//div[hasclass('carousel-item')][2]//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_25 o_second_extra_shape_mapping"/>
+        <div class="o_we_shape o_web_editor_Wavy_10" style="background-image: url('/web_editor/shape/web_editor/Wavy/10.svg?c1=o-color-2&amp;c2=o-color-2&amp;flip=y'); background-position: 50% 100%;"/>
     </xpath>
     <!-- Slide #3 - Shape option -->
     <xpath expr="//div[hasclass('carousel-item')][3]" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/25","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/10","colors":{"c1": "o-color-2","c2":"o-color-2"},"flip":["y"]}</attribute>
     </xpath>
     <!-- Slide #3 - Shape -->
     <xpath expr="//div[hasclass('carousel-item')][3]//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_25 o_third_extra_shape_mapping" style="background-image: url('/web_editor/shape/web_editor/Wavy/25.svg?c1=o-color-2&amp;c2=o-color-2&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Wavy_10" style="background-image: url('/web_editor/shape/web_editor/Wavy/10.svg?c1=o-color-2&amp;c2=o-color-2&amp;flip=y'); background-position: 50% 100%;"/>
     </xpath>
 </template>
 
diff --git a/theme_notes/views/snippets/s_company_team.xml b/theme_notes/views/snippets/s_company_team.xml
index bafe19792..f709d7a86 100644
--- a/theme_notes/views/snippets/s_company_team.xml
+++ b/theme_notes/views/snippets/s_company_team.xml
@@ -43,11 +43,11 @@
 <template id="configurator_s_company_team" inherit_id="website.configurator_s_company_team">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/13_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/10","colors":{"c5":"o-color-1"},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_13_001"/>
+        <div class="o_we_shape o_web_editor_Connections_10" style="background-image: url('/web_editor/shape/web_editor/Connections/10.svg?c5=o-color-1');"/>
     </xpath>
 </template>
 
diff --git a/theme_notes/views/snippets/s_product_catalog.xml b/theme_notes/views/snippets/s_product_catalog.xml
index 1a4052583..2cf5b32ec 100644
--- a/theme_notes/views/snippets/s_product_catalog.xml
+++ b/theme_notes/views/snippets/s_product_catalog.xml
@@ -5,14 +5,14 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc3 pb160 pt160 parallax s_parallax_is_fixed s_parallax_no_overflow_hidden o_full_screen_height" remove="pb64 pt64" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/10","colors":{"c1":"o-color-2","c2":"o-color-2"},"flip":[]}</attribute>
         <attribute name="data-scroll-background-ratio">1</attribute>
     </xpath>
     <!-- Shape & Background image -->
     <xpath expr="//div[hasclass('o_we_bg_filter')]" position="replace">
         <span class="s_parallax_bg oe_img_bg o_bg_img_center" style="background-image: url('/web/image/website.s_product_catalog_default_image');"/>
         <div class="o_we_bg_filter bg-black-50"/>
-        <div class="o_we_shape o_web_editor_Origins_18"/>
+        <div class="o_we_shape o_web_editor_Wavy_10" style="background-image: url('/web_editor/shape/web_editor/Wavy/10.svg?c1=o-color-2&amp;c2=o-color-2');"/>
     </xpath>
     <!-- Title & subtitles -->
     <xpath expr="//h2" position="replace">
diff --git a/theme_odoo_experts/views/snippets/s_big_number.xml b/theme_odoo_experts/views/snippets/s_big_number.xml
index f328d2ea8..b91afeddf 100644
--- a/theme_odoo_experts/views/snippets/s_big_number.xml
+++ b/theme_odoo_experts/views/snippets/s_big_number.xml
@@ -4,13 +4,12 @@
 <template id="s_big_number" inherit_id="website.s_big_number">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18"}</attribute>
+        <attribute name="style">background-image: linear-gradient(60deg, var(--o-color-5) 0%, var(--o-color-1) 100%);</attribute>
+        <attribute name="data-oe-shape-data"/>
     </xpath>
 
     <!-- Shape -->
-    <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_18 o_we_animated"/>
-    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="replace"/>
 
     <!-- Text -->
     <xpath expr="//h2/div" position="attributes">
diff --git a/theme_odoo_experts/views/snippets/s_cta_box.xml b/theme_odoo_experts/views/snippets/s_cta_box.xml
index a6025df46..9d44bbcbe 100644
--- a/theme_odoo_experts/views/snippets/s_cta_box.xml
+++ b/theme_odoo_experts/views/snippets/s_cta_box.xml
@@ -4,11 +4,11 @@
 <template id="s_cta_box" inherit_id="website.s_cta_box">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc5 pt0 pb120" remove="pt80 pb80" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001', 'flip':[], 'showOnMobile':true}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-4'}, 'flip':['y'], 'showOnMobile':true}</attribute>
     </xpath>
 
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-4'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
     <!-- Card -->
     <xpath expr="//div[hasclass('card')]" position="attributes">
diff --git a/theme_odoo_experts/views/snippets/s_pricelist_boxed.xml b/theme_odoo_experts/views/snippets/s_pricelist_boxed.xml
index 0152b8899..6e346930c 100644
--- a/theme_odoo_experts/views/snippets/s_pricelist_boxed.xml
+++ b/theme_odoo_experts/views/snippets/s_pricelist_boxed.xml
@@ -6,10 +6,10 @@
     <xpath expr="//section" position="attributes">
         <attribute name="data-scroll-background-ratio"/>
         <attribute name="class" add="o_cc o_cc4" remove="parallax s_parallax_is_fixed s_parallax_no_overflow_hidden" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5': 'o-color-3'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-3&amp;flip=y'); background-position: 50% 0%"/>
     </xpath>
     <xpath expr="//span[hasclass('s_parallax_bg')]" position="replace"/>
 
diff --git a/theme_odoo_experts/views/snippets/s_wavy_grid.xml b/theme_odoo_experts/views/snippets/s_wavy_grid.xml
index 0439703bb..6b0bb14fa 100644
--- a/theme_odoo_experts/views/snippets/s_wavy_grid.xml
+++ b/theme_odoo_experts/views/snippets/s_wavy_grid.xml
@@ -4,10 +4,10 @@
 <template id="s_wavy_grid" inherit_id="website.s_wavy_grid">
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc o_cc2" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/04_001','colors':{'c3':'o-color-1'},'flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/20','colors':{'c5':'o-color-1'},'flip':['y'],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1');"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-1&amp;flip=y'); background-position: 50% 0%;"/>
     </xpath>
 </template>
 
diff --git a/theme_orchid/views/new_page_template.xml b/theme_orchid/views/new_page_template.xml
index cf7378b9f..149b29be5 100644
--- a/theme_orchid/views/new_page_template.xml
+++ b/theme_orchid/views/new_page_template.xml
@@ -68,11 +68,11 @@
 <template id="new_page_template_about_s_cover" inherit_id="website.new_page_template_about_s_cover">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/01_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-3"},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_01_001"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-3');"/>
     </xpath>
 </template>
 
@@ -181,11 +181,11 @@
 <template id="new_page_template_landing_2_s_cover" inherit_id="website.new_page_template_landing_2_s_cover">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/01_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-4"},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_01_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/01.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -235,11 +235,11 @@
 <template id="new_page_template_gallery_s_cover" inherit_id="website.new_page_template_gallery_s_cover">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/01_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-4"},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_01_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/01.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -284,11 +284,11 @@
 <template id="new_page_template_pricing_s_cover" inherit_id="website.new_page_template_pricing_s_cover">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Wavy/01_001","flip":[]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/16","colors":{"c5":"o-color-4"},"flip":[]}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Wavy_01_001" style="background-image: url('/web_editor/shape/web_editor/Wavy/01.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_16" style="background-image: url('/web_editor/shape/web_editor/Connections/16.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_orchid/views/snippets/s_kickoff.xml b/theme_orchid/views/snippets/s_kickoff.xml
index bb8994ceb..40a3221d6 100644
--- a/theme_orchid/views/snippets/s_kickoff.xml
+++ b/theme_orchid/views/snippets/s_kickoff.xml
@@ -6,12 +6,12 @@
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="oe_img_bg" remove="parallax s_parallax_is_fixed" separator=" "/>
         <attribute name="style" add="background-image: url('/web/image/website.s_kickoff_default_image'); background-position: 100% 100%;" separator=";"/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/14_001','colors':{'c3':'o-color-3','c4':'rgba(255, 0, 0, 0)'},'showOnMobile':true}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/06','colors':{'c5':'o-color-3'},'showOnMobile':true}</attribute>
     </xpath>
 
     <!-- Refine shape's colors -->
     <xpath expr="//div[hasclass('o_we_shape')]" position="attributes">
-        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Origins/14_001.svg?c3=o-color-3&amp;c4=rgba(255, 0, 0, 0)');</attribute>
+        <attribute name="style">background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');</attribute>
     </xpath>
 
     <!-- Remove the parallax effect: the background image has been already set in the main <section> tag -->
diff --git a/theme_real_estate/views/snippets/s_pricelist_boxed.xml b/theme_real_estate/views/snippets/s_pricelist_boxed.xml
index 0bde99216..95910c0df 100644
--- a/theme_real_estate/views/snippets/s_pricelist_boxed.xml
+++ b/theme_real_estate/views/snippets/s_pricelist_boxed.xml
@@ -6,10 +6,10 @@
     <xpath expr="//section" position="attributes">
         <attribute name="data-scroll-background-ratio"/>
         <attribute name="class" add="o_cc o_cc2" remove="parallax s_parallax_is_fixed s_parallax_no_overflow_hidden" separator=" "/>
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Blocks/03','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Blocks/04','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Blocks_03"/>
+        <div class="o_we_shape o_web_editor_Blocks_04"/>
     </xpath>
     <xpath expr="//div[hasclass('col-lg-8')]" position="attributes">
         <attribute name="class" remove="rounded" separator=" "/>
diff --git a/theme_treehouse/views/snippets/s_big_number.xml b/theme_treehouse/views/snippets/s_big_number.xml
index ee00a7272..cc6141807 100644
--- a/theme_treehouse/views/snippets/s_big_number.xml
+++ b/theme_treehouse/views/snippets/s_big_number.xml
@@ -4,14 +4,13 @@
 <template id="s_big_number" inherit_id="website.s_big_number">
     <!-- Section -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18"}</attribute>
+        <attribute name="style">background-image: linear-gradient(60deg, var(--o-color-2) 0%, var(--o-color-5) 100%);</attribute>
+        <attribute name="data-oe-shape-data"/>
         <attribute name="class" add="o_cc3" remove="o_cc5" separator=" "/>
     </xpath>
 
     <!-- Shape -->
-    <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_18 o_we_animated"/>
-    </xpath>
+    <xpath expr="//div[hasclass('o_we_shape')]" position="replace"/>
 
     <!-- Text -->
     <xpath expr="//h2/div" position="attributes">
diff --git a/theme_vehicle/views/customizations.xml b/theme_vehicle/views/customizations.xml
index 303986252..d8f64e624 100644
--- a/theme_vehicle/views/customizations.xml
+++ b/theme_vehicle/views/customizations.xml
@@ -866,10 +866,10 @@
 <template id="s_quotes_carousel_minimal" inherit_id="website.s_quotes_carousel_minimal" name="Vehicle s_quotes_carousel_minimal">
     <!-- Layout -->
     <xpath expr="//div[hasclass('carousel')]" position="attributes">
-        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/08','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Origins/09_001','flip':[],'showOnMobile':false,'shapeAnimationSpeed':'0'}</attribute>
     </xpath>
     <xpath expr="//div[hasclass('carousel-inner')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_08"/>
+        <div class="o_we_shape o_web_editor_Origins_09_001"/>
     </xpath>
 
     <!-- Texts -->
diff --git a/theme_vehicle/views/new_page_template.xml b/theme_vehicle/views/new_page_template.xml
index b67bcacd1..4d8a1ce55 100644
--- a/theme_vehicle/views/new_page_template.xml
+++ b/theme_vehicle/views/new_page_template.xml
@@ -38,10 +38,7 @@
 
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
-    </xpath>
-    <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-4&amp;flip=x'); background-position: 50% 50%;"/>
+        <attribute name="style">background-image: linear-gradient(180deg, var(--o-color-3) 0%, var(--o-color-4) 100%);</attribute>
     </xpath>
 </template>
 
@@ -131,10 +128,7 @@
 
 <template id="new_page_template_landing_1_s_banner" inherit_id="website.new_page_template_landing_1_s_banner">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
-    </xpath>
-    <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-4&amp;flip=x'); background-position: 50% 50%;"/>
+        <attribute name="style">background-image: linear-gradient(180deg, var(--o-color-3) 0%, var(--o-color-4) 100%);</attribute>
     </xpath>
 </template>
 
@@ -160,10 +154,7 @@
 
 <template id="new_page_template_gallery_s_banner" inherit_id="website.new_page_template_gallery_s_banner">
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18","flip":["x"]}</attribute>
-    </xpath>
-    <xpath expr="//div[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18" style="background-image: url('/web_editor/shape/web_editor/Origins/18.svg?c1=o-color-4&amp;flip=x'); background-position: 50% 50%;"/>
+        <attribute name="style">background-image: linear-gradient(180deg, var(--o-color-3) 0%, var(--o-color-4) 100%);</attribute>
     </xpath>
 </template>
 
diff --git a/theme_yes/views/new_page_template.xml b/theme_yes/views/new_page_template.xml
index 27ef1c9ad..5c243f71b 100644
--- a/theme_yes/views/new_page_template.xml
+++ b/theme_yes/views/new_page_template.xml
@@ -69,22 +69,22 @@
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
 <template id="new_page_template_about_s_company_team" inherit_id="website.new_page_template_about_s_company_team">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001 o_second_extra_shape_mapping bg-o-color-3"/>
+        <div class="o_we_shape o_web_editor_Connections_06 bg-o-color-3" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -92,11 +92,11 @@
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_full_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 </template>
 
@@ -161,11 +161,11 @@
 <template id="new_page_template_landing_1_s_banner" inherit_id="website.new_page_template_landing_1_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 </template>
 
@@ -173,11 +173,11 @@
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_half_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 </template>
 
@@ -197,11 +197,11 @@
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_half_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -210,11 +210,11 @@
 <template id="new_page_template_gallery_s_banner" inherit_id="website.new_page_template_gallery_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-3"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-3');"/>
     </xpath>
 </template>
 
@@ -222,11 +222,11 @@
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_half_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -244,11 +244,11 @@
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_half_screen_height" remove="o_half_screen_height" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001" style="background-image: url('/web_editor/shape/web_editor/Origins/14.svg?c1=o-color-1&amp;c5=o-color-1&amp;flip=x'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_06" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -263,11 +263,11 @@
 <template id="new_page_template_team_s_company_team" inherit_id="website.new_page_template_team_s_company_team">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/14_001"}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/06","colors":{"c5":"o-color-4"}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_14_001 o_second_extra_shape_mapping bg-o-color-3"/>
+        <div class="o_we_shape o_web_editor_Connections_06 bg-o-color-3" style="background-image: url('/web_editor/shape/web_editor/Connections/06.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
diff --git a/theme_yes/views/snippets/s_kickoff.xml b/theme_yes/views/snippets/s_kickoff.xml
index 6f4798c16..13a686bcd 100644
--- a/theme_yes/views/snippets/s_kickoff.xml
+++ b/theme_yes/views/snippets/s_kickoff.xml
@@ -5,14 +5,14 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="data-scroll-background-ratio"/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/11_001",'colors':{'c3':'o-color-3', 'c4':'rgba(0, 0, 0, 0.5)'},"flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/05",'colors':{'c5':'o-color-3'},"flip":[]}</attribute>
         <attribute name="style" add="background-image:url(/web/image/website.s_kickoff_default_image)" separator=";"/>
         <attribute name="class" add="pt0 pb0 oe_img_bg o_bg_img_center o_full_screen_height" remove="s_parallax s_parallax_is_fixed pt232 pb88" separator=" "/>
     </xpath>
         <!-- Remove Parallax + shape -->
     <xpath expr="//span[hasclass('s_parallax_bg')]" position="replace"/>
     <xpath expr="//div[hasclass('o_we_shape')]" position="replace">
-        <div class="o_we_shape o_web_editor_Origins_11_001" style="background-image: url('/web_editor/shape/web_editor/Origins/11_001.svg?c3=o-color-3&amp;c4=rgba(0, 0, 0, 0.5)&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_05" style="background-image: url('/web_editor/shape/web_editor/Connections/05.svg?c5=o-color-3');"/>
     </xpath>
     <xpath expr="//div[hasclass('o_we_bg_filter')]" position="attributes">
         <attribute name="class" add="bg-black-25" remove="bg-black-50" separator=" "/>
diff --git a/theme_yes/views/snippets/s_three_columns.xml b/theme_yes/views/snippets/s_three_columns.xml
index f271129ea..7e16e3e35 100644
--- a/theme_yes/views/snippets/s_three_columns.xml
+++ b/theme_yes/views/snippets/s_three_columns.xml
@@ -5,11 +5,12 @@
     <!-- Section -->
     <xpath expr="//section" position="attributes">
         <attribute name="class" add="o_cc5" remove="o_cc2" separator=" "/>
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/18"}</attribute>
+        <attribute name="style">background-image: linear-gradient(60deg, var(--o-color-5) 0%, var(--o-color-1) 100%);</attribute>
+        <attribute name="data-oe-shape-data">{'shape':'web_editor/Connections/12','colors':{'c5':'o-color-4'}}</attribute>
     </xpath>
     <!-- Shape -->
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_18"/>
+        <div class="o_we_shape o_web_editor_Connections_12" style="background-image: url('/web_editor/shape/web_editor/Connections/12.svg?c5=o-color-4');"/>
     </xpath>
     <!-- Column 1 -->
     <xpath expr="//*[hasclass('card-title')]" position="replace" mode="inner">
diff --git a/theme_zap/views/new_page_template.xml b/theme_zap/views/new_page_template.xml
index f47752282..893490575 100644
--- a/theme_zap/views/new_page_template.xml
+++ b/theme_zap/views/new_page_template.xml
@@ -18,10 +18,10 @@
 <template id="new_page_template_about_s_banner" inherit_id="website.new_page_template_about_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -74,10 +74,10 @@
 <template id="new_page_template_landing_1_s_banner" inherit_id="website.new_page_template_landing_1_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4');"/>
     </xpath>
 </template>
 
@@ -92,10 +92,10 @@
 <template id="new_page_template_gallery_s_banner" inherit_id="website.new_page_template_gallery_s_banner">
     <!-- Shape option -->
     <xpath expr="//section" position="attributes">
-        <attribute name="data-oe-shape-data">{"shape":"web_editor/Origins/04_001","flip":["y"]}</attribute>
+        <attribute name="data-oe-shape-data">{"shape":"web_editor/Connections/20","colors":{"c5": "o-color-4"},"flip":[]}</attribute>
     </xpath>
     <xpath expr="//*[hasclass('container')]" position="before">
-        <div class="o_we_shape o_web_editor_Origins_04_001" style="background-image: url('/web_editor/shape/web_editor/Origins/04_001.svg?c3=o-color-1&amp;flip=y'); background-position: 50% 100%;"/>
+        <div class="o_we_shape o_web_editor_Connections_20" style="background-image: url('/web_editor/shape/web_editor/Connections/20.svg?c5=o-color-4');"/>
     </xpath>
 </template>