diff --git a/packages/manager/.changeset/pr-10524-tech-stories-1716999765184.md b/packages/manager/.changeset/pr-10524-tech-stories-1716999765184.md
new file mode 100644
index 00000000000..2e6b8ba7975
--- /dev/null
+++ b/packages/manager/.changeset/pr-10524-tech-stories-1716999765184.md
@@ -0,0 +1,5 @@
+---
+"@linode/manager": Tech Stories
+---
+
+Clean up loading components ([#10524](https://github.com/linode/manager/pull/10524))
diff --git a/packages/manager/src/components/Autocomplete/Autocomplete.tsx b/packages/manager/src/components/Autocomplete/Autocomplete.tsx
index cc9a4100c73..90a7202f4d5 100644
--- a/packages/manager/src/components/Autocomplete/Autocomplete.tsx
+++ b/packages/manager/src/components/Autocomplete/Autocomplete.tsx
@@ -120,7 +120,7 @@ export const Autocomplete = <
               <>
                 {loading && (
                   <InputAdornment position="end">
-                    <CircleProgress mini={true} />
+                    <CircleProgress size="sm" />
                   </InputAdornment>
                 )}
                 {textFieldProps?.InputProps?.endAdornment}
diff --git a/packages/manager/src/components/CircleProgress/CircleProgress.test.tsx b/packages/manager/src/components/CircleProgress/CircleProgress.test.tsx
index b9416f0f1e6..989113ef285 100644
--- a/packages/manager/src/components/CircleProgress/CircleProgress.test.tsx
+++ b/packages/manager/src/components/CircleProgress/CircleProgress.test.tsx
@@ -15,40 +15,21 @@ describe('CircleProgress', () => {
     const circle = screen.getByTestId('circle-progress');
     expect(circle).toBeInTheDocument();
     expect(circle).toHaveStyle('width: 124px; height: 124px;');
-    const innerCircle = screen.getByTestId('inner-circle-progress');
-    expect(innerCircle).toBeInTheDocument();
   });
 
-  it('renders a mini CircleProgress', () => {
-    const screen = renderWithTheme(<CircleProgress mini />);
+  it('renders a small CircleProgress', () => {
+    const screen = renderWithTheme(<CircleProgress size="sm" />);
 
     const circleProgress = screen.getByLabelText(CONTENT_LOADING);
     expect(circleProgress).toBeVisible();
     expect(circleProgress).toHaveStyle('width: 40px; height: 40px;');
   });
 
-  it('sets a mini CircleProgress with no padding', () => {
-    const screen = renderWithTheme(<CircleProgress mini noPadding />);
+  it('sets a small CircleProgress with no padding', () => {
+    const screen = renderWithTheme(<CircleProgress noPadding size="sm" />);
 
     const circleProgress = screen.getByLabelText(CONTENT_LOADING);
     expect(circleProgress).toBeVisible();
-    expect(circleProgress).toHaveStyle('width: 22px; height: 22px;');
-  });
-
-  it('sets a mini CircleProgress with a custom size', () => {
-    const screen = renderWithTheme(<CircleProgress mini size={25} />);
-
-    const circleProgress = screen.getByLabelText(CONTENT_LOADING);
-    expect(circleProgress).toBeVisible();
-    expect(circleProgress).toHaveStyle('width: 25px; height: 25px;');
-  });
-
-  it('renders a CircleProgress without the inner circle', () => {
-    const screen = renderWithTheme(<CircleProgress noInner />);
-
-    const circleProgress = screen.getByLabelText(CONTENT_LOADING);
-    expect(circleProgress).toBeVisible();
-    const innerCircle = screen.queryByTestId('inner-circle-progress');
-    expect(innerCircle).not.toBeInTheDocument();
+    expect(circleProgress).toHaveStyle('width: 20px; height: 20px;');
   });
 });
diff --git a/packages/manager/src/components/CircleProgress/CircleProgress.tsx b/packages/manager/src/components/CircleProgress/CircleProgress.tsx
index 24fe6e240fb..115f41c5422 100644
--- a/packages/manager/src/components/CircleProgress/CircleProgress.tsx
+++ b/packages/manager/src/components/CircleProgress/CircleProgress.tsx
@@ -1,58 +1,63 @@
+import _CircularProgress from '@mui/material/CircularProgress';
 import { SxProps, styled } from '@mui/material/styles';
 import * as React from 'react';
 
 import { Box } from 'src/components/Box';
-import {
-  CircularProgress,
-  CircularProgressProps,
-} from 'src/components/CircularProgress';
 import { omittedProps } from 'src/utilities/omittedProps';
 
-interface CircleProgressProps extends CircularProgressProps {
+import type { CircularProgressProps } from '@mui/material/CircularProgress';
+
+interface CircleProgressProps extends Omit<CircularProgressProps, 'size'> {
   /**
    * Additional child elements to pass in
    */
   children?: JSX.Element;
   /**
-   * Displays a smaller version of the circle progress.
-   */
-  mini?: boolean;
-  /**
-   * If true, will not show an inner circle beneath the spinning circle
-   */
-  noInner?: boolean;
-  /**
-   * Removes the padding for `mini` circle progresses only.
+   * Removes the padding
    */
   noPadding?: boolean;
   /**
-   * To be primarily used with mini and noPadding. Set spinner to a custom size.
+   * Sets the size of the spinner
+   * @default "lg"
    */
-  size?: number;
+  size?: 'lg' | 'md' | 'sm' | 'xs';
   /**
    * Additional styles to apply to the root element.
    */
   sx?: SxProps;
 }
 
+const SIZE_MAP = {
+  lg: 124,
+  md: 40,
+  sm: 20,
+  xs: 14,
+};
+
 /**
- * Use for short, indeterminate activities requiring user attention.
+ * Use for short, indeterminate activities requiring user attention. Defaults to large.
+ *
+ * sizes:
+ * xs = 14
+ * md = 20
+ * md = 40
+ * lg = 124
  */
 const CircleProgress = (props: CircleProgressProps) => {
-  const { children, mini, noInner, noPadding, size, sx, ...rest } = props;
+  const { children, noPadding, size, sx, ...rest } = props;
 
   const variant =
     typeof props.value === 'number' ? 'determinate' : 'indeterminate';
   const value = typeof props.value === 'number' ? props.value : 0;
 
-  if (mini) {
+  if (size) {
     return (
-      <StyledMiniCircularProgress
+      <StyledCustomCircularProgress
         aria-label="Content is loading"
         data-qa-circle-progress
         data-testid="circle-progress"
         noPadding={noPadding}
-        size={size ? size : noPadding ? 22 : 40}
+        size={noPadding ? SIZE_MAP[size] : SIZE_MAP[size] * 2}
         tabIndex={0}
       />
     );
@@ -63,16 +68,11 @@ const CircleProgress = (props: CircleProgressProps) => {
       {children !== undefined && (
         <Box sx={{ marginTop: 4, position: 'absolute' }}>{children}</Box>
       )}
-      {noInner !== true && (
-        <StyledTopWrapperDiv data-testid="inner-circle-progress">
-          <StyledTopDiv />
-        </StyledTopWrapperDiv>
-      )}
       <StyledCircularProgress
         {...rest}
         data-qa-circle-progress={value}
         data-testid="circle-progress"
-        size={124}
+        size={SIZE_MAP['lg']}
         thickness={2}
         value={value}
         variant={variant}
@@ -96,39 +96,17 @@ const StyledRootDiv = styled('div')(({ theme }) => ({
   width: '100%',
 }));
 
-const StyledTopWrapperDiv = styled('div')(({}) => ({
-  alignItems: 'center',
-  display: 'flex',
-  height: '100%',
-  justifyContent: 'center',
-  position: 'absolute',
-  width: '100%',
-}));
-
-const StyledTopDiv = styled('div')(({ theme }) => ({
-  border: '1px solid #999',
-  borderRadius: '50%',
-  height: 70,
-  [theme.breakpoints.up('sm')]: {
-    height: 120,
-    width: 120,
+const StyledCircularProgress = styled(_CircularProgress)(({ theme }) => ({
+  position: 'relative',
+  [theme.breakpoints.down('sm')]: {
+    height: '72px !important',
+    width: '72px !important',
   },
-  width: 70,
 }));
 
-const StyledCircularProgress = styled(CircularProgress)<CircleProgressProps>(
-  ({ theme }) => ({
-    position: 'relative',
-    [theme.breakpoints.down('sm')]: {
-      height: '72px !important',
-      width: '72px !important',
-    },
-  })
-);
-
-const StyledMiniCircularProgress = styled(CircularProgress, {
+const StyledCustomCircularProgress = styled(_CircularProgress, {
   shouldForwardProp: omittedProps(['noPadding']),
-})<CircleProgressProps>(({ theme, ...props }) => ({
+})<{ noPadding: boolean | undefined }>(({ theme, ...props }) => ({
   padding: `calc(${theme.spacing()} * 1.3)`,
   ...(props.noPadding && {
     padding: 0,
diff --git a/packages/manager/src/components/CircularProgress.stories.tsx b/packages/manager/src/components/CircularProgress.stories.tsx
deleted file mode 100644
index db6c4271610..00000000000
--- a/packages/manager/src/components/CircularProgress.stories.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { Meta, StoryObj } from '@storybook/react';
-import React from 'react';
-
-import { CircularProgress } from './CircularProgress';
-
-const meta: Meta<typeof CircularProgress> = {
-  component: CircularProgress,
-  title: 'Components/Loading States/Circular Progress',
-};
-
-type Story = StoryObj<typeof CircularProgress>;
-
-export const Default: Story = {
-  render: (args) => <CircularProgress {...args} />,
-};
-
-export default meta;
diff --git a/packages/manager/src/components/CircularProgress.tsx b/packages/manager/src/components/CircularProgress.tsx
deleted file mode 100644
index 95ab3dd9391..00000000000
--- a/packages/manager/src/components/CircularProgress.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import _CircularProgress from '@mui/material/CircularProgress';
-import React from 'react';
-
-import type { CircularProgressProps } from '@mui/material/CircularProgress';
-
-/**
- * Not to be confused with `<CircleProgress />`.
- * @todo Consolidate these two components
- */
-export const CircularProgress = (props: CircularProgressProps) => {
-  return <_CircularProgress {...props} />;
-};
-
-export type { CircularProgressProps };
diff --git a/packages/manager/src/components/DebouncedSearchTextField/DebouncedSearchTextField.tsx b/packages/manager/src/components/DebouncedSearchTextField/DebouncedSearchTextField.tsx
index 0c215e5cf97..cb5c23eafc7 100644
--- a/packages/manager/src/components/DebouncedSearchTextField/DebouncedSearchTextField.tsx
+++ b/packages/manager/src/components/DebouncedSearchTextField/DebouncedSearchTextField.tsx
@@ -82,7 +82,7 @@ export const DebouncedSearchTextField = React.memo(
         InputProps={{
           endAdornment: isSearching ? (
             <InputAdornment position="end">
-              <CircleProgress mini={true} />
+              <CircleProgress size="sm" />
             </InputAdornment>
           ) : (
             clearable &&
diff --git a/packages/manager/src/components/EnhancedSelect/components/LoadingIndicator.tsx b/packages/manager/src/components/EnhancedSelect/components/LoadingIndicator.tsx
index 14a1283fdf7..88cbadaeeb3 100644
--- a/packages/manager/src/components/EnhancedSelect/components/LoadingIndicator.tsx
+++ b/packages/manager/src/components/EnhancedSelect/components/LoadingIndicator.tsx
@@ -1,13 +1,13 @@
 import { styled } from '@mui/material/styles';
 import * as React from 'react';
 
-import { CircularProgress } from 'src/components/CircularProgress';
+import { CircleProgress } from 'src/components/CircleProgress';
 
 export const LoadingIndicator = () => {
-  return <StyledCircularProgress data-testid="input-loading" size={20} />;
+  return <StyledCircleProgress data-testid="input-loading" size="sm" />;
 };
 
-const StyledCircularProgress = styled(CircularProgress)(() => ({
+const StyledCircleProgress = styled(CircleProgress)(() => ({
   position: 'relative',
   right: 20,
 }));
diff --git a/packages/manager/src/components/LandingLoading/LandingLoading.stories.tsx b/packages/manager/src/components/LandingLoading/LandingLoading.stories.tsx
deleted file mode 100644
index a57b9a11097..00000000000
--- a/packages/manager/src/components/LandingLoading/LandingLoading.stories.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import React from 'react';
-
-import { DEFAULT_DELAY, LandingLoading } from './LandingLoading';
-
-import type { Meta, StoryObj } from '@storybook/react';
-
-const meta: Meta<typeof LandingLoading> = {
-  argTypes: {},
-  args: {
-    children: undefined,
-    delayInMS: DEFAULT_DELAY,
-    shouldDelay: false,
-  },
-  component: LandingLoading,
-  title: 'Components/Loading States/LandingLoading',
-};
-
-export default meta;
-
-type Story = StoryObj<typeof LandingLoading>;
-
-export const Default: Story = {
-  args: {},
-  render: (args) => <LandingLoading {...args} />,
-};
diff --git a/packages/manager/src/components/LandingLoading/LandingLoading.test.tsx b/packages/manager/src/components/LandingLoading/LandingLoading.test.tsx
deleted file mode 100644
index ac5944a63a3..00000000000
--- a/packages/manager/src/components/LandingLoading/LandingLoading.test.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import { act, render, screen } from '@testing-library/react';
-import * as React from 'react';
-
-import { DEFAULT_DELAY, LandingLoading } from './LandingLoading';
-
-vi.useFakeTimers();
-
-const LOADING_ICON = 'circle-progress';
-
-describe('LandingLoading', () => {
-  afterEach(() => {
-    vi.clearAllTimers();
-  });
-
-  it('renders the loading indicator by default', () => {
-    render(<LandingLoading />);
-    expect(screen.getByTestId(LOADING_ICON)).toBeInTheDocument();
-  });
-
-  it('renders custom loading indicator when children are provided', () => {
-    render(
-      <LandingLoading>
-        <div data-testid="custom-loading-indicator">Loading...</div>
-      </LandingLoading>
-    );
-    expect(screen.getByTestId('custom-loading-indicator')).toBeInTheDocument();
-    expect(screen.queryByTestId(LOADING_ICON)).toBeNull();
-  });
-
-  it('does not render the loading indicator when shouldDelay is true', () => {
-    render(<LandingLoading shouldDelay />);
-    expect(screen.queryByTestId(LOADING_ICON)).toBeNull();
-  });
-
-  it('renders the loading indicator after the delay', () => {
-    render(<LandingLoading shouldDelay />);
-    expect(screen.queryByTestId(LOADING_ICON)).toBeNull();
-    act(() => {
-      vi.advanceTimersByTime(DEFAULT_DELAY);
-    });
-    expect(screen.getByTestId(LOADING_ICON)).toBeInTheDocument();
-  });
-
-  it('renders the loading indicator after the specified delayInMS', () => {
-    render(<LandingLoading delayInMS={2000} />);
-    expect(screen.queryByTestId(LOADING_ICON)).toBeNull();
-    act(() => {
-      vi.advanceTimersByTime(2000);
-    });
-    expect(screen.getByTestId(LOADING_ICON)).toBeInTheDocument();
-  });
-
-  it('does not render the loading indicator when shouldDelay is false and no delayInMS is provided', () => {
-    render(<LandingLoading shouldDelay={false} />);
-    expect(screen.getByTestId(LOADING_ICON)).toBeInTheDocument();
-  });
-});
diff --git a/packages/manager/src/components/LandingLoading/LandingLoading.tsx b/packages/manager/src/components/LandingLoading/LandingLoading.tsx
deleted file mode 100644
index 520b04fd21f..00000000000
--- a/packages/manager/src/components/LandingLoading/LandingLoading.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import * as React from 'react';
-
-import { CircleProgress } from 'src/components/CircleProgress';
-
-export const DEFAULT_DELAY = 1000;
-
-interface LandingLoadingProps {
-  /**  Allow children to be passed in to override the default loading indicator */
-  children?: JSX.Element;
-  /**  If given, the loading indicator will not be rendered for the given duration in milliseconds */
-  delayInMS?: number;
-  /** If true, the loading indicator will not be rendered for 1 second which may give user's with fast connections a more fluid experience. */
-  shouldDelay?: boolean;
-}
-
-export const LandingLoading = ({
-  children,
-  delayInMS,
-  shouldDelay,
-}: LandingLoadingProps): JSX.Element | null => {
-  const [showLoading, setShowLoading] = React.useState<boolean>(false);
-
-  React.useEffect(() => {
-    /* This `didCancel` business is to prevent a warning from React.
-     * See: https://github.com/facebook/react/issues/14369#issuecomment-468267798
-     */
-    let didCancel = false;
-    // Reference to the timeoutId so we can cancel it
-    let timeoutId: NodeJS.Timeout | null = null;
-
-    if (shouldDelay || typeof delayInMS === 'number') {
-      // Used specified duration or default
-      const delayDuration =
-        typeof delayInMS === 'number' ? delayInMS : DEFAULT_DELAY;
-
-      timeoutId = setTimeout(() => {
-        if (!didCancel) {
-          setShowLoading(true);
-        }
-      }, delayDuration);
-    } else {
-      setShowLoading(true);
-    }
-    return () => {
-      didCancel = true;
-      if (timeoutId) {
-        clearTimeout(timeoutId);
-      }
-    };
-  }, [shouldDelay, delayInMS]);
-
-  return showLoading
-    ? children || <CircleProgress data-testid="circle-progress" />
-    : null;
-};
diff --git a/packages/manager/src/components/LinkButton.tsx b/packages/manager/src/components/LinkButton.tsx
index 55d118bbc42..4d4c21c25f9 100644
--- a/packages/manager/src/components/LinkButton.tsx
+++ b/packages/manager/src/components/LinkButton.tsx
@@ -1,10 +1,11 @@
 import { Theme } from '@mui/material/styles';
-import { makeStyles } from 'tss-react/mui';
 import * as React from 'react';
+import { makeStyles } from 'tss-react/mui';
+
+import { CircleProgress } from 'src/components/CircleProgress';
 
 import { Box } from './Box';
 import { StyledLinkButton } from './Button/StyledLinkButton';
-import { CircularProgress } from './CircularProgress';
 
 const useStyles = makeStyles()((theme: Theme) => ({
   disabled: {
@@ -12,9 +13,6 @@ const useStyles = makeStyles()((theme: Theme) => ({
     cursor: 'default',
     pointerEvents: 'none',
   },
-  spinner: {
-    marginLeft: theme.spacing(),
-  },
 }));
 
 interface Props {
@@ -58,7 +56,9 @@ export const LinkButton = (props: Props) => {
     return (
       <Box alignItems="center" display="flex">
         {Button}
-        <CircularProgress className={classes.spinner} size={12} />
+        <Box marginLeft={1}>
+          <CircleProgress noPadding size="xs" />
+        </Box>
       </Box>
     );
   }
diff --git a/packages/manager/src/components/MenuItem/MenuItem.tsx b/packages/manager/src/components/MenuItem/MenuItem.tsx
index 2473835f403..3d153a1fda0 100644
--- a/packages/manager/src/components/MenuItem/MenuItem.tsx
+++ b/packages/manager/src/components/MenuItem/MenuItem.tsx
@@ -3,7 +3,6 @@ import { Theme } from '@mui/material/styles';
 import * as React from 'react';
 import { makeStyles } from 'tss-react/mui';
 
-import { CircularProgress } from 'src/components/CircularProgress';
 import { IconButton } from 'src/components/IconButton';
 import { MenuItem, MenuItemProps } from 'src/components/MenuItem';
 
@@ -88,9 +87,6 @@ export const WrapperMenuItem = (props: WrapperMenuItemCombinedProps) => {
       {...rest}
       className={`${classes.root} ${className} ${tooltip && 'hasTooltip'}`}
     >
-      {isLoading && (
-        <CircularProgress className={classes.circleProgress} size={20} />
-      )}
       <span className={shouldWrapLabel && classes.labelWrapper}>
         <span className={shouldWrapLabel && classes.label}>
           {props.children}
diff --git a/packages/manager/src/components/TableSortCell/TableSortCell.tsx b/packages/manager/src/components/TableSortCell/TableSortCell.tsx
index fd7d860288b..8cd56dd0452 100644
--- a/packages/manager/src/components/TableSortCell/TableSortCell.tsx
+++ b/packages/manager/src/components/TableSortCell/TableSortCell.tsx
@@ -98,7 +98,7 @@ export const TableSortCell = (props: TableSortCellProps) => {
         {children}
         {!active && <Sort className={classes.initialIcon} />}
       </TableSortLabel>
-      {isLoading && <CircleProgress mini />}
+      {isLoading && <CircleProgress size="sm" />}
     </TableCell>
   );
 };
diff --git a/packages/manager/src/components/TagCell/TagCell.tsx b/packages/manager/src/components/TagCell/TagCell.tsx
index a79ea11bd84..7340707d0a9 100644
--- a/packages/manager/src/components/TagCell/TagCell.tsx
+++ b/packages/manager/src/components/TagCell/TagCell.tsx
@@ -132,7 +132,7 @@ export const TagCell = (props: TagCellProps) => {
           >
             {loading ? (
               <StyledCircleDiv>
-                <CircleProgress mini />
+                <CircleProgress size="sm" />
               </StyledCircleDiv>
             ) : null}
             {tags.map((thisTag) => (
diff --git a/packages/manager/src/components/TextField.tsx b/packages/manager/src/components/TextField.tsx
index 15a71b066d7..cdf0a429d6a 100644
--- a/packages/manager/src/components/TextField.tsx
+++ b/packages/manager/src/components/TextField.tsx
@@ -427,7 +427,7 @@ export const TextField = (props: TextFieldProps) => {
             disableUnderline: true,
             endAdornment: loading && (
               <InputAdornment position="end">
-                <CircleProgress mini />
+                <CircleProgress size="sm" />
               </InputAdornment>
             ),
             ...InputProps,
diff --git a/packages/manager/src/components/TransferDisplay/TransferDisplay.tsx b/packages/manager/src/components/TransferDisplay/TransferDisplay.tsx
index e05c8ce2448..971ec80d6b7 100644
--- a/packages/manager/src/components/TransferDisplay/TransferDisplay.tsx
+++ b/packages/manager/src/components/TransferDisplay/TransferDisplay.tsx
@@ -43,7 +43,7 @@ export const TransferDisplay = React.memo(({ spacingTop }: Props) => {
         {isLoading ? (
           <>
             <Typography>Loading transfer data...</Typography>
-            <CircleProgress mini />
+            <CircleProgress size="sm" />
           </>
         ) : (
           <>
diff --git a/packages/manager/src/features/Account/SwitchAccounts/ChildAccountList.tsx b/packages/manager/src/features/Account/SwitchAccounts/ChildAccountList.tsx
index 7803c0c7573..0e2242a2c18 100644
--- a/packages/manager/src/features/Account/SwitchAccounts/ChildAccountList.tsx
+++ b/packages/manager/src/features/Account/SwitchAccounts/ChildAccountList.tsx
@@ -77,7 +77,7 @@ export const ChildAccountList = React.memo(
     ) {
       return (
         <Box display="flex" justifyContent="center">
-          <CircleProgress mini size={70} />
+          <CircleProgress size="md" />
         </Box>
       );
     }
@@ -144,7 +144,7 @@ export const ChildAccountList = React.memo(
       <Stack alignItems={'flex-start'} data-testid="child-account-list">
         {!isSwitchingChildAccounts && !isLoading && renderChildAccounts}
         {hasNextPage && <Waypoint onEnter={() => fetchNextPage()} />}
-        {isFetchingNextPage && <CircleProgress mini />}
+        {isFetchingNextPage && <CircleProgress size="sm" />}
       </Stack>
     );
   }
diff --git a/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/GooglePayButton.tsx b/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/GooglePayButton.tsx
index 99835eefb88..f9fdb454989 100644
--- a/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/GooglePayButton.tsx
+++ b/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/GooglePayButton.tsx
@@ -145,7 +145,7 @@ export const GooglePayButton = (props: Props) => {
         container
         justifyContent="center"
       >
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </Grid>
     );
   }
diff --git a/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/PayPalButton.tsx b/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/PayPalButton.tsx
index 6da3a6056d7..94b614ffe95 100644
--- a/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/PayPalButton.tsx
+++ b/packages/manager/src/features/Billing/BillingPanels/BillingSummary/PaymentDrawer/PayPalButton.tsx
@@ -222,7 +222,7 @@ export const PayPalButton = (props: Props) => {
         container
         justifyContent="center"
       >
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </Grid>
     );
   }
diff --git a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/GooglePayChip.tsx b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/GooglePayChip.tsx
index 2cc8901c1db..b79ac9dadf7 100644
--- a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/GooglePayChip.tsx
+++ b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/GooglePayChip.tsx
@@ -102,7 +102,7 @@ export const GooglePayChip = (props: Props) => {
   if (isLoading) {
     return (
       <Grid>
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </Grid>
     );
   }
diff --git a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PayPalChip.tsx b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PayPalChip.tsx
index 7c76f26d092..b96626489e5 100644
--- a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PayPalChip.tsx
+++ b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PayPalChip.tsx
@@ -161,7 +161,7 @@ export const PayPalChip = (props: Props) => {
   if (isLoading || isPending || !options['data-client-token']) {
     return (
       <Grid>
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </Grid>
     );
   }
diff --git a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PaymentMethods.tsx b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PaymentMethods.tsx
index fb16f7e602e..056fc1c7e61 100644
--- a/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PaymentMethods.tsx
+++ b/packages/manager/src/features/Billing/BillingPanels/PaymentInfoPanel/PaymentMethods.tsx
@@ -33,7 +33,7 @@ const PaymentMethods = ({
           justifyContent: 'center',
         }}
       >
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </Grid>
     );
   }
diff --git a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryConnectionDetails.tsx b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryConnectionDetails.tsx
index 17d32930f5e..a313fe32b60 100644
--- a/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryConnectionDetails.tsx
+++ b/packages/manager/src/features/Databases/DatabaseDetail/DatabaseSummary/DatabaseSummaryConnectionDetails.tsx
@@ -244,7 +244,7 @@ export const DatabaseSummaryConnectionDetails = (props: Props) => {
           </Typography>
           {showCredentials && credentialsLoading ? (
             <div className={classes.progressCtn}>
-              <CircleProgress mini noPadding size={12} />
+              <CircleProgress noPadding size="xs" />
             </div>
           ) : credentialsError ? (
             <>
diff --git a/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Backups/BackupSelect.tsx b/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Backups/BackupSelect.tsx
index e00f06e22df..11e1ee972cf 100644
--- a/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Backups/BackupSelect.tsx
+++ b/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Backups/BackupSelect.tsx
@@ -3,8 +3,8 @@ import React from 'react';
 import { useController, useWatch } from 'react-hook-form';
 
 import { Box } from 'src/components/Box';
-import { CircularProgress } from 'src/components/CircularProgress';
 import { DateTimeDisplay } from 'src/components/DateTimeDisplay';
+import { LinearProgress } from 'src/components/LinearProgress';
 import { Notice } from 'src/components/Notice/Notice';
 import { Paper } from 'src/components/Paper';
 import { SelectionCard } from 'src/components/SelectionCard/SelectionCard';
@@ -38,11 +38,7 @@ export const BackupSelect = () => {
     }
 
     if (isFetching) {
-      return (
-        <Stack alignItems="center">
-          <CircularProgress />
-        </Stack>
-      );
+      return <LinearProgress />;
     }
 
     if (hasNoBackups) {
diff --git a/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Marketplace/AppsList.tsx b/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Marketplace/AppsList.tsx
index 59dfc3b7a07..839e13bc267 100644
--- a/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Marketplace/AppsList.tsx
+++ b/packages/manager/src/features/Linodes/LinodeCreatev2/Tabs/Marketplace/AppsList.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import { useController, useFormContext } from 'react-hook-form';
 
 import { Box } from 'src/components/Box';
-import { CircularProgress } from 'src/components/CircularProgress';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { ErrorState } from 'src/components/ErrorState/ErrorState';
 import { Stack } from 'src/components/Stack';
 import { oneClickApps } from 'src/features/OneClickApps/oneClickAppsv2';
@@ -53,7 +53,7 @@ export const AppsList = ({ onOpenDetailsDrawer }: Props) => {
         justifyContent="center"
         width="100%"
       >
-        <CircularProgress />
+        <CircleProgress size="md" />
       </Box>
     );
   }
diff --git a/packages/manager/src/features/Linodes/LinodesCreate/SelectAppPanel.tsx b/packages/manager/src/features/Linodes/LinodesCreate/SelectAppPanel.tsx
index ada6d0d36b7..4c9241c1ed9 100644
--- a/packages/manager/src/features/Linodes/LinodesCreate/SelectAppPanel.tsx
+++ b/packages/manager/src/features/Linodes/LinodesCreate/SelectAppPanel.tsx
@@ -1,8 +1,8 @@
 import { Theme, styled } from '@mui/material/styles';
 import * as React from 'react';
 
+import { CircleProgress } from 'src/components/CircleProgress';
 import { ErrorState } from 'src/components/ErrorState/ErrorState';
-import { LandingLoading } from 'src/components/LandingLoading/LandingLoading';
 import { Notice } from 'src/components/Notice/Notice';
 import { Paper } from 'src/components/Paper';
 import { AppPanelSection } from 'src/features/Linodes/LinodesCreate/AppPanelSection';
@@ -74,7 +74,7 @@ class SelectAppPanel extends React.PureComponent<Props> {
       return (
         <StyledPanel error={error} title="Select App">
           <StyledLoadingSpan>
-            <LandingLoading />
+            <CircleProgress />
           </StyledLoadingSpan>
         </StyledPanel>
       );
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/IPTransfer.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/IPTransfer.tsx
index cea0386e54e..872c66cb5be 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/IPTransfer.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/IPTransfer.tsx
@@ -503,7 +503,7 @@ export const IPTransfer = (props: Props) => {
         ) : null}
         {(isLoading || ipv6RangesLoading) && searchText === '' ? (
           <div style={{ display: 'flex', justifyContent: 'center' }}>
-            <CircleProgress mini />
+            <CircleProgress size="sm" />
           </div>
         ) : (
           <>
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/LinodeIPAddressRow.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/LinodeIPAddressRow.tsx
index 9f517a993b5..903580bcbb9 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/LinodeIPAddressRow.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/LinodeIPAddressRow.tsx
@@ -151,7 +151,7 @@ const RangeRDNSCell = (props: {
   const ipsWithRDNS = listIPv6InRange(range.range, range.prefix, ipsInRegion);
 
   if (ipv6Loading) {
-    return <CircleProgress mini noPadding />;
+    return <CircleProgress size="sm" />;
   }
 
   // We don't show anything if there are no addresses.
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferContent.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferContent.tsx
index 9a6cc88ef49..c0b65afd2e6 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferContent.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferContent.tsx
@@ -75,7 +75,7 @@ export const TransferContent = (props: ContentProps) => {
     return (
       <Grid container justifyContent="center">
         <Grid>
-          <CircleProgress mini />
+          <CircleProgress size="sm" />
         </Grid>
       </Grid>
     );
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferHistory.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferHistory.tsx
index 3fbbb76e73e..a37c972bc48 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferHistory.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeNetworking/NetworkingSummaryPanel/TransferHistory.tsx
@@ -119,7 +119,7 @@ export const TransferHistory = React.memo((props: Props) => {
     if (statsLoading) {
       return (
         <StyledDiv>
-          <CircleProgress mini />
+          <CircleProgress size="sm" />
         </StyledDiv>
       );
     }
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeSettings/LinodeWatchdogPanel.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeSettings/LinodeWatchdogPanel.tsx
index e1a22966b17..e7eafa6cad4 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeSettings/LinodeWatchdogPanel.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeSettings/LinodeWatchdogPanel.tsx
@@ -1,8 +1,9 @@
-import { Box, CircularProgress, Stack } from '@mui/material';
+import { Box, Stack } from '@mui/material';
 import Grid from '@mui/material/Unstable_Grid2';
 import * as React from 'react';
 
 import { Accordion } from 'src/components/Accordion';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { FormControlLabel } from 'src/components/FormControlLabel';
 import { Notice } from 'src/components/Notice/Notice';
 import { Toggle } from 'src/components/Toggle/Toggle';
@@ -58,7 +59,7 @@ export const LinodeWatchdogPanel = (props: Props) => {
             label={
               <Stack alignItems="center" direction="row" spacing={1}>
                 <Box>{linode?.watchdog_enabled ? 'Enabled' : 'Disabled'}</Box>
-                <Box>{isLoading && <CircularProgress size={16} />}</Box>
+                <Box>{isLoading && <CircleProgress size="sm" />}</Box>
               </Stack>
             }
             disabled={isReadOnly}
diff --git a/packages/manager/src/features/Linodes/LinodesDetail/LinodeSummary/StatsPanel.tsx b/packages/manager/src/features/Linodes/LinodesDetail/LinodeSummary/StatsPanel.tsx
index 0c3b9b3b82b..d6a3576cb9b 100644
--- a/packages/manager/src/features/Linodes/LinodesDetail/LinodeSummary/StatsPanel.tsx
+++ b/packages/manager/src/features/Linodes/LinodesDetail/LinodeSummary/StatsPanel.tsx
@@ -21,14 +21,14 @@ export const StatsPanel = (props: Props) => {
       {loading ? (
         <div
           style={{
-            minHeight: height,
             alignItems: 'center',
             display: 'flex',
             justifyContent: 'center',
+            minHeight: height,
             width: '100%',
           }}
         >
-          <CircleProgress mini />
+          <CircleProgress size="sm" />
         </div>
       ) : (
         renderBody()
diff --git a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerConfigurations.tsx b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerConfigurations.tsx
index 06db352e302..5c8923bb7bf 100644
--- a/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerConfigurations.tsx
+++ b/packages/manager/src/features/LoadBalancers/LoadBalancerDetail/LoadBalancerConfigurations.tsx
@@ -52,7 +52,7 @@ export const LoadBalancerConfigurations = () => {
         ))}
       </Box>
       {hasNextPage && <Waypoint onEnter={() => fetchNextPage()} />}
-      {isFetchingNextPage && <CircleProgress mini />}
+      {isFetchingNextPage && <CircleProgress size="sm" />}
       <Stack spacing={2}>
         <Box>
           <Button buttonType="outlined" onClick={() => setIsCreating(true)}>
diff --git a/packages/manager/src/features/Longview/LongviewDetail/DetailTabs/Disks/Disks.tsx b/packages/manager/src/features/Longview/LongviewDetail/DetailTabs/Disks/Disks.tsx
index 9bacebfc806..64222f5404c 100644
--- a/packages/manager/src/features/Longview/LongviewDetail/DetailTabs/Disks/Disks.tsx
+++ b/packages/manager/src/features/Longview/LongviewDetail/DetailTabs/Disks/Disks.tsx
@@ -1,9 +1,9 @@
 import { APIError } from '@linode/api-v4/lib/types';
 import * as React from 'react';
 
+import { CircleProgress } from 'src/components/CircleProgress';
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { ErrorState } from 'src/components/ErrorState/ErrorState';
-import { LandingLoading } from 'src/components/LandingLoading/LandingLoading';
 import { Placeholder } from 'src/components/Placeholder/Placeholder';
 
 import { WithStartAndEnd } from '../../../request.types';
@@ -64,7 +64,7 @@ const Disks = (props: Props) => {
     }
 
     if (loading && Object.keys(diskData).length === 0) {
-      return <LandingLoading />;
+      return <CircleProgress />;
     }
     /*
       Longview doesn't return the Disk stats in any particular order, so sort them
diff --git a/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.test.tsx b/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.test.tsx
index 4057d539084..07db574b1d5 100644
--- a/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.test.tsx
+++ b/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.test.tsx
@@ -137,7 +137,7 @@ describe('LongviewPlans', () => {
 
     renderWithTheme(<LongviewPlans {...props} />);
 
-    await waitForElementToBeRemoved(screen.getByTestId('loading'), {
+    await waitForElementToBeRemoved(screen.getByTestId('circle-progress'), {
       timeout: 5000,
     });
 
diff --git a/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.tsx b/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.tsx
index 6a1d777ae9b..29a1ff93a1a 100644
--- a/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.tsx
+++ b/packages/manager/src/features/Longview/LongviewLanding/LongviewPlans.tsx
@@ -8,7 +8,7 @@ import { useTheme } from '@mui/material/styles';
 import * as React from 'react';
 
 import { Button } from 'src/components/Button/Button';
-import { CircularProgress } from 'src/components/CircularProgress';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { Notice } from 'src/components/Notice/Notice';
 import { Paper } from 'src/components/Paper';
@@ -164,7 +164,7 @@ export const LongviewPlans = (props: LongviewPlansProps) => {
     !mayUserModifyLVSubscription;
 
   if (!profile) {
-    return <CircularProgress data-testid="loading" />;
+    return <CircleProgress />;
   }
 
   return (
diff --git a/packages/manager/src/features/Managed/SSHAccess/LinodePubKey.tsx b/packages/manager/src/features/Managed/SSHAccess/LinodePubKey.tsx
index 8b8a871790a..1cbf47f132c 100644
--- a/packages/manager/src/features/Managed/SSHAccess/LinodePubKey.tsx
+++ b/packages/manager/src/features/Managed/SSHAccess/LinodePubKey.tsx
@@ -64,7 +64,7 @@ const LinodePubKey = () => {
   if (isLoading) {
     return (
       <StyledLoadingStatePaper>
-        <StyledCircleProgress mini />
+        <StyledCircleProgress size="sm" />
       </StyledLoadingStatePaper>
     );
   }
diff --git a/packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/TablesPanel.tsx b/packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/TablesPanel.tsx
index b77813c7574..d8ceecb19a1 100644
--- a/packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/TablesPanel.tsx
+++ b/packages/manager/src/features/NodeBalancers/NodeBalancerDetail/NodeBalancerSummary/TablesPanel.tsx
@@ -283,6 +283,6 @@ const Loading = () => (
       minHeight: 300,
     }}
   >
-    <CircleProgress mini />
+    <CircleProgress size="sm" />
   </div>
 );
diff --git a/packages/manager/src/features/NotificationCenter/NotificationSection.tsx b/packages/manager/src/features/NotificationCenter/NotificationSection.tsx
index 2dc9b40673d..d905dfb0a8b 100644
--- a/packages/manager/src/features/NotificationCenter/NotificationSection.tsx
+++ b/packages/manager/src/features/NotificationCenter/NotificationSection.tsx
@@ -149,7 +149,7 @@ const ContentBody = React.memo((props: BodyProps) => {
   if (loading) {
     return (
       <StyledLoadingContainer>
-        <CircleProgress mini />
+        <CircleProgress size="sm" />
       </StyledLoadingContainer>
     );
   }
diff --git a/packages/manager/src/features/ObjectStorage/BucketLanding/OveragePricing.tsx b/packages/manager/src/features/ObjectStorage/BucketLanding/OveragePricing.tsx
index 727c20d5cdc..7a277db53ec 100644
--- a/packages/manager/src/features/ObjectStorage/BucketLanding/OveragePricing.tsx
+++ b/packages/manager/src/features/ObjectStorage/BucketLanding/OveragePricing.tsx
@@ -2,7 +2,8 @@ import { Region } from '@linode/api-v4';
 import { styled } from '@mui/material/styles';
 import React from 'react';
 
-import { CircularProgress } from 'src/components/CircularProgress';
+import { Box } from 'src/components/Box';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { TextTooltip } from 'src/components/TextTooltip';
 import { Typography } from 'src/components/Typography';
 import { useObjectStorageTypesQuery } from 'src/queries/objectStorage';
@@ -45,7 +46,9 @@ export const OveragePricing = (props: Props) => {
   );
 
   return isLoading ? (
-    <CircularProgress size={16} sx={{ marginTop: 2 }} />
+    <Box marginLeft={-1} marginTop={1}>
+      <CircleProgress size="sm" />
+    </Box>
   ) : (
     <>
       <StyledTypography>
@@ -75,6 +78,7 @@ export const OveragePricing = (props: Props) => {
             the{' '}
             <TextTooltip
               displayText="network transfer pool for this region"
+              placement="top"
               tooltipText={DC_SPECIFIC_TRANSFER_POOLS_TOOLTIP_TEXT}
             />
           </>
@@ -83,6 +87,7 @@ export const OveragePricing = (props: Props) => {
             your{' '}
             <TextTooltip
               displayText="global network transfer pool"
+              placement="top"
               tooltipText={GLOBAL_TRANSFER_POOL_TOOLTIP_TEXT}
             />
           </>
diff --git a/packages/manager/src/features/PlacementGroups/PlacementGroupsLanding/PlacementGroupsLanding.tsx b/packages/manager/src/features/PlacementGroups/PlacementGroupsLanding/PlacementGroupsLanding.tsx
index 3c191b04a3b..154e9cc6621 100644
--- a/packages/manager/src/features/PlacementGroups/PlacementGroupsLanding/PlacementGroupsLanding.tsx
+++ b/packages/manager/src/features/PlacementGroups/PlacementGroupsLanding/PlacementGroupsLanding.tsx
@@ -180,7 +180,7 @@ export const PlacementGroupsLanding = React.memo(() => {
         InputProps={{
           endAdornment: query && (
             <InputAdornment position="end">
-              {isFetching && <CircleProgress mini />}
+              {isFetching && <CircleProgress size="sm" />}
 
               <IconButton
                 aria-label="Clear"
diff --git a/packages/manager/src/features/Profile/Referrals/Referrals.tsx b/packages/manager/src/features/Profile/Referrals/Referrals.tsx
index 763b35a0a06..08c491c2183 100644
--- a/packages/manager/src/features/Profile/Referrals/Referrals.tsx
+++ b/packages/manager/src/features/Profile/Referrals/Referrals.tsx
@@ -4,7 +4,7 @@ import * as React from 'react';
 import Step1 from 'src/assets/referrals/step-1.svg';
 import Step2 from 'src/assets/referrals/step-2.svg';
 import Step3 from 'src/assets/referrals/step-3.svg';
-import { CircularProgress } from 'src/components/CircularProgress';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { CopyableTextField } from 'src/components/CopyableTextField/CopyableTextField';
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { Link } from 'src/components/Link';
@@ -46,7 +46,7 @@ export const Referrals = () => {
   }
 
   if (profileLoading || !profile) {
-    return <CircularProgress />;
+    return <CircleProgress />;
   }
 
   const { completed, credit, pending, total, url } = profile?.referrals;
diff --git a/packages/manager/src/features/StackScripts/StackScriptBase/StackScriptBase.tsx b/packages/manager/src/features/StackScripts/StackScriptBase/StackScriptBase.tsx
index 4a284dfe15a..4d183833047 100644
--- a/packages/manager/src/features/StackScripts/StackScriptBase/StackScriptBase.tsx
+++ b/packages/manager/src/features/StackScripts/StackScriptBase/StackScriptBase.tsx
@@ -249,7 +249,7 @@ const withStackScriptBase = (options: WithStackScriptBaseOptions) => (
                */}
               {gettingMoreStackScripts && !isSorting && (
                 <div style={{ margin: '32px 0 32px 0', textAlign: 'center' }}>
-                  <CircleProgress mini />
+                  <CircleProgress size="sm" />
                 </div>
               )}
             </React.Fragment>
diff --git a/packages/manager/src/features/Support/SupportTicketDetail/SupportTicketDetail.tsx b/packages/manager/src/features/Support/SupportTicketDetail/SupportTicketDetail.tsx
index 28dcbb0ebfe..f25f248db17 100644
--- a/packages/manager/src/features/Support/SupportTicketDetail/SupportTicketDetail.tsx
+++ b/packages/manager/src/features/Support/SupportTicketDetail/SupportTicketDetail.tsx
@@ -125,7 +125,7 @@ export const SupportTicketDetail = () => {
               ticketUpdated={ticket ? ticket.updated : ''}
             />
           ))}
-          {repliesLoading && <CircleProgress mini />}
+          {repliesLoading && <CircleProgress size="sm" />}
           {repliesError ? (
             <ErrorState errorText={repliesError?.[0].reason} />
           ) : null}
diff --git a/packages/manager/src/features/VPCs/VPCDetail/SubnetLinodeRow.tsx b/packages/manager/src/features/VPCs/VPCDetail/SubnetLinodeRow.tsx
index 99d256362d6..4879592020f 100644
--- a/packages/manager/src/features/VPCs/VPCDetail/SubnetLinodeRow.tsx
+++ b/packages/manager/src/features/VPCs/VPCDetail/SubnetLinodeRow.tsx
@@ -102,7 +102,7 @@ export const SubnetLinodeRow = (props: Props) => {
     return (
       <TableRow>
         <TableCell colSpan={6}>
-          <CircleProgress mini />
+          <CircleProgress size="sm" />
         </TableCell>
       </TableRow>
     );
diff --git a/packages/manager/src/features/Volumes/VolumeDrawer/PricePanel.tsx b/packages/manager/src/features/Volumes/VolumeDrawer/PricePanel.tsx
index ad1ee389651..ffa3a5119d8 100644
--- a/packages/manager/src/features/Volumes/VolumeDrawer/PricePanel.tsx
+++ b/packages/manager/src/features/Volumes/VolumeDrawer/PricePanel.tsx
@@ -1,11 +1,12 @@
-import { CircularProgress } from '@mui/material';
 import * as React from 'react';
 
 import { Box } from 'src/components/Box';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { DisplayPrice } from 'src/components/DisplayPrice';
 import { MAX_VOLUME_SIZE } from 'src/constants';
 import { useVolumeTypesQuery } from 'src/queries/volumes/volumes';
 import { getDCSpecificPriceByType } from 'src/utilities/pricing/dynamicPricing';
+
 interface Props {
   currentSize: number;
   regionId: string;
@@ -34,13 +35,17 @@ export const PricePanel = ({ currentSize, regionId, value }: Props) => {
       : getPrice(currentSize);
   const price = getClampedPrice(value, currentSize);
 
+  if (isLoading) {
+    return (
+      <Box marginLeft={-1} marginTop={2}>
+        <CircleProgress size="sm" />
+      </Box>
+    );
+  }
+
   return (
     <Box marginTop={4}>
-      {isLoading ? (
-        <CircularProgress size={18} />
-      ) : (
-        <DisplayPrice interval="mo" price={price ? Number(price) : '--.--'} />
-      )}
+      <DisplayPrice interval="mo" price={price ? Number(price) : '--.--'} />
     </Box>
   );
 };
diff --git a/packages/manager/src/features/Volumes/VolumeDrawer/SizeField.tsx b/packages/manager/src/features/Volumes/VolumeDrawer/SizeField.tsx
index bad1abae3ab..71b8b6f3b29 100644
--- a/packages/manager/src/features/Volumes/VolumeDrawer/SizeField.tsx
+++ b/packages/manager/src/features/Volumes/VolumeDrawer/SizeField.tsx
@@ -1,9 +1,9 @@
-import { CircularProgress } from '@mui/material';
 import { Theme } from '@mui/material/styles';
 import * as React from 'react';
 import { makeStyles } from 'tss-react/mui';
 
 import { Box } from 'src/components/Box';
+import { CircleProgress } from 'src/components/CircleProgress';
 import { FormHelperText } from 'src/components/FormHelperText';
 import { InputAdornment } from 'src/components/InputAdornment';
 import { TextField } from 'src/components/TextField';
@@ -117,7 +117,7 @@ export const SizeField = (props: Props) => {
       />
       <div className={classes.priceDisplay}>
         {shouldShowPriceLoadingSpinner ? (
-          <CircularProgress size={16} />
+          <CircleProgress noPadding size="sm" />
         ) : hasSelectedRegion ? (
           priceDisplayText
         ) : (
diff --git a/packages/manager/src/features/Volumes/VolumesLanding.tsx b/packages/manager/src/features/Volumes/VolumesLanding.tsx
index d0c4cd8e3ee..662cb870e29 100644
--- a/packages/manager/src/features/Volumes/VolumesLanding.tsx
+++ b/packages/manager/src/features/Volumes/VolumesLanding.tsx
@@ -1,10 +1,10 @@
 import * as React from 'react';
 import { useHistory, useLocation } from 'react-router-dom';
 
+import { CircleProgress } from 'src/components/CircleProgress';
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { ErrorState } from 'src/components/ErrorState/ErrorState';
 import { LandingHeader } from 'src/components/LandingHeader';
-import { LandingLoading } from 'src/components/LandingLoading/LandingLoading';
 import { PaginationFooter } from 'src/components/PaginationFooter/PaginationFooter';
 import { Table } from 'src/components/Table';
 import { TableBody } from 'src/components/TableBody';
@@ -115,7 +115,7 @@ export const VolumesLanding = () => {
   };
 
   if (isLoading) {
-    return <LandingLoading />;
+    return <CircleProgress />;
   }
 
   if (error) {
diff --git a/packages/manager/src/foundations/themes/light.ts b/packages/manager/src/foundations/themes/light.ts
index 1c2c63b87e1..75c064890b4 100644
--- a/packages/manager/src/foundations/themes/light.ts
+++ b/packages/manager/src/foundations/themes/light.ts
@@ -552,6 +552,9 @@ export const lightTheme: ThemeOptions = {
       },
     },
     MuiCircularProgress: {
+      defaultProps: {
+        disableShrink: true,
+      },
       styleOverrides: {
         circle: {
           strokeLinecap: 'inherit',