diff --git a/src/components/BottomNavigation/BottomNavigationBar.tsx b/src/components/BottomNavigation/BottomNavigationBar.tsx
index 0bfe303bfb..742ecc8d37 100644
--- a/src/components/BottomNavigation/BottomNavigationBar.tsx
+++ b/src/components/BottomNavigation/BottomNavigationBar.tsx
@@ -157,6 +157,10 @@ export type Props<Route extends BaseRoute> = {
    * Get label text for the tab, uses `route.title` by default. Use `renderLabel` to replace label component.
    */
   getLabelText?: (props: { route: Route }) => string | undefined;
+  /**
+   * Get the height of the Bottom Tab. Useful for Custom Tab bars.
+   */
+  getBottomTabHeight?: (height: number) => void;
   /**
    * Get the id to locate this tab button in tests, uses `route.testID` by default.
    */
@@ -366,6 +370,7 @@ const BottomNavigationBar = <Route extends BaseRoute>({
   getColor = ({ route }: { route: Route }) => route.color,
   getAccessibilityLabel = ({ route }: { route: Route }) =>
     route.accessibilityLabel,
+  getBottomTabHeight,
   getTestID = ({ route }: { route: Route }) => route.testID,
   activeColor,
   inactiveColor,
@@ -428,6 +433,13 @@ const BottomNavigationBar = <Route extends BaseRoute>({
    */
   const [layout, onLayout] = useLayout();
 
+  /**
+   * Gets the height of the Bottom Tabs when using Custom Tab bar.
+   */
+  React.useEffect(() => {
+    layout.measured && getBottomTabHeight?.(layout.height);
+  }, [layout.measured, getBottomTabHeight]);
+
   /**
    * Track whether the keyboard is visible to show and hide the navigation bar.
    */