diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
index 96a1b297c4d..92d1b71bfe0 100644
--- a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
+++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
@@ -24,6 +24,7 @@ export class LinkTools extends Link {
         onPreApplyLink: { type: Function, optional: true },
         onPostApplyLink: { type: Function, optional: true },
         onDestroy: { type: Function, optional: true },
+        getColorpickerTemplate: { type: Function, optional: true },
     };
     static defaultProps = {
         ...Link.defaultProps,
diff --git a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
index 2ece37ca753..549b7cc958b 100644
--- a/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
+++ b/addons/web_editor/static/src/js/wysiwyg/wysiwyg.js
@@ -1375,7 +1375,8 @@ export class Wysiwyg extends Component {
                         onDestroy: () => {
                             removeHintClasses();
                             this.linkToolsInfos.onDestroy();
-                        }
+                        },
+                        getColorpickerTemplate: this.getColorpickerTemplate.bind(this),
                     };
                 }
                 // update the shouldFocusUrl prop to focus on url when double click and click edit link
diff --git a/addons/web_editor/static/src/xml/wysiwyg.xml b/addons/web_editor/static/src/xml/wysiwyg.xml
index c8d045087c6..7499e0b305b 100644
--- a/addons/web_editor/static/src/xml/wysiwyg.xml
+++ b/addons/web_editor/static/src/xml/wysiwyg.xml
@@ -167,6 +167,7 @@
                                 onColorLeave="(params) => this._colorpaletteApply('color', params)"
                                 onColorPicked="(params) => this._onColorpaletteColorPicked('color', params)"
                                 onCustomColorPicked="(params) => this._onColorpaletteColorPicked('color', params)"
+                                getTemplate="this.props.getColorpickerTemplate"
                                 />
                         </we-selection-items>
                     </div>
@@ -188,6 +189,7 @@
                                 onColorLeave="(params) => this._colorpaletteApply('background-color', params)"
                                 onColorPicked="(params) => this._onColorpaletteColorPicked('background-color', params)"
                                 onCustomColorPicked="(params) => this._onColorpaletteColorPicked('background-color', params)"
+                                getTemplate="this.props.getColorpickerTemplate"
                                 />
                         </we-selection-items>
                     </div>
@@ -230,6 +232,7 @@
                                     onColorLeave="(params) => this._colorpaletteApply('border-color', params)"
                                     onColorPicked="(params) => this._onColorpaletteColorPicked('border-color', params)"
                                     onCustomColorPicked="(params) => this._onColorpaletteColorPicked('border-color', params)"
+                                    getTemplate="this.props.getColorpickerTemplate"
                                     />
                             </we-selection-items>
                         </div>