diff --git a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
index 654eadf4f5..1315ddfa60 100644
--- a/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
+++ b/superset-frontend/src/explore/components/controls/DndColumnSelectControl/Option.tsx
@@ -18,7 +18,7 @@
  */
 import React from 'react';
 import { useTheme } from '@superset-ui/core';
-import Icon from 'src/components/Icon';
+import Icons from 'src/components/Icons';
 import {
   CaretContainer,
   CloseContainer,
@@ -29,7 +29,6 @@ import { OptionProps } from 'src/explore/components/controls/DndColumnSelectCont
 
 export default function Option(props: OptionProps) {
   const theme = useTheme();
-
   return (
     <OptionControlContainer
       data-test="option-label"
@@ -40,12 +39,12 @@ export default function Option(props: OptionProps) {
         data-test="remove-control-button"
         onClick={() => props.clickClose(props.index)}
       >
-        <Icon name="x-small" color={theme.colors.grayscale.light1} />
+        <Icons.XSmall color={theme.colors.grayscale.light1} />
       </CloseContainer>
       <Label data-test="control-label">{props.children}</Label>
       {props.withCaret && (
         <CaretContainer>
-          <Icon name="caret-right" color={theme.colors.grayscale.light1} />
+          <Icons.CaretRight color={theme.colors.grayscale.light1} />
         </CaretContainer>
       )}
     </OptionControlContainer>
diff --git a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/AdhocFilterOption.test.tsx b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/AdhocFilterOption.test.tsx
index 48a813fdac..9a03b6cc96 100644
--- a/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/AdhocFilterOption.test.tsx
+++ b/superset-frontend/src/explore/components/controls/FilterControl/AdhocFilterOption/AdhocFilterOption.test.tsx
@@ -79,7 +79,7 @@ test('should render the remove button', () => {
 
 test('should render the right caret', () => {
   render(setup(mockedProps));
-  expect(screen.getByTestId('caret-right')).toBeInTheDocument();
+  expect(screen.getByRole('img', { name: 'caret-right' })).toBeInTheDocument();
 });
 
 test('should render the Popover on clicking the right caret', () => {
diff --git a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
index 521bcc9274..362ce0670e 100644
--- a/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
+++ b/superset-frontend/src/explore/components/controls/OptionControls/index.tsx
@@ -21,7 +21,7 @@ import { useDrag, useDrop, DropTargetMonitor } from 'react-dnd';
 import { styled, t, useTheme } from '@superset-ui/core';
 import { InfoTooltipWithTrigger } from '@superset-ui/chart-controls';
 import { Tooltip } from 'src/components/Tooltip';
-import Icon from 'src/components/Icon';
+import Icons from 'src/components/Icons';
 import { savedMetricType } from 'src/explore/components/controls/MetricControl/types';
 import AdhocMetric from 'src/explore/components/controls/MetricControl/AdhocMetric';
 import { StyledMetricOption } from '../../optionRenderers';
@@ -260,10 +260,10 @@ export const OptionControlLabel = ({
         data-test="remove-control-button"
         onClick={onRemove}
       >
-        <Icon name="x-small" color={theme.colors.grayscale.light1} />
+        <Icons.XSmall iconColor={theme.colors.grayscale.light1} />
       </CloseContainer>
       <Label data-test="control-label">
-        {isFunction && <Icon name="function" viewBox="0 0 16 11" />}
+        {isFunction && <Icons.FunctionX viewBox="0 0 16 11" iconSize="l" />}
         {getLabelContent()}
       </Label>
       {isExtra && (
@@ -279,7 +279,7 @@ export const OptionControlLabel = ({
       )}
       {withCaret && (
         <CaretContainer>
-          <Icon name="caret-right" color={theme.colors.grayscale.light1} />
+          <Icons.CaretRight iconColor={theme.colors.grayscale.light1} />
         </CaretContainer>
       )}
     </OptionControlContainer>