diff --git a/src/components/IOC/IOCIcons/IOCIcons.js b/src/components/IOC/IOCIcons/IOCIcons.js
index c6113fd41df1d1dc37db7eb11d8a7a88e1ab1941..ffeb9c5b523ba0d5948e00b78167e3a397cf672f 100644
--- a/src/components/IOC/IOCIcons/IOCIcons.js
+++ b/src/components/IOC/IOCIcons/IOCIcons.js
@@ -9,8 +9,7 @@ import {
   PauseCircleFilled
 } from "@mui/icons-material";
 import Popover from "../../common/Popover";
-import { AlertBanner } from "@ess-ics/ce-ui-common";
-import LabeledIcon from "../../common/LabeledIcon/LabeledIcon";
+import { AlertBanner, LabeledIcon } from "@ess-ics/ce-ui-common";
 
 const STATUS = {
   active: "active",
diff --git a/src/components/Job/JobStatus.js b/src/components/Job/JobStatus.js
index f50570ca89c1e94ca9ef1ba76dd58509143c388f..1b7e0a544fafd7bfd071ed77d9f849b9c8e4765e 100644
--- a/src/components/Job/JobStatus.js
+++ b/src/components/Job/JobStatus.js
@@ -1,7 +1,6 @@
-import { Stepper, STEPPER_STATES } from "@ess-ics/ce-ui-common";
+import { Stepper, STEPPER_STATES, LabeledIcon } from "@ess-ics/ce-ui-common";
 import { HelpOutline } from "@mui/icons-material";
 import React from "react";
-import LabeledIcon from "../common/LabeledIcon";
 
 const ActiveIcon = STEPPER_STATES.active.outlinedIcon;
 const CompletedIcon = STEPPER_STATES.completed.outlinedIcon;
diff --git a/src/components/common/LabeledIcon/LabeledIcon.js b/src/components/common/LabeledIcon/LabeledIcon.js
deleted file mode 100644
index a75f15801708e3c77ed2e973b7b6e85965ddb577..0000000000000000000000000000000000000000
--- a/src/components/common/LabeledIcon/LabeledIcon.js
+++ /dev/null
@@ -1,74 +0,0 @@
-import React from "react";
-import { node, oneOfType, string, oneOf, object } from "prop-types";
-import { Stack, Tooltip, Typography } from "@mui/material";
-
-/**
- * Component that renders an icon with a label.
- *
- * @param {object} Icon icon reference (provided as e.g. TheIcon, not as JSX e.g. <TheIcon />)
- * @param {object} IconProps additional props to pass to the Icon. Accessibility props are already provided.
- * @param {string} label text or Component to render as the label for the icon
- * @param {object} LabelProps additional props to provide to the label when rendered as a Typography component
- * (not applicable when positioned as "tooltip" or "none").
- * @param {string} labelPosition describes position of the label. "tooltip" provides the label as a tooltip,
- * "left" and "right" positions the label to the left or right respectively, and "none" provides no visible label
- * (but still includes a11y attributes so that it is visible to screen readers)
- */
-const LabeledIcon = React.forwardRef((props, ref) => {
-  const {
-    className,
-    Icon,
-    IconProps,
-    label,
-    LabelProps,
-    labelPosition = "tooltip",
-    ...rest
-  } = props;
-
-  if (labelPosition === "tooltip") {
-    return (
-      <Tooltip
-        title={label}
-        className={className}
-      >
-        <Icon
-          titleAccess={label}
-          {...IconProps}
-        />
-      </Tooltip>
-    );
-  }
-  if (labelPosition === "none") {
-    return (
-      <Icon
-        titleAccess={label}
-        {...IconProps}
-      />
-    );
-  }
-
-  const renderedLabel = <Typography {...LabelProps}>{label}</Typography>;
-  return (
-    <Stack
-      flexDirection="row"
-      gap={0.5}
-      alignItems="center"
-      className={className}
-      ref={ref}
-      {...rest}
-    >
-      {labelPosition === "left" ? renderedLabel : null}
-      <Icon {...IconProps} />
-      {labelPosition === "right" ? renderedLabel : null}
-    </Stack>
-  );
-});
-LabeledIcon.propTypes = {
-  Icon: object,
-  IconProps: object,
-  label: oneOfType([string, node]),
-  LabelProps: object,
-  labelPosition: oneOf(["tooltip", "right", "left", "none"])
-};
-
-export default LabeledIcon;
diff --git a/src/components/common/LabeledIcon/index.js b/src/components/common/LabeledIcon/index.js
deleted file mode 100644
index 484513514a310d79980055d46a2b48dd6bc4d55e..0000000000000000000000000000000000000000
--- a/src/components/common/LabeledIcon/index.js
+++ /dev/null
@@ -1,4 +0,0 @@
-import LabeledIcon from "./LabeledIcon";
-
-export { LabeledIcon };
-export default LabeledIcon;
diff --git a/src/components/deployments/DeploymentIcons.js b/src/components/deployments/DeploymentIcons.js
index 8f846303f5bd06277721d7d5e26d8ab4fa894b9f..61c711df5a95be614f8b0c09da6d1c8adc995939 100644
--- a/src/components/deployments/DeploymentIcons.js
+++ b/src/components/deployments/DeploymentIcons.js
@@ -8,7 +8,7 @@ import {
   RemoveCircleOutline
 } from "@mui/icons-material";
 import { theme } from "../../style/Theme";
-import { LabeledIcon } from "../common/LabeledIcon";
+import { LabeledIcon } from "@ess-ics/ce-ui-common";
 
 export function DeploymentStatusIcon({ status }) {
   const deploymentStatusIcons = {
diff --git a/src/components/host/HostIcons.js b/src/components/host/HostIcons.js
index 6058ff70d9391156fc5045d031f7a3b950155835..d4e4afa124c4b871e57873820c002284ba56c645 100644
--- a/src/components/host/HostIcons.js
+++ b/src/components/host/HostIcons.js
@@ -7,7 +7,7 @@ import {
   RadioButtonUnchecked,
   HelpOutline
 } from "@mui/icons-material";
-import LabeledIcon from "../common/LabeledIcon";
+import { LabeledIcon } from "@ess-ics/ce-ui-common";
 
 export function HostStatusIcon({ host }) {
   const theme = useTheme();
diff --git a/src/components/records/RecordIcons.js b/src/components/records/RecordIcons.js
index aa7b9788d1e819b4fe7df6393783c4401fe52b58..fc529afb8beecb16999f84ccd8ffd2ba5b71a2a8 100644
--- a/src/components/records/RecordIcons.js
+++ b/src/components/records/RecordIcons.js
@@ -1,6 +1,6 @@
 import React from "react";
 import { useTheme } from "@mui/material";
-import LabeledIcon from "../common/LabeledIcon";
+import { LabeledIcon } from "@ess-ics/ce-ui-common";
 import {
   Brightness1,
   RadioButtonUnchecked,
diff --git a/src/stories/components/common/LabeledIcon/LabeledIcon.stories.js b/src/stories/components/common/LabeledIcon/LabeledIcon.stories.js
deleted file mode 100644
index f4251be32e517cebef9adf29f19d32b6064a7c5d..0000000000000000000000000000000000000000
--- a/src/stories/components/common/LabeledIcon/LabeledIcon.stories.js
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from "react";
-import LabeledIcon from "../../../../components/common/LabeledIcon/LabeledIcon";
-import AccountCircleIcon from "@mui/icons-material/AccountCircle";
-import { RouterHarness } from "../../../../mocks/AppHarness";
-
-export default {
-  title: "common/LabeledIcon",
-  argTypes: {
-    labelPosition: {
-      options: ["none", "right", "left"],
-      control: { type: "radio" }
-    }
-  }
-};
-
-const Template = (args) => {
-  return (
-    <RouterHarness>
-      <LabeledIcon
-        Icon={AccountCircleIcon}
-        {...args}
-      />
-    </RouterHarness>
-  );
-};
-
-export const Default = (args) => <Template {...args} />;
-Default.args = {
-  label: "Account",
-  LabelProps: { fontWeight: "bold" },
-  labelPosition: "right",
-  IconProps: { color: "primary" }
-};