diff --git a/packages/esm-app-shell/src/declarations.d.tsx b/packages/esm-app-shell/src/declarations.d.tsx
deleted file mode 100644
index 31fd72d6f..000000000
--- a/packages/esm-app-shell/src/declarations.d.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-declare module "*.css" {
-  const styles: any;
-  export default styles;
-}
diff --git a/packages/esm-app-shell/webpack.config.js b/packages/esm-app-shell/webpack.config.js
index dc3af64bb..89e29ab93 100644
--- a/packages/esm-app-shell/webpack.config.js
+++ b/packages/esm-app-shell/webpack.config.js
@@ -62,29 +62,13 @@ module.exports = {
         },
       },
       {
-        test: /esm-styleguide\/.+\.css$/i,
+        test: /\.css$/,
         use: [
           { loader: require.resolve(MiniCssExtractPlugin.loader) },
           { loader: require.resolve("css-loader") },
           { loader: require.resolve("postcss-loader") },
         ],
       },
-      {
-        test: /node_modules\/.+\.css$/i,
-        use: ["style-loader", "css-loader"],
-      },
-      {
-        test: /esm-extensions\/.+\.css$/i,
-        use: [
-          "style-loader",
-          {
-            loader: "css-loader",
-            options: {
-              modules: true,
-            },
-          },
-        ],
-      },
       {
         test: /\.(woff|woff2|png)?$/,
         use: [{ loader: require.resolve("file-loader") }],
diff --git a/packages/esm-extensions/src/declarations.d.tsx b/packages/esm-extensions/src/declarations.d.tsx
deleted file mode 100644
index 31fd72d6f..000000000
--- a/packages/esm-extensions/src/declarations.d.tsx
+++ /dev/null
@@ -1,4 +0,0 @@
-declare module "*.css" {
-  const styles: any;
-  export default styles;
-}
diff --git a/packages/esm-extensions/src/extension-slot-react.component.tsx b/packages/esm-extensions/src/extension-slot-react.component.tsx
index 3c4d329cb..5fc8512b7 100644
--- a/packages/esm-extensions/src/extension-slot-react.component.tsx
+++ b/packages/esm-extensions/src/extension-slot-react.component.tsx
@@ -5,7 +5,6 @@ import React, {
   useEffect,
   useCallback,
 } from "react";
-import { TooltipIcon } from "carbon-components-react";
 import { ModuleNameContext, ExtensionContext } from "@openmrs/esm-context";
 import { configCacheNotifier } from "@openmrs/esm-config";
 import {
@@ -17,13 +16,13 @@ import {
   unregisterExtensionSlot,
   AttachedExtensionInfo,
 } from "./extensions";
-import styles from "./ui-editor.styles.css";
+import { TooltipIcon } from "carbon-components-react";
 
 interface ExtensionSlotBaseProps {
   extensionSlotName: string;
   children?: ReactNode;
+  style?: React.CSSProperties;
   state?: Record<string, any>;
-  className?: string;
 }
 
 // remainder of props are for the top-level <div>
@@ -32,8 +31,8 @@ export type ExtensionSlotReactProps<T = {}> = ExtensionSlotBaseProps & T;
 export const ExtensionSlotReact: React.FC<ExtensionSlotReactProps> = ({
   extensionSlotName,
   children,
+  style,
   state,
-  className,
   ...divProps
 }: ExtensionSlotReactProps) => {
   const [attachedExtensionInfos, setAttachedExtensionInfos] = useState<
@@ -74,12 +73,12 @@ export const ExtensionSlotReact: React.FC<ExtensionSlotReactProps> = ({
     return () => sub.unsubscribe();
   }, [extensionSlotName]);
 
-  const divClassName = `${className ?? ""} ${
-    getIsUIEditorEnabled() ? styles.slot : ""
-  }`;
+  const divStyle = getIsUIEditorEnabled()
+    ? { ...style, backgroundColor: "cyan" }
+    : style;
 
   return (
-    <div className={divClassName} {...divProps}>
+    <div style={divStyle} {...divProps}>
       {attachedExtensionInfos.map(
         ({
           extensionId,
@@ -102,9 +101,6 @@ export const ExtensionSlotReact: React.FC<ExtensionSlotReactProps> = ({
           );
         }
       )}
-      {getIsUIEditorEnabled() && (
-        <div className={styles.slotName}>{extensionSlotName}</div>
-      )}
     </div>
   );
 };
@@ -136,8 +132,12 @@ export const ExtensionReact: React.FC<ExtensionReactProps> = ({ state }) => {
   }, [actualExtensionSlotName, attachedExtensionSlotName, extensionId]);
 
   return getIsUIEditorEnabled() ? (
-    <TooltipIcon tooltipText={extensionId} align="center" direction="top">
-      <div className={styles.extension}>
+    <TooltipIcon
+      tooltipText={`Slot Name : ${attachedExtensionSlotName}`}
+      align="center"
+      direction="top"
+    >
+      <div style={{ outline: "0.125rem solid yellow" }}>
         <slot ref={ref} />
       </div>
     </TooltipIcon>
diff --git a/packages/esm-extensions/src/ui-editor.styles.css b/packages/esm-extensions/src/ui-editor.styles.css
deleted file mode 100644
index 38f976e8f..000000000
--- a/packages/esm-extensions/src/ui-editor.styles.css
+++ /dev/null
@@ -1,26 +0,0 @@
-.extension:hover:after {
-  content: " ";
-  z-index: 10;
-  display: block;
-  position: absolute;
-  height: 100%;
-  top: 0;
-  left: 0;
-  right: 0;
-  background: rgba(0, 0, 0, 0.2);
-  border: 1px solid blue;
-}
-
-.slot {
-  background-color: rgba(43, 43, 185, 0.1);
-  position: relative;
-}
-
-.slotName {
-  background-color: rgba(43, 43, 185, 0.1);
-  color: #393939;
-  padding: 0 0.5em 0.5em 0.5em;
-  position: absolute;
-  bottom: -1.5em;
-  right: 0;
-}
diff --git a/packages/esm-extensions/webpack.config.js b/packages/esm-extensions/webpack.config.js
index a76260012..8739b5aa1 100644
--- a/packages/esm-extensions/webpack.config.js
+++ b/packages/esm-extensions/webpack.config.js
@@ -2,7 +2,7 @@ const { resolve } = require("path");
 const CleanWebpackPlugin = require("clean-webpack-plugin").CleanWebpackPlugin;
 const ForkTsCheckerWebpackPlugin = require("fork-ts-checker-webpack-plugin");
 
-const { peerDependencies } = require("./package.json");
+const { peerDependencies } = require('./package.json');
 
 module.exports = {
   entry: [
@@ -27,22 +27,6 @@ module.exports = {
         exclude: /node_modules/,
         use: "babel-loader",
       },
-      {
-        test: /node_modules\/.+\.css$/i,
-        use: ["style-loader", "css-loader"],
-      },
-      {
-        test: /\.css$/,
-        use: [
-          "style-loader",
-          {
-            loader: "css-loader",
-            options: {
-              modules: true,
-            },
-          },
-        ],
-      },
     ],
   },
   resolve: {