diff --git a/wax-prosemirror-services/src/HighlightService/components/TextHighlightingTool.js b/wax-prosemirror-services/src/HighlightService/components/TextHighlightingTool.js
index 81baedb01210d91d5b8c515afb92e5f76a75e39d..3e1ba8c21429b4ee256f100854f1ece56fe1a9ac 100644
--- a/wax-prosemirror-services/src/HighlightService/components/TextHighlightingTool.js
+++ b/wax-prosemirror-services/src/HighlightService/components/TextHighlightingTool.js
@@ -1,6 +1,6 @@
 import React, { useMemo, useState, useRef, useContext } from 'react';
 import styled from 'styled-components';
-import { grid } from '@pubsweet/ui-toolkit';
+import { grid, override } from '@pubsweet/ui-toolkit';
 import { v4 as uuidv4 } from 'uuid';
 import {
   WaxContext,
@@ -25,6 +25,8 @@ const DropWrapper = styled.div`
   position: absolute;
   top: 32px;
   width: max-content;
+
+  ${override('Wax.HighlightToolWrapper')}
 `;
 const TextHighlightComponent = styled.div`
   background: white;
diff --git a/wax-prosemirror-services/src/SpecialCharactersService/components/SpecialCharactersTool.js b/wax-prosemirror-services/src/SpecialCharactersService/components/SpecialCharactersTool.js
index 0389b28a1441d35ed6a76d9bb60b4a2969403b36..8943b8c38606941bf68fbd2b819ea4a84a21a7b9 100644
--- a/wax-prosemirror-services/src/SpecialCharactersService/components/SpecialCharactersTool.js
+++ b/wax-prosemirror-services/src/SpecialCharactersService/components/SpecialCharactersTool.js
@@ -1,6 +1,6 @@
 import React, { useContext, useMemo, useState, useRef } from 'react';
 import styled from 'styled-components';
-import { grid } from '@pubsweet/ui-toolkit';
+import { grid, override } from '@pubsweet/ui-toolkit';
 import {
   WaxContext,
   useOnClickOutside,
@@ -19,6 +19,8 @@ const DropWrapper = styled.div`
   margin-top: ${grid(1)};
   position: absolute;
   top: 32px;
+
+  ${override('Wax.SpecialCharacterToolWrapper')}
 `;
 
 const SpecialCharactersTool = ({ item }) => {
diff --git a/wax-prosemirror-services/src/TransformService/components/TransformCaseComponent.js b/wax-prosemirror-services/src/TransformService/components/TransformCaseComponent.js
index 99c17c00d4dd7e5cd402b985e484dba313cb2366..649f9e6644c9b37a723462b097d4b5e492f7ce56 100644
--- a/wax-prosemirror-services/src/TransformService/components/TransformCaseComponent.js
+++ b/wax-prosemirror-services/src/TransformService/components/TransformCaseComponent.js
@@ -1,6 +1,6 @@
 import React, { useContext, useMemo, useRef, useState } from 'react';
 import styled from 'styled-components';
-import { grid } from '@pubsweet/ui-toolkit';
+import { grid, override } from '@pubsweet/ui-toolkit';
 import { v4 as uuid } from 'uuid';
 import {
   WaxContext,
@@ -21,6 +21,8 @@ const DropWrapper = styled.div`
   position: absolute;
   top: 32px;
   width: max-content;
+
+  ${override('Wax.TransformToolWrapper')}
 `;
 const TextTransformCaseComponent = styled.div`
   background: white;