diff --git a/src/components/Appbar/AppbarAction.tsx b/src/components/Appbar/AppbarAction.tsx
index 14982cbecb..212fcca952 100644
--- a/src/components/Appbar/AppbarAction.tsx
+++ b/src/components/Appbar/AppbarAction.tsx
@@ -1,11 +1,5 @@
 import * as React from 'react';
-import type {
-  Animated,
-  ColorValue,
-  StyleProp,
-  View,
-  ViewStyle,
-} from 'react-native';
+import type { Animated, StyleProp, View, ViewStyle } from 'react-native';
 
 import type { ThemeProp } from 'src/types';
 
@@ -20,10 +14,6 @@ export type Props = React.ComponentPropsWithoutRef<typeof IconButton> & {
    *  Custom color for action icon.
    */
   color?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Name of the icon to show.
    */
@@ -91,7 +81,6 @@ const AppbarAction = forwardRef<View, Props>(
       accessibilityLabel,
       isLeading,
       theme: themeOverrides,
-      rippleColor,
       ...rest
     }: Props,
     ref
@@ -115,7 +104,6 @@ const AppbarAction = forwardRef<View, Props>(
         accessibilityLabel={accessibilityLabel}
         animated
         ref={ref}
-        rippleColor={rippleColor}
         {...rest}
       />
     );
diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
index 1d1d0d3002..516ff915f7 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/Button.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   AccessibilityRole,
   Animated,
-  ColorValue,
   GestureResponderEvent,
   Platform,
   PressableAndroidRippleConfig,
@@ -13,8 +12,6 @@ import {
   ViewStyle,
 } from 'react-native';
 
-import color from 'color';
-
 import {
   ButtonMode,
   getButtonColors,
@@ -66,10 +63,6 @@ export type Props = $Omit<React.ComponentProps<typeof Surface>, 'mode'> & {
    * Custom button's text color.
    */
   textColor?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether to show a loading indicator.
    */
@@ -186,7 +179,6 @@ const Button = (
     icon,
     buttonColor: customButtonColor,
     textColor: customTextColor,
-    rippleColor: customRippleColor,
     children,
     accessibilityLabel,
     accessibilityHint,
@@ -292,9 +284,6 @@ const Button = (
       dark,
     });
 
-  const rippleColor =
-    customRippleColor || color(textColor).alpha(0.12).rgb().string();
-
   const touchableStyle = {
     ...borderRadiusStyles,
     borderRadius: borderRadiusStyles.borderRadius ?? borderRadius,
@@ -363,7 +352,6 @@ const Button = (
         accessible={accessible}
         hitSlop={hitSlop}
         disabled={disabled}
-        rippleColor={rippleColor}
         style={getButtonTouchableRippleStyle(touchableStyle, borderWidth)}
         testID={testID}
         theme={theme}
diff --git a/src/components/Checkbox/CheckboxItem.tsx b/src/components/Checkbox/CheckboxItem.tsx
index 869edd674a..45e86bcced 100644
--- a/src/components/Checkbox/CheckboxItem.tsx
+++ b/src/components/Checkbox/CheckboxItem.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -58,10 +57,6 @@ export type Props = {
    * Custom color for checkbox.
    */
   color?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Additional styles for container View.
    */
@@ -148,7 +143,6 @@ const CheckboxItem = ({
   disabled,
   labelVariant = 'bodyLarge',
   labelMaxFontSizeMultiplier = 1.5,
-  rippleColor,
   background,
   hitSlop,
   ...props
@@ -187,7 +181,6 @@ const CheckboxItem = ({
       onLongPress={onLongPress}
       testID={testID}
       disabled={disabled}
-      rippleColor={rippleColor}
       theme={theme}
       background={background}
       hitSlop={hitSlop}
diff --git a/src/components/Chip/Chip.tsx b/src/components/Chip/Chip.tsx
index 3706239b71..012cac4fc1 100644
--- a/src/components/Chip/Chip.tsx
+++ b/src/components/Chip/Chip.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   AccessibilityState,
   Animated,
-  ColorValue,
   GestureResponderEvent,
   Platform,
   PressableAndroidRippleConfig,
@@ -73,10 +72,6 @@ export type Props = $Omit<React.ComponentProps<typeof Surface>, 'mode'> & {
    * Note: Check will not be shown if `icon` is specified. If specified, `icon` will be shown regardless of `selected`.
    */
   showSelectedCheck?: boolean;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether the chip is disabled. A disabled chip is greyed out and `onPress` is not called on touch.
    */
@@ -201,7 +196,6 @@ const Chip = ({
   theme: themeOverrides,
   testID = 'chip',
   selectedColor,
-  rippleColor: customRippleColor,
   showSelectedOverlay = false,
   showSelectedCheck = true,
   ellipsizeMode,
@@ -263,7 +257,6 @@ const Chip = ({
     borderColor,
     textColor,
     iconColor,
-    rippleColor,
     selectedBackgroundColor,
     backgroundColor,
   } = getChipColors({
@@ -273,7 +266,6 @@ const Chip = ({
     showSelectedOverlay,
     customBackgroundColor,
     disabled,
-    customRippleColor,
   });
 
   const accessibilityState: AccessibilityState = {
@@ -324,7 +316,6 @@ const Chip = ({
         onPressIn={hasPassedTouchHandler ? handlePressIn : undefined}
         onPressOut={hasPassedTouchHandler ? handlePressOut : undefined}
         delayLongPress={delayLongPress}
-        rippleColor={rippleColor}
         disabled={disabled}
         accessibilityLabel={accessibilityLabel}
         accessibilityRole={accessibilityRole}
diff --git a/src/components/Chip/helpers.tsx b/src/components/Chip/helpers.tsx
index 7c654a22f6..0f191b2ac0 100644
--- a/src/components/Chip/helpers.tsx
+++ b/src/components/Chip/helpers.tsx
@@ -171,37 +171,6 @@ const getIconColor = ({
   return colors.onSecondaryContainer;
 };
 
-const getRippleColor = ({
-  theme,
-  isOutlined,
-  disabled,
-  selectedColor,
-  selectedBackgroundColor: _selectedBackgroundColor,
-  customRippleColor,
-}: BaseProps & {
-  selectedBackgroundColor: string;
-  selectedColor?: string;
-  customRippleColor?: ColorValue;
-}) => {
-  if (customRippleColor) {
-    return customRippleColor;
-  }
-
-  const isSelectedColor = selectedColor !== undefined;
-  const textColor = getTextColor({
-    theme,
-    disabled,
-    selectedColor,
-    isOutlined,
-  });
-
-  if (isSelectedColor) {
-    return color(selectedColor).alpha(0.12).rgb().string();
-  }
-
-  return color(textColor).alpha(0.12).rgb().string();
-};
-
 export const getChipColors = ({
   isOutlined,
   theme,
@@ -209,13 +178,11 @@ export const getChipColors = ({
   showSelectedOverlay,
   customBackgroundColor,
   disabled,
-  customRippleColor,
 }: BaseProps & {
   customBackgroundColor?: ColorValue;
   disabled?: boolean;
   showSelectedOverlay?: boolean;
   selectedColor?: string;
-  customRippleColor?: ColorValue;
 }) => {
   const baseChipColorProps = { theme, isOutlined, disabled };
 
@@ -244,12 +211,6 @@ export const getChipColors = ({
       ...baseChipColorProps,
       selectedColor,
     }),
-    rippleColor: getRippleColor({
-      ...baseChipColorProps,
-      selectedColor,
-      selectedBackgroundColor,
-      customRippleColor,
-    }),
     backgroundColor,
     selectedBackgroundColor,
   };
diff --git a/src/components/DataTable/DataTablePagination.tsx b/src/components/DataTable/DataTablePagination.tsx
index c7a5375f82..6e2612973e 100644
--- a/src/components/DataTable/DataTablePagination.tsx
+++ b/src/components/DataTable/DataTablePagination.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  ColorValue,
   I18nManager,
   StyleProp,
   StyleSheet,
@@ -57,14 +56,6 @@ type PaginationDropdownProps = {
    * The function to set the number of rows per page.
    */
   onItemsPerPageChange?: (numberOfItemsPerPage: number) => void;
-  /**
-   * Color of the dropdown item ripple effect.
-   */
-  dropdownItemRippleColor?: ColorValue;
-  /**
-   * Color of the select page dropdown ripple effect.
-   */
-  selectPageDropdownRippleColor?: ColorValue;
   /**
    * @optional
    */
@@ -88,10 +79,6 @@ type PaginationControlsProps = {
    * Whether to show fast forward and fast rewind buttons in pagination. False by default.
    */
   showFastPaginationControls?: boolean;
-  /**
-   * Color of the pagination control ripple effect.
-   */
-  paginationControlRippleColor?: ColorValue;
   /**
    * @optional
    */
@@ -104,7 +91,6 @@ const PaginationControls = ({
   onPageChange,
   showFastPaginationControls,
   theme: themeOverrides,
-  paginationControlRippleColor,
 }: PaginationControlsProps) => {
   const theme = useInternalTheme(themeOverrides);
 
@@ -123,7 +109,6 @@ const PaginationControls = ({
             />
           )}
           iconColor={textColor}
-          rippleColor={paginationControlRippleColor}
           disabled={page === 0}
           onPress={() => onPageChange(0)}
           accessibilityLabel="page-first"
@@ -140,7 +125,6 @@ const PaginationControls = ({
           />
         )}
         iconColor={textColor}
-        rippleColor={paginationControlRippleColor}
         disabled={page === 0}
         onPress={() => onPageChange(page - 1)}
         accessibilityLabel="chevron-left"
@@ -156,7 +140,6 @@ const PaginationControls = ({
           />
         )}
         iconColor={textColor}
-        rippleColor={paginationControlRippleColor}
         disabled={numberOfPages === 0 || page === numberOfPages - 1}
         onPress={() => onPageChange(page + 1)}
         accessibilityLabel="chevron-right"
@@ -173,7 +156,6 @@ const PaginationControls = ({
             />
           )}
           iconColor={textColor}
-          rippleColor={paginationControlRippleColor}
           disabled={numberOfPages === 0 || page === numberOfPages - 1}
           onPress={() => onPageChange(numberOfPages - 1)}
           accessibilityLabel="page-last"
@@ -189,8 +171,6 @@ const PaginationDropdown = ({
   numberOfItemsPerPage,
   onItemsPerPageChange,
   theme: themeOverrides,
-  selectPageDropdownRippleColor,
-  dropdownItemRippleColor,
 }: PaginationDropdownProps) => {
   const theme = useInternalTheme(themeOverrides);
   const { colors } = theme;
@@ -209,7 +189,6 @@ const PaginationDropdown = ({
           icon="menu-down"
           contentStyle={styles.contentStyle}
           theme={theme}
-          rippleColor={selectPageDropdownRippleColor}
         >
           {`${numberOfItemsPerPage}`}
         </Button>
@@ -227,7 +206,6 @@ const PaginationDropdown = ({
             onItemsPerPageChange?.(option);
             toggleSelect(false);
           }}
-          rippleColor={dropdownItemRippleColor}
           title={option}
           theme={theme}
         />
@@ -304,8 +282,6 @@ const DataTablePagination = ({
   onItemsPerPageChange,
   selectPageDropdownLabel,
   selectPageDropdownAccessibilityLabel,
-  selectPageDropdownRippleColor,
-  dropdownItemRippleColor,
   theme: themeOverrides,
   ...rest
 }: Props) => {
@@ -339,8 +315,6 @@ const DataTablePagination = ({
               numberOfItemsPerPageList={numberOfItemsPerPageList}
               numberOfItemsPerPage={numberOfItemsPerPage}
               onItemsPerPageChange={onItemsPerPageChange}
-              selectPageDropdownRippleColor={selectPageDropdownRippleColor}
-              dropdownItemRippleColor={dropdownItemRippleColor}
               theme={theme}
             />
           </View>
diff --git a/src/components/Drawer/DrawerItem.tsx b/src/components/Drawer/DrawerItem.tsx
index 7af3d9fcf4..6902b4b8cb 100644
--- a/src/components/Drawer/DrawerItem.tsx
+++ b/src/components/Drawer/DrawerItem.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -9,8 +8,6 @@ import {
   ViewStyle,
 } from 'react-native';
 
-import color from 'color';
-
 import { useInternalTheme } from '../../core/theming';
 import type { ThemeProp } from '../../types';
 import Icon, { IconSource } from '../Icon';
@@ -57,10 +54,6 @@ export type Props = React.ComponentPropsWithRef<typeof View> & {
    * Specifies the largest possible scale a label font can reach.
    */
   labelMaxFontSizeMultiplier?: number;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Sets additional distance outside of element in which a press can be detected.
    */
@@ -97,7 +90,6 @@ const DrawerItem = ({
   active,
   disabled,
   theme: themeOverrides,
-  rippleColor: customRippleColor,
   style,
   onPress,
   background,
@@ -117,7 +109,6 @@ const DrawerItem = ({
 
   const labelMargin = icon ? 12 : 0;
   const borderRadius = 7 * roundness;
-  const rippleColor = color(contentColor).alpha(0.12).rgb().string();
   const font = theme.fonts.labelLarge;
 
   return (
@@ -136,7 +127,6 @@ const DrawerItem = ({
         accessibilityRole="button"
         accessibilityState={{ selected: active }}
         accessibilityLabel={accessibilityLabel}
-        rippleColor={customRippleColor || rippleColor}
         theme={theme}
         hitSlop={hitSlop}
       >
diff --git a/src/components/FAB/AnimatedFAB.tsx b/src/components/FAB/AnimatedFAB.tsx
index 6b6964a4a9..c39144705c 100644
--- a/src/components/FAB/AnimatedFAB.tsx
+++ b/src/components/FAB/AnimatedFAB.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import type {
   AccessibilityState,
-  ColorValue,
   NativeSyntheticEvent,
   PressableAndroidRippleConfig,
   TextLayoutEventData,
@@ -20,8 +19,6 @@ import {
   Text,
 } from 'react-native';
 
-import color from 'color';
-
 import { getCombinedStyles, getFABColors, getLabelSizeWeb } from './utils';
 import { useInternalTheme } from '../../core/theming';
 import type { $Omit, $RemoveChildren, ThemeProp } from '../../types';
@@ -67,10 +64,6 @@ export type Props = $Omit<$RemoveChildren<typeof Surface>, 'mode'> & {
    * Custom color for the icon and label of the `FAB`.
    */
   color?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether `FAB` is disabled. A disabled button is greyed out and `onPress` is not called on touch.
    */
@@ -213,7 +206,6 @@ const AnimatedFAB = ({
   accessibilityLabel = label,
   accessibilityState,
   color: customColor,
-  rippleColor: customRippleColor,
   disabled,
   onPress,
   onLongPress,
@@ -313,9 +305,6 @@ const AnimatedFAB = ({
     customBackgroundColor,
   });
 
-  const rippleColor =
-    customRippleColor || color(foregroundColor).alpha(0.12).rgb().string();
-
   const extendedWidth = textWidth + SIZE + borderRadius;
 
   const distance = isAnimatedFromRight
@@ -462,7 +451,6 @@ const AnimatedFAB = ({
               onPress={onPress}
               onLongPress={onLongPress}
               delayLongPress={delayLongPress}
-              rippleColor={rippleColor}
               disabled={disabled}
               accessibilityLabel={accessibilityLabel}
               accessibilityRole="button"
diff --git a/src/components/FAB/FAB.tsx b/src/components/FAB/FAB.tsx
index 9ac9cf3435..ae8c3f193d 100644
--- a/src/components/FAB/FAB.tsx
+++ b/src/components/FAB/FAB.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import {
   AccessibilityState,
   Animated,
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -79,10 +78,6 @@ export type Props = $Omit<$RemoveChildren<typeof Surface>, 'mode'> & {
    * Custom color for the icon and label of the `FAB`.
    */
   color?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether `FAB` is disabled. A disabled button is greyed out and `onPress` is not called on touch.
    */
@@ -189,7 +184,6 @@ const FAB = forwardRef<View, Props>(
       accessibilityState,
       animated = true,
       color: customColor,
-      rippleColor: customRippleColor,
       disabled,
       onPress,
       onLongPress,
@@ -242,13 +236,12 @@ const FAB = forwardRef<View, Props>(
       backgroundColor: customBackgroundColor,
     } = (StyleSheet.flatten(style) || {}) as ViewStyle;
 
-    const { backgroundColor, foregroundColor, rippleColor } = getFABColors({
+    const { backgroundColor, foregroundColor } = getFABColors({
       theme,
       variant,
       disabled,
       customColor,
       customBackgroundColor,
-      customRippleColor,
     });
 
     const isLargeSize = size === 'large';
@@ -295,7 +288,6 @@ const FAB = forwardRef<View, Props>(
           onPress={onPress}
           onLongPress={onLongPress}
           delayLongPress={delayLongPress}
-          rippleColor={rippleColor}
           disabled={disabled}
           accessibilityLabel={accessibilityLabel}
           accessibilityRole="button"
diff --git a/src/components/FAB/FABGroup.tsx b/src/components/FAB/FABGroup.tsx
index de88de8185..5579728d98 100644
--- a/src/components/FAB/FABGroup.tsx
+++ b/src/components/FAB/FABGroup.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   Animated,
-  ColorValue,
   GestureResponderEvent,
   Pressable,
   StyleProp,
@@ -43,7 +42,6 @@ export type Props = {
    * - `toggleStackOnLongPress`: callback that is called when `FAB` is long pressed
    * - `size`: size of action item. Defaults to `small`. @supported Available in v5.x
    * - `testID`: testID to be used on tests
-   * - `rippleColor`: color of the ripple effect.
    */
   actions: Array<{
     icon: IconSource;
@@ -60,7 +58,6 @@ export type Props = {
     onPress: (e: GestureResponderEvent) => void;
     size?: 'small' | 'medium';
     testID?: string;
-    rippleColor?: ColorValue;
   }>;
   /**
    * Icon to display for the `FAB`.
@@ -79,10 +76,6 @@ export type Props = {
    * Custom backdrop color for opened speed dial background.
    */
   backdropColor?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Function to execute on pressing the `FAB`.
    */
@@ -221,7 +214,6 @@ const FABGroup = ({
   variant = 'primary',
   enableLongPressWhenStackOpened = false,
   backdropColor: customBackdropColor,
-  rippleColor,
 }: Props) => {
   const theme = useInternalTheme(themeOverrides);
   const { top, bottom, right, left } = useSafeAreaInsets();
@@ -466,7 +458,6 @@ const FABGroup = ({
                   importantForAccessibility="no-hide-descendants"
                   testID={it.testID}
                   visible={open}
-                  rippleColor={it.rippleColor}
                 />
               </View>
             );
@@ -487,7 +478,6 @@ const FABGroup = ({
           label={label}
           testID={testID}
           variant={variant}
-          rippleColor={rippleColor}
         />
       </View>
     </View>
diff --git a/src/components/FAB/utils.ts b/src/components/FAB/utils.ts
index 42dd05ff7e..384fcc6c45 100644
--- a/src/components/FAB/utils.ts
+++ b/src/components/FAB/utils.ts
@@ -234,14 +234,12 @@ export const getFABColors = ({
   disabled,
   customColor,
   customBackgroundColor,
-  customRippleColor,
 }: {
   theme: InternalTheme;
   variant: string;
   disabled?: boolean;
   customColor?: string;
   customBackgroundColor?: ColorValue;
-  customRippleColor?: ColorValue;
 }) => {
   const isVariant = (variantToCompare: Variant) => {
     return variant === variantToCompare;
@@ -262,8 +260,6 @@ export const getFABColors = ({
   return {
     backgroundColor,
     foregroundColor,
-    rippleColor:
-      customRippleColor || color(foregroundColor).alpha(0.12).rgb().string(),
   };
 };
 
diff --git a/src/components/IconButton/IconButton.tsx b/src/components/IconButton/IconButton.tsx
index 2da6e12fcf..dbe7de4841 100644
--- a/src/components/IconButton/IconButton.tsx
+++ b/src/components/IconButton/IconButton.tsx
@@ -6,7 +6,6 @@ import {
   ViewStyle,
   View,
   Animated,
-  ColorValue,
 } from 'react-native';
 
 import { getIconButtonColor } from './utils';
@@ -43,11 +42,6 @@ export type Props = Omit<$RemoveChildren<typeof TouchableRipple>, 'style'> & {
    */
   containerColor?: string;
   /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
-  /**
-   * @supported Available in v5.x with theme version 3
    * Whether icon button is selected. A selected button receives alternative combination of icon and container colors.
    */
   selected?: boolean;
@@ -120,7 +114,6 @@ const IconButton = forwardRef<View, Props>(
       icon,
       iconColor: customIconColor,
       containerColor: customContainerColor,
-      rippleColor: customRippleColor,
       size = 24,
       accessibilityLabel,
       disabled,
@@ -141,16 +134,14 @@ const IconButton = forwardRef<View, Props>(
 
     const IconComponent = animated ? CrossFadeIcon : Icon;
 
-    const { iconColor, rippleColor, backgroundColor, borderColor } =
-      getIconButtonColor({
-        theme,
-        disabled,
-        selected,
-        mode,
-        customIconColor,
-        customContainerColor,
-        customRippleColor,
-      });
+    const { iconColor, backgroundColor, borderColor } = getIconButtonColor({
+      theme,
+      disabled,
+      selected,
+      mode,
+      customIconColor,
+      customContainerColor,
+    });
 
     const buttonSize = size + 2 * PADDING;
 
@@ -186,7 +177,6 @@ const IconButton = forwardRef<View, Props>(
           borderless
           centered
           onPress={onPress}
-          rippleColor={rippleColor}
           accessibilityLabel={accessibilityLabel}
           style={[styles.touchable, contentStyle]}
           // @ts-expect-error We keep old a11y props for backwards compat with old RN versions
diff --git a/src/components/IconButton/utils.ts b/src/components/IconButton/utils.ts
index f808ec6970..fd985b04aa 100644
--- a/src/components/IconButton/utils.ts
+++ b/src/components/IconButton/utils.ts
@@ -1,7 +1,3 @@
-import type { ColorValue } from 'react-native';
-
-import color from 'color';
-
 import type { InternalTheme } from '../../types';
 
 type IconButtonMode = 'outlined' | 'contained' | 'contained-tonal';
@@ -109,19 +105,6 @@ const getIconColor = ({
   return theme.colors.onSurfaceVariant;
 };
 
-const getRippleColor = ({
-  iconColor,
-  customRippleColor,
-}: {
-  iconColor: string;
-  customRippleColor?: ColorValue;
-}) => {
-  if (customRippleColor) {
-    return customRippleColor;
-  }
-  return color(iconColor).alpha(0.12).rgb().string();
-};
-
 export const getIconButtonColor = ({
   theme,
   disabled,
@@ -129,7 +112,6 @@ export const getIconButtonColor = ({
   selected,
   customIconColor,
   customContainerColor,
-  customRippleColor,
 }: {
   theme: InternalTheme;
   disabled?: boolean;
@@ -137,7 +119,6 @@ export const getIconButtonColor = ({
   mode?: IconButtonMode;
   customIconColor?: string;
   customContainerColor?: string;
-  customRippleColor?: ColorValue;
 }) => {
   const isMode = (modeToCompare: IconButtonMode) => {
     return mode === modeToCompare;
@@ -161,7 +142,6 @@ export const getIconButtonColor = ({
       ...baseIconColorProps,
       customContainerColor,
     }),
-    rippleColor: getRippleColor({ iconColor, customRippleColor }),
     borderColor: getBorderColor({ theme, disabled }),
   };
 };
diff --git a/src/components/List/ListAccordion.tsx b/src/components/List/ListAccordion.tsx
index ace8810a71..3eaee97d61 100644
--- a/src/components/List/ListAccordion.tsx
+++ b/src/components/List/ListAccordion.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  ColorValue,
   GestureResponderEvent,
   I18nManager,
   NativeSyntheticEvent,
@@ -93,10 +92,6 @@ export type Props = {
    * Style that is passed to Description element.
    */
   descriptionStyle?: StyleProp<TextStyle>;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Truncate Title text such that the total number of lines does not
    * exceed this number.
@@ -186,7 +181,6 @@ const ListAccordion = ({
   descriptionStyle,
   titleNumberOfLines = 1,
   descriptionNumberOfLines = 2,
-  rippleColor: customRippleColor,
   style,
   containerStyle,
   contentStyle,
@@ -238,10 +232,9 @@ const ListAccordion = ({
     ? groupContext.expandedId === id
     : expandedInternal;
 
-  const { descriptionColor, titleTextColor, rippleColor } = getAccordionColors({
+  const { descriptionColor, titleTextColor } = getAccordionColors({
     theme,
     isExpanded,
-    customRippleColor,
   });
 
   const handlePress =
@@ -256,7 +249,6 @@ const ListAccordion = ({
           onPress={handlePress}
           onLongPress={onLongPress}
           delayLongPress={delayLongPress}
-          rippleColor={rippleColor}
           accessibilityRole="button"
           accessibilityState={{ expanded: isExpanded }}
           accessibilityLabel={accessibilityLabel}
diff --git a/src/components/List/utils.ts b/src/components/List/utils.ts
index 05186efe8e..11a1618fbc 100644
--- a/src/components/List/utils.ts
+++ b/src/components/List/utils.ts
@@ -1,6 +1,5 @@
-import { ColorValue, StyleSheet, StyleProp, ViewStyle } from 'react-native';
+import { StyleSheet, StyleProp, ViewStyle } from 'react-native';
 
-import color from 'color';
 import type { EllipsizeProp, InternalTheme, ThemeProp } from 'src/types';
 
 type Description =
@@ -90,11 +89,9 @@ const styles = StyleSheet.create({
 export const getAccordionColors = ({
   theme,
   isExpanded,
-  customRippleColor,
 }: {
   theme: InternalTheme;
   isExpanded?: boolean;
-  customRippleColor?: ColorValue;
 }) => {
   const titleColor = theme.colors.onSurface;
 
@@ -102,12 +99,8 @@ export const getAccordionColors = ({
 
   const titleTextColor = isExpanded ? theme.colors?.primary : titleColor;
 
-  const rippleColor =
-    customRippleColor || color(titleTextColor).alpha(0.12).rgb().string();
-
   return {
     descriptionColor,
     titleTextColor,
-    rippleColor,
   };
 };
diff --git a/src/components/Menu/MenuItem.tsx b/src/components/Menu/MenuItem.tsx
index 652ffc9a4f..725e38cd5b 100644
--- a/src/components/Menu/MenuItem.tsx
+++ b/src/components/Menu/MenuItem.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   AccessibilityState,
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -82,10 +81,6 @@ export type Props = {
    * Style that is passed to the Title element.
    */
   titleStyle?: StyleProp<TextStyle>;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * @optional
    */
@@ -142,7 +137,6 @@ const MenuItem = ({
   containerStyle,
   contentStyle,
   titleStyle,
-  rippleColor: customRippleColor,
   testID = 'menu-item',
   accessibilityLabel,
   accessibilityState,
@@ -151,10 +145,9 @@ const MenuItem = ({
   hitSlop,
 }: Props) => {
   const theme = useInternalTheme(themeOverrides);
-  const { titleColor, iconColor, rippleColor } = getMenuItemColor({
+  const { titleColor, iconColor } = getMenuItemColor({
     theme,
     disabled,
-    customRippleColor,
   });
   const containerPadding = 12;
 
@@ -190,7 +183,6 @@ const MenuItem = ({
       accessibilityLabel={accessibilityLabel}
       accessibilityRole="menuitem"
       accessibilityState={newAccessibilityState}
-      rippleColor={rippleColor}
       hitSlop={hitSlop}
     >
       <View style={[styles.row, containerStyle]}>
diff --git a/src/components/Menu/utils.ts b/src/components/Menu/utils.ts
index 71c503bcc2..8fc73ca082 100644
--- a/src/components/Menu/utils.ts
+++ b/src/components/Menu/utils.ts
@@ -1,7 +1,3 @@
-import type { ColorValue } from 'react-native';
-
-import color from 'color';
-
 import type { InternalTheme, MD3Theme } from '../../types';
 import type { IconSource } from '../Icon';
 
@@ -17,7 +13,6 @@ type ContentProps = {
 type ColorProps = {
   theme: InternalTheme;
   disabled?: boolean;
-  customRippleColor?: ColorValue;
 };
 
 const getDisabledColor = (theme: InternalTheme) => {
@@ -42,29 +37,10 @@ const getIconColor = ({ theme, disabled }: ColorProps) => {
   return colors.onSurfaceVariant;
 };
 
-const getRippleColor = ({
-  theme,
-  customRippleColor,
-}: Omit<ColorProps, 'disabled'>) => {
-  if (customRippleColor) {
-    return customRippleColor;
-  }
-
-  return color((theme as MD3Theme).colors.onSurfaceVariant)
-    .alpha(0.12)
-    .rgb()
-    .string();
-};
-
-export const getMenuItemColor = ({
-  theme,
-  disabled,
-  customRippleColor,
-}: ColorProps) => {
+export const getMenuItemColor = ({ theme, disabled }: ColorProps) => {
   return {
     titleColor: getTitleColor({ theme, disabled }),
     iconColor: getIconColor({ theme, disabled }),
-    rippleColor: getRippleColor({ theme, customRippleColor }),
   };
 };
 
diff --git a/src/components/RadioButton/RadioButtonItem.tsx b/src/components/RadioButton/RadioButtonItem.tsx
index eeff5c3d26..aa6c401c1f 100644
--- a/src/components/RadioButton/RadioButtonItem.tsx
+++ b/src/components/RadioButton/RadioButtonItem.tsx
@@ -1,6 +1,5 @@
 import * as React from 'react';
 import {
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -60,10 +59,6 @@ export type Props = {
    * Custom color for radio.
    */
   color?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Status of radio button.
    */
@@ -152,7 +147,6 @@ const RadioButtonItem = ({
   disabled,
   color,
   uncheckedColor,
-  rippleColor,
   status,
   theme: themeOverrides,
   background,
@@ -223,7 +217,6 @@ const RadioButtonItem = ({
             disabled={disabled}
             background={background}
             theme={theme}
-            rippleColor={rippleColor}
             hitSlop={hitSlop}
           >
             <View style={[styles.container, style]} pointerEvents="none">
diff --git a/src/components/Searchbar.tsx b/src/components/Searchbar.tsx
index 6377899280..1f49d7925c 100644
--- a/src/components/Searchbar.tsx
+++ b/src/components/Searchbar.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   Animated,
-  ColorValue,
   GestureResponderEvent,
   I18nManager,
   Platform,
@@ -14,8 +13,6 @@ import {
   ViewStyle,
 } from 'react-native';
 
-import color from 'color';
-
 import ActivityIndicator from './ActivityIndicator';
 import Divider from './Divider';
 import type { IconSource } from './Icon';
@@ -56,10 +53,6 @@ export type Props = React.ComponentPropsWithRef<typeof TextInput> & {
    * Custom color for icon, default will be derived from theme
    */
   iconColor?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Callback to execute if we want the left icon to act as button.
    */
@@ -94,12 +87,6 @@ export type Props = React.ComponentPropsWithRef<typeof TextInput> & {
    */
   traileringIconColor?: string;
   /**
-   * @supported Available in v5.x with theme version 3
-   * Color of the trailering icon ripple effect.
-   */
-  traileringRippleColor?: ColorValue;
-  /**
-   * @supported Available in v5.x with theme version 3
    * Callback to execute on the right trailering icon button press.
    */
   onTraileringIconPress?: (e: GestureResponderEvent) => void;
@@ -181,7 +168,6 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
     {
       icon,
       iconColor: customIconColor,
-      rippleColor: customRippleColor,
       onIconPress,
       searchAccessibilityLabel = 'search',
       clearIcon,
@@ -190,7 +176,6 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
       traileringIcon,
       traileringIconColor,
       traileringIconAccessibilityLabel,
-      traileringRippleColor: customTraileringRippleColor,
       onTraileringIconPress,
       right,
       mode = 'bar',
@@ -230,14 +215,9 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
 
     const { roundness, dark } = theme;
 
-    const placeholderTextColor = colors.onSurface;
-    const textColor = colors.onSurfaceVariant;
-    const iconColor = customIconColor || colors.onSurfaceVariant;
-    const rippleColor =
-      customRippleColor || color(textColor).alpha(0.32).rgb().string();
-    const traileringRippleColor =
-      customTraileringRippleColor ||
-      color(textColor).alpha(0.32).rgb().string();
+    const placeholderTextColor = theme.colors.onSurface;
+    const textColor = theme.colors.onSurfaceVariant;
+    const iconColor = customIconColor || theme.colors.onSurfaceVariant;
 
     const font = {
       ...fonts.bodyLarge,
@@ -273,7 +253,6 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
         <IconButton
           accessibilityRole="button"
           borderless
-          rippleColor={rippleColor}
           onPress={onIconPress}
           iconColor={iconColor}
           icon={
@@ -336,7 +315,6 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
               borderless
               accessibilityLabel={clearAccessibilityLabel}
               iconColor={value ? iconColor : 'rgba(255, 255, 255, 0)'}
-              rippleColor={rippleColor}
               onPress={handleClearPress}
               icon={
                 clearIcon ||
@@ -360,8 +338,7 @@ const Searchbar = forwardRef<TextInputHandles, Props>(
             accessibilityRole="button"
             borderless
             onPress={onTraileringIconPress}
-            iconColor={traileringIconColor || colors.onSurfaceVariant}
-            rippleColor={traileringRippleColor}
+            iconColor={traileringIconColor || theme.colors.onSurfaceVariant}
             icon={traileringIcon}
             accessibilityLabel={traileringIconAccessibilityLabel}
             testID={`${testID}-trailering-icon`}
diff --git a/src/components/SegmentedButtons/SegmentedButtonItem.tsx b/src/components/SegmentedButtons/SegmentedButtonItem.tsx
index 64471f59fd..6f04b6aeb7 100644
--- a/src/components/SegmentedButtons/SegmentedButtonItem.tsx
+++ b/src/components/SegmentedButtons/SegmentedButtonItem.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   Animated,
-  ColorValue,
   GestureResponderEvent,
   PressableAndroidRippleConfig,
   StyleProp,
@@ -11,7 +10,6 @@ import {
   ViewStyle,
 } from 'react-native';
 
-import color from 'color';
 import type { ThemeProp } from 'src/types';
 
 import {
@@ -46,10 +44,6 @@ export type Props = {
    * Custom color for checked Text and Icon.
    */
   checkedColor?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether the button is disabled.
    */
@@ -119,7 +113,6 @@ const SegmentedButtonItem = ({
   showSelectedCheck,
   checkedColor,
   uncheckedColor,
-  rippleColor: customRippleColor,
   background,
   icon,
   testID,
@@ -167,9 +160,6 @@ const SegmentedButtonItem = ({
     theme,
     segment,
   });
-  const rippleColor =
-    customRippleColor || color(textColor).alpha(0.12).rgb().string();
-
   const showIcon = !icon ? false : label && checked ? !showSelectedCheck : true;
   const showCheckedIcon = checked && showSelectedCheck;
 
@@ -214,7 +204,6 @@ const SegmentedButtonItem = ({
         accessibilityState={{ disabled, checked }}
         accessibilityRole="button"
         disabled={disabled}
-        rippleColor={rippleColor}
         testID={testID}
         style={rippleStyle}
         background={background}
diff --git a/src/components/Snackbar.tsx b/src/components/Snackbar.tsx
index 22b55bb02a..6151e23ae2 100644
--- a/src/components/Snackbar.tsx
+++ b/src/components/Snackbar.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 import {
   Animated,
-  ColorValue,
   Easing,
   I18nManager,
   StyleProp,
@@ -41,12 +40,6 @@ export type Props = $Omit<React.ComponentProps<typeof Surface>, 'mode'> & {
    */
   icon?: IconSource;
   /**
-   * @supported Available in v5.x with theme version 3
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
-  /**
-   * @supported Available in v5.x with theme version 3
    * Function to execute on icon button press. The icon button appears only when this prop is specified.
    */
   onIconPress?: () => void;
@@ -161,7 +154,6 @@ const Snackbar = ({
   contentStyle,
   theme: themeOverrides,
   maxFontSizeMultiplier,
-  rippleColor,
   testID,
   ...rest
 }: Props) => {
@@ -253,7 +245,6 @@ const Snackbar = ({
     style: actionStyle,
     label: actionLabel,
     onPress: onPressAction,
-    rippleColor: actionRippleColor,
     ...actionProps
   } = action || {};
 
@@ -338,7 +329,6 @@ const Snackbar = ({
                 compact={false}
                 mode="text"
                 theme={theme}
-                rippleColor={actionRippleColor}
                 {...actionProps}
               >
                 {actionLabel}
@@ -349,8 +339,7 @@ const Snackbar = ({
                 accessibilityRole="button"
                 borderless
                 onPress={onIconPress}
-                iconColor={colors.inverseOnSurface}
-                rippleColor={rippleColor}
+                iconColor={theme.colors.inverseOnSurface}
                 theme={theme}
                 icon={
                   icon ||
diff --git a/src/components/TextInput/Adornment/TextInputIcon.tsx b/src/components/TextInput/Adornment/TextInputIcon.tsx
index 8f4ce7c4df..0005071fe3 100644
--- a/src/components/TextInput/Adornment/TextInputIcon.tsx
+++ b/src/components/TextInput/Adornment/TextInputIcon.tsx
@@ -1,6 +1,5 @@
 import React from 'react';
 import {
-  ColorValue,
   GestureResponderEvent,
   StyleProp,
   StyleSheet,
@@ -37,10 +36,6 @@ export type Props = $Omit<
    * Color of the icon or a function receiving a boolean indicating whether the TextInput is focused and returning the color.
    */
   color?: ((isTextInputFocused: boolean) => string | undefined) | string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   style?: StyleProp<ViewStyle>;
   /**
    * @optional
@@ -129,7 +124,6 @@ const TextInputIcon = ({
   forceTextInputFocus = true,
   color: customColor,
   theme: themeOverrides,
-  rippleColor,
   ...rest
 }: Props) => {
   const { style, isTextInputFocused, forceFocus, testID, disabled } =
@@ -165,7 +159,6 @@ const TextInputIcon = ({
         iconColor={iconColor}
         testID={testID}
         theme={themeOverrides}
-        rippleColor={rippleColor}
         {...rest}
       />
     </View>
diff --git a/src/components/ToggleButton/ToggleButton.tsx b/src/components/ToggleButton/ToggleButton.tsx
index e115dec7ec..ba4bd138a3 100644
--- a/src/components/ToggleButton/ToggleButton.tsx
+++ b/src/components/ToggleButton/ToggleButton.tsx
@@ -6,7 +6,6 @@ import {
   ViewStyle,
   View,
   Animated,
-  ColorValue,
 } from 'react-native';
 
 import { ToggleButtonGroupContext } from './ToggleButtonGroup';
@@ -30,10 +29,6 @@ export type Props = {
    * Custom text color for button.
    */
   iconColor?: string;
-  /**
-   * Color of the ripple effect.
-   */
-  rippleColor?: ColorValue;
   /**
    * Whether the button is disabled.
    */
@@ -108,7 +103,6 @@ const ToggleButton = forwardRef<View, Props>(
       value,
       status,
       onPress,
-      rippleColor,
       ...rest
     }: Props,
     ref
@@ -155,7 +149,6 @@ const ToggleButton = forwardRef<View, Props>(
               ]}
               ref={ref}
               theme={theme}
-              rippleColor={rippleColor}
               {...rest}
             />
           );
diff --git a/src/components/TouchableRipple/utils.ts b/src/components/TouchableRipple/utils.ts
index e3a1e9726f..83308eb228 100644
--- a/src/components/TouchableRipple/utils.ts
+++ b/src/components/TouchableRipple/utils.ts
@@ -29,7 +29,7 @@ const getRippleColor = ({
     return rippleColor;
   }
 
-  return color(theme.colors.onSurface).alpha(0.12).rgb().string();
+  return color(theme.colors.onSurface).alpha(0.1).rgb().string();
 };
 
 export const getTouchableRippleColors = ({
diff --git a/src/components/__tests__/Chip.test.tsx b/src/components/__tests__/Chip.test.tsx
index 6c0e851f22..5505a3726e 100644
--- a/src/components/__tests__/Chip.test.tsx
+++ b/src/components/__tests__/Chip.test.tsx
@@ -186,48 +186,6 @@ describe('getChipColors - icon color', () => {
   });
 });
 
-describe('getChipColors - ripple color', () => {
-  it('should return theme color, for theme version 3, flat mode', () => {
-    expect(
-      getChipColors({
-        theme: getTheme(),
-        isOutlined: false,
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.onSecondaryContainer)
-        .alpha(0.12)
-        .rgb()
-        .string(),
-    });
-  });
-
-  it('should return theme color, for theme version 3, outline mode', () => {
-    expect(
-      getChipColors({
-        theme: getTheme(),
-        isOutlined: true,
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.onSurfaceVariant)
-        .alpha(0.12)
-        .rgb()
-        .string(),
-    });
-  });
-
-  it('should return custom color, for theme version 3', () => {
-    expect(
-      getChipColors({
-        theme: getTheme(),
-        selectedColor: 'purple',
-        isOutlined: false,
-      })
-    ).toMatchObject({
-      rippleColor: color('purple').alpha(0.12).rgb().string(),
-    });
-  });
-});
-
 describe('getChipColor - selected background color', () => {
   it('should return custom color, for theme version 3, outlined mode', () => {
     expect(
diff --git a/src/components/__tests__/FABGroup.test.tsx b/src/components/__tests__/FABGroup.test.tsx
index 3eb51c78d6..7009526e42 100644
--- a/src/components/__tests__/FABGroup.test.tsx
+++ b/src/components/__tests__/FABGroup.test.tsx
@@ -137,37 +137,6 @@ it('correctly adds label prop', () => {
   expect(getByText('Label test')).toBeTruthy();
 });
 
-it('correct renders custom ripple color passed to FAB.Group and its item', () => {
-  const { getByTestId } = render(
-    <FAB.Group
-      visible
-      open
-      label="Label test"
-      testID="fab-group"
-      rippleColor={'orange'}
-      icon="plus"
-      onStateChange={() => {}}
-      actions={[
-        {
-          label: 'testing',
-          onPress() {},
-          icon: '',
-          rippleColor: 'yellow',
-          testID: 'fab-group-item',
-        },
-      ]}
-    />
-  );
-
-  expect(
-    getByTestId('fab-group-container').props.children.props.rippleColor
-  ).toBe('orange');
-
-  expect(
-    getByTestId('fab-group-item-container').props.children.props.rippleColor
-  ).toBe('yellow');
-});
-
 it('animated value changes correctly', () => {
   const value = new Animated.Value(1);
   const { getByTestId } = render(
diff --git a/src/components/__tests__/IconButton.test.tsx b/src/components/__tests__/IconButton.test.tsx
index 11f47cb49c..39d1eb8663 100644
--- a/src/components/__tests__/IconButton.test.tsx
+++ b/src/components/__tests__/IconButton.test.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { Animated, StyleSheet } from 'react-native';
 
 import { act, render } from '@testing-library/react-native';
-import color from 'color';
 
 import { getTheme } from '../../core/theming';
 import { pink500 } from '../../styles/themes/v2/colors';
@@ -308,21 +307,6 @@ describe('getIconButtonColor - border color', () => {
   });
 });
 
-describe('getIconButtonColor - ripple color', () => {
-  it('should return theme color, for theme version 3', () => {
-    expect(
-      getIconButtonColor({
-        theme: getTheme(),
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.onSurfaceVariant)
-        .alpha(0.12)
-        .rgb()
-        .string(),
-    });
-  });
-});
-
 it('action animated value changes correctly', () => {
   const value = new Animated.Value(1);
   const { getByTestId } = render(
diff --git a/src/components/__tests__/ListAccordion.test.tsx b/src/components/__tests__/ListAccordion.test.tsx
index 9695b3c186..65a6a9d4de 100644
--- a/src/components/__tests__/ListAccordion.test.tsx
+++ b/src/components/__tests__/ListAccordion.test.tsx
@@ -2,7 +2,6 @@ import * as React from 'react';
 import { StyleSheet, View } from 'react-native';
 
 import { render } from '@testing-library/react-native';
-import color from 'color';
 
 import { getTheme } from '../../core/theming';
 import { red500 } from '../../styles/themes/v2/colors';
@@ -149,29 +148,3 @@ describe('getAccordionColors - title text color', () => {
     });
   });
 });
-
-describe('getAccordionColors - ripple color', () => {
-  it('should return theme color, for theme version 3', () => {
-    expect(
-      getAccordionColors({
-        theme: getTheme(),
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.onSurface)
-        .alpha(0.12)
-        .rgb()
-        .string(),
-    });
-  });
-
-  it('should return primary color if it is expanded', () => {
-    expect(
-      getAccordionColors({
-        theme: getTheme(),
-        isExpanded: true,
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.primary).alpha(0.12).rgb().string(),
-    });
-  });
-});
diff --git a/src/components/__tests__/MenuItem.test.tsx b/src/components/__tests__/MenuItem.test.tsx
index d482800582..10fb008b5e 100644
--- a/src/components/__tests__/MenuItem.test.tsx
+++ b/src/components/__tests__/MenuItem.test.tsx
@@ -1,7 +1,6 @@
 import * as React from 'react';
 
 import { render } from '@testing-library/react-native';
-import color from 'color';
 
 import { getTheme } from '../../core/theming';
 import Menu from '../Menu/Menu';
@@ -105,18 +104,3 @@ describe('getMenuItemColor - icon color', () => {
     });
   });
 });
-
-describe('getMenuItemColor - ripple color', () => {
-  it('should return correct theme color, for theme version 3', () => {
-    expect(
-      getMenuItemColor({
-        theme: getTheme(),
-      })
-    ).toMatchObject({
-      rippleColor: color(getTheme().colors.onSurfaceVariant)
-        .alpha(0.12)
-        .rgb()
-        .string(),
-    });
-  });
-});
diff --git a/src/components/__tests__/Searchbar.test.tsx b/src/components/__tests__/Searchbar.test.tsx
index 59ade128e4..eb44e85481 100644
--- a/src/components/__tests__/Searchbar.test.tsx
+++ b/src/components/__tests__/Searchbar.test.tsx
@@ -38,15 +38,6 @@ it('renders without ActivityIndicator', () => {
   expect(() => getByTestId('activity-indicator')).toThrow();
 });
 
-it('render icon with custom ripple color', () => {
-  const { getByTestId } = render(
-    <Searchbar testID="search-bar" value={''} rippleColor="purple" />
-  );
-
-  const iconContainer = getByTestId('search-bar-icon-container').props.children;
-  expect(iconContainer.props.rippleColor).toBe('purple');
-});
-
 it('renders clear icon with custom color', () => {
   const { getByTestId } = render(
     <Searchbar testID="search-bar" value="value" iconColor="purple" />
@@ -141,16 +132,6 @@ it('renders clear icon wrapper, with appropriate style for v3', () => {
   });
 });
 
-it('render clear icon with custom ripple color', () => {
-  const { getByTestId } = render(
-    <Searchbar testID="search-bar" value={''} rippleColor="purple" />
-  );
-
-  const clearIconContainer = getByTestId('search-bar-clear-icon-container')
-    .props.children;
-  expect(clearIconContainer.props.rippleColor).toBe('purple');
-});
-
 it('renders trailering icon when mode is set to "bar"', () => {
   const { getByTestId } = render(
     <Searchbar
@@ -181,23 +162,6 @@ it('renders trailering icon with press functionality', () => {
   expect(onTraileringIconPressMock).toHaveBeenCalledTimes(1);
 });
 
-it('renders trailering icon with custom ripple colors', () => {
-  const { getByTestId } = render(
-    <Searchbar
-      testID="search-bar"
-      value={''}
-      traileringRippleColor={'purple'}
-      traileringIcon={'microphone'}
-      mode="bar"
-    />
-  );
-
-  const traileringIconContainer = getByTestId(
-    'search-bar-trailering-icon-container'
-  ).props.children;
-  expect(traileringIconContainer.props.rippleColor).toBe('purple');
-});
-
 it('renders clear icon instead of trailering icon', () => {
   const { getByTestId, update, queryByTestId } = render(
     <Searchbar
diff --git a/src/components/__tests__/Snackbar.test.tsx b/src/components/__tests__/Snackbar.test.tsx
index f520faa466..e8f71f3319 100644
--- a/src/components/__tests__/Snackbar.test.tsx
+++ b/src/components/__tests__/Snackbar.test.tsx
@@ -82,23 +82,6 @@ it('renders snackbar with View & Text as a child', () => {
   expect(tree).toMatchSnapshot();
 });
 
-it('renders with custom ripple color', () => {
-  const { getByTestId } = render(
-    <Snackbar
-      visible
-      onDismiss={() => {}}
-      onIconPress={() => {}}
-      rippleColor="purple"
-      testID="snackbar"
-    >
-      Snackbar content
-    </Snackbar>
-  );
-
-  const iconContainer = getByTestId('snackbar-icon-container').props.children;
-  expect(iconContainer.props.rippleColor).toBe('purple');
-});
-
 it('animated value changes correctly', () => {
   const value = new Animated.Value(1);
   const { getByTestId } = render(
diff --git a/src/components/__tests__/ToggleButton.test.tsx b/src/components/__tests__/ToggleButton.test.tsx
index a0e2bbafcb..61936f4909 100644
--- a/src/components/__tests__/ToggleButton.test.tsx
+++ b/src/components/__tests__/ToggleButton.test.tsx
@@ -33,22 +33,6 @@ it('renders unchecked toggle button', () => {
   expect(tree).toMatchSnapshot();
 });
 
-it('render toggle button with custom ripple color', () => {
-  const { getByTestId } = render(
-    <ToggleButton
-      disabled
-      value="toggle"
-      status="checked"
-      icon="heart"
-      testID="toggle-button"
-      rippleColor="purple"
-    />
-  );
-
-  const iconContainer = getByTestId('toggle-button-container').props.children;
-  expect(iconContainer.props.rippleColor).toBe('purple');
-});
-
 describe('getToggleButtonColor', () => {
   it('should return correct color when checked and theme version 3', () => {
     expect(getToggleButtonColor({ theme: getTheme(), checked: true })).toBe(