diff --git a/packages/gamut/src/DataList/Controls/FilterControl.tsx b/packages/gamut/src/DataList/Controls/FilterControl.tsx
index a30fbc5f5b..00de48c6e8 100644
--- a/packages/gamut/src/DataList/Controls/FilterControl.tsx
+++ b/packages/gamut/src/DataList/Controls/FilterControl.tsx
@@ -74,7 +74,7 @@ export const FilterControl: React.FC<FilterProps> = ({
             maxHeight={300}
             overflowY="auto"
             width="max-content"
-            variant="action"
+            variant="popover"
           >
             {[SELECT_ALL, ...options].map((opt) => {
               const { text, value } = formatOption(opt);
diff --git a/packages/gamut/src/Menu/Menu.tsx b/packages/gamut/src/Menu/Menu.tsx
index 6a5af90f9e..279b4d1920 100644
--- a/packages/gamut/src/Menu/Menu.tsx
+++ b/packages/gamut/src/Menu/Menu.tsx
@@ -8,7 +8,7 @@ export const Menu = forwardRef<
   Omit<ComponentProps<typeof List>, 'root'>
 >(
   (
-    { children, variant = 'select', spacing = 'normal', role, ...rest },
+    { children, variant = 'popover', spacing = 'normal', role, ...rest },
     ref
   ) => {
     const currentContext = useMenu({ variant, role, spacing });
diff --git a/packages/gamut/src/Menu/MenuContext.tsx b/packages/gamut/src/Menu/MenuContext.tsx
index 8f91c4698f..c96c0c9ddf 100644
--- a/packages/gamut/src/Menu/MenuContext.tsx
+++ b/packages/gamut/src/Menu/MenuContext.tsx
@@ -4,14 +4,14 @@ import { ListProps } from '../List';
 
 export interface MenuContextProps {
   spacing: 'normal' | 'condensed';
-  variant: 'select' | 'navigation' | 'action';
+  variant: 'popover' | 'fixed';
   depth: number;
   role: ListProps['role'];
 }
 
 export const MenuContext = createContext<MenuContextProps>({
   spacing: 'normal',
-  variant: 'select',
+  variant: 'popover',
   depth: 0,
   role: undefined,
 });
diff --git a/packages/gamut/src/Menu/MenuItem.tsx b/packages/gamut/src/Menu/MenuItem.tsx
index bae08593b7..ff00143f9b 100644
--- a/packages/gamut/src/Menu/MenuItem.tsx
+++ b/packages/gamut/src/Menu/MenuItem.tsx
@@ -15,9 +15,8 @@ const getListItemType = (href: boolean, onClick: boolean) =>
   href ? 'link' : onClick ? 'button' : 'item';
 
 const activePropnames = {
-  navigation: 'active-navlink',
-  action: 'active',
-  select: 'selected',
+  fixed: 'active-navlink',
+  popover: 'active',
 };
 
 const currentItemText = {
@@ -41,7 +40,7 @@ export const MenuItem = forwardRef<
   const computed = {
     ...props,
     ...rest,
-    variant: variant === 'select' ? 'select' : 'link',
+    variant: 'link',
     role: role === 'menu' ? 'menuitem' : undefined,
     [activeProp]: active,
   } as ListItemProps;
diff --git a/packages/gamut/src/Menu/MenuSeparator.tsx b/packages/gamut/src/Menu/MenuSeparator.tsx
index 4f257fa85c..e70d6bec52 100644
--- a/packages/gamut/src/Menu/MenuSeparator.tsx
+++ b/packages/gamut/src/Menu/MenuSeparator.tsx
@@ -2,16 +2,12 @@ import * as React from 'react';
 
 import { Box, FlexBox } from '../Box';
 import { FlexBoxProps } from '../Box/props';
-import { useMenuContext } from './MenuContext';
 
 interface MenuSeperatorProps extends FlexBoxProps {
   children?: never;
 }
 
 export const MenuSeparator: React.FC<MenuSeperatorProps> = (props) => {
-  const { variant } = useMenuContext();
-  if (variant !== 'action') return null;
-
   return (
     <FlexBox as="li" role="separator" height={8} fit center {...props}>
       <Box fit height="1px" bg="text-disabled" borderRadius="sm" mx={16} />
diff --git a/packages/gamut/src/Menu/__tests__/Menu.test.tsx b/packages/gamut/src/Menu/__tests__/Menu.test.tsx
index 9a1c8ea706..13e7937105 100644
--- a/packages/gamut/src/Menu/__tests__/Menu.test.tsx
+++ b/packages/gamut/src/Menu/__tests__/Menu.test.tsx
@@ -39,17 +39,17 @@ describe('Menu', () => {
     screen.getByRole('button');
     expect(screen.queryByRole('menuitem')).toBeNull();
   });
-  it('renders menu separators when the variant is action', () => {
+  it('renders menu separators when variant is popover', () => {
     renderView({
-      variant: 'action',
+      variant: 'popover',
       children: <MenuSeparator />,
     });
 
     screen.getByRole('separator');
   });
-  it('renders deep menu separators while the parent variant is action', () => {
+  it('renders deep menu separators', () => {
     renderView({
-      variant: 'action',
+      variant: 'popover',
       children: (
         <Menu>
           <MenuSeparator />
@@ -59,20 +59,13 @@ describe('Menu', () => {
 
     screen.getByRole('separator');
   });
-  it('does not render separators when the variant is select + navigation', () => {
+  it('renders menu separators when variant is fixed', () => {
     renderView({
-      variant: 'select',
+      variant: 'fixed',
       children: <MenuSeparator />,
     });
 
-    expect(screen.queryByRole('separator')).toBeNull();
-
-    renderView({
-      variant: 'navigation',
-      children: <MenuSeparator />,
-    });
-
-    expect(screen.queryByRole('separator')).toBeNull();
+    screen.getByRole('separator');
   });
   it('renders and icon only when specified', () => {
     renderView({
diff --git a/packages/gamut/src/Menu/elements.tsx b/packages/gamut/src/Menu/elements.tsx
index 47006f5c49..655219b364 100644
--- a/packages/gamut/src/Menu/elements.tsx
+++ b/packages/gamut/src/Menu/elements.tsx
@@ -32,11 +32,12 @@ export interface ListProps extends ListStyleProps, StyleStateProps {
   /** How offset spacing should be */
   spacing?: 'normal' | 'condensed';
   /** Menu variants for specific use cases and styles */
-  variant?: 'select' | 'navigation' | 'action';
+  variant?: 'popover' | 'fixed';
   /** is root menu */
   root?: boolean;
   /** bordered */
   as?: 'ul' | 'ol';
+  showBorder?: boolean;
 }
 
 const StyledList = styled('ul', styledOptions<'ul'>())<ListProps>(
@@ -54,6 +55,8 @@ const StyledList = styled('ul', styledOptions<'ul'>())<ListProps>(
       minWidth: 192,
       bg: 'background',
       p: 0,
+    },
+    showBorder: {
       border: 1,
       borderRadius: 'sm',
     },
@@ -65,8 +68,16 @@ const StyledList = styled('ul', styledOptions<'ul'>())<ListProps>(
 export const List = forwardRef<
   HTMLUListElement,
   ComponentProps<typeof StyledList>
->(({ context = true, m = 0, root = true, ...rest }, ref) => (
-  <StyledList context={context} m={m} root={root} ref={ref} {...rest} />
+>(({ context = true, m = 0, root = true, variant, ...rest }, ref) => (
+  <StyledList
+    context={context}
+    m={m}
+    root={root}
+    showBorder={variant !== 'fixed'}
+    ref={ref}
+    variant={variant}
+    {...rest}
+  />
 ));
 
 const interactiveVariants = system.variant({
diff --git a/packages/styleguide/src/lib/Molecules/Menu/Menu.mdx b/packages/styleguide/src/lib/Molecules/Menu/Menu.mdx
index da0adbf9b6..5bbcdbf378 100644
--- a/packages/styleguide/src/lib/Molecules/Menu/Menu.mdx
+++ b/packages/styleguide/src/lib/Molecules/Menu/Menu.mdx
@@ -1,7 +1,6 @@
-import { Column, LayoutGrid } from '@codecademy/gamut';
 import { Canvas, Controls, Meta } from '@storybook/blocks';
 
-import { ComponentHeader } from '~styleguide/blocks';
+import { ComponentHeader, ImageWrapper, LinkTo } from '~styleguide/blocks';
 
 import * as MenuStories from './Menu.stories';
 
@@ -24,7 +23,8 @@ export const parameters = {
 <ComponentHeader {...parameters} />
 
 ## Usage
-While most Menus are used as layout elements, Menus can also be used as popover elements within components like Selects.
+
+Use a Menu to organize and present a list of actions, options, or navigation links.
 
 ### Components
 
@@ -34,71 +34,81 @@ While most Menus are used as layout elements, Menus can also be used as popover
 
 ### Best practices:
 
-- A `Menu` should only have the `menu` role when it is a list of actions or functions a user can evoke.
-  - For example - a popover menu that allows the user to copy text, paste text, or reset a workspace.
-- If your `Menu` is simply a list of links it should not have the `menu` role.
-- Adding the role of `menu` to the menu component will programmatically set the correct roles on its `MenuItem`s and `MenuSeparator`s.
+- The Popover menu has the `menu` role by default, which is intended for presenting actions or options. However, if it contains only navigation links, it should use the `<nav>` element for semantic and accessible navigation.
+- You can create floating menus by utilizing our <LinkTo id="Atoms/PopoverContainer">PopoverContainer</LinkTo>. Once you have your base positioning, you just need to adjust the y axis by 48 for the normal spacing or 32 for the condensed spacing for each of the MenuItems. You may also need to change the alignment of the PopoverContainer to ensure correct positioning.
+
+### When NOT to use:
+
+- Form Inputs - For selecting from a predefined set of choices within a form, use the SelectDropdown component.
+- Expandable Menus - For organizing multiple collapsible sections of navigation links in a structured layout, use the LayoutMenu component.
+- Switching between content - For toggling between multiple related views or content sections within the same context, use the Tabs component.
+
+## Anatomy
+
+<ImageWrapper src="./molecules/menuAnatomy.png" alt="Menu Anatomy diagram"/>
+
+1. Leading Icon (optional)
+
+- Use to visually reinforce the purpose of a menu item, improve scannability, or differentiate between actions.
+
+2. Label
+
+- Limit to 1-3 words.
+- For actions, use a verb that clearly explains what will happen.
+- When the menu item is linking to information, use a noun.
+- Keep the same word form for each grouping. (For example, all nouns or all verbs.)
+- Order and group by meaning or alphabetically.
+- Avoid placing words that look the same (for example, that start with the exact same letters) adjacent to one another.
 
-If you would like to know more about the `menu` role - check out the MDN web docs [here](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/menu_role).
+3. Menu separator (optional)
+
+- Use to group menu items into sections when there is a significant number of items, making lengthy menus easier to scan and navigate.
 
 ## Variants
 
-<LayoutGrid gap={32} py={24}>
+### Popover
+
+Use the Popover menu to present a temporary surface for actions, options, or links, ensuring access only when needed while keeping the interface clean and focused. The Popover menu has the `menu` role by default.  But, if the menu contains only a list of navigation links, it should be nested in a `<nav>` element, which implicitly includes the `navigation` role.
 
-<Column size={4} variant={false} mx={8}>
-### Select
-<Canvas of={MenuStories.Default} />
-A general purpose menu type that can be used for actions or navigation.
-</Column>
+<Canvas of={MenuStories.Popover} />
 
-<Column size={4} variant={false}>
-### Action
-<Canvas of={MenuStories.Action} />
-These should be populated with MenuItems typed as buttons that execute some action.
-</Column>
+### Fixed
 
-<Column size={4} variant={false}>
-### Navigation
-<Canvas of={MenuStories.Navigation} />
-These should be populated with MenuItems typed as links.
-</Column>
+Use the Fixed menu to provide persistent access to navigation links, allowing users to seamlessly move between sections of the interface without opening additional surfaces. Fixed menus should always use the `<nav>` element to ensure semantic and accessible navigation.
 
-</LayoutGrid>
+<Canvas of={MenuStories.Fixed} />
 
 ## Spacing variants
+
 Setting the Menu's `spacing` to `'condensed'` will reduce the padding around the MenuItems.
 
-<LayoutGrid gap={32} py={24}>
+### Popover condensed
 
-<Column size={4} variant={false} mx={8}>
-### Select condensed
-<Canvas of={MenuStories.SelectCondensed} />
-</Column>
+<Canvas of={MenuStories.PopoverCondensed} />
 
-<Column size={4} variant={false}>
-### Action condensed
-<Canvas of={MenuStories.ActionCondensed} />
-</Column>
+### Fixed condensed
 
-<Column size={4} variant={false}>
-### Navigation condensed
-<Canvas of={MenuStories.NavigationCondensed} />
-</Column>
+<Canvas of={MenuStories.FixedCondensed} />
 
-</LayoutGrid>
+## Menu separator
 
-## Popover menus
+Use the `MenuSeparator` component to group menu items into sections when there is a significant number of items, making lengthy menus easier to scan and navigate.
 
-You can create popover menus by utilizing our **PopoverContainer**. Once you have your base positioning, you just need to adjust the `y` axis by `48` for the `normal` spacing or `32` for the `condensed` spacing for each of the `MenuItem`s. You may also need to change the `alignment` of the `PopoverContainer` to ensure correct positioning.
+<Canvas of={MenuStories.PopoverMenuSeparator} />
+<Canvas of={MenuStories.FixedMenuSeparator} />
 
-Popover Menus that have complex functionalities or actions, like the example below, should have the `menu` role.
+## Floating menus
 
-Click through each item to see how the `Menu`s appear (and disappear when the item is clicked again, or another item is selected.)
+You can create floating menus by utilizing our <LinkTo id="Atoms/PopoverContainer">PopoverContainer</LinkTo>. Once you have your base positioning, you just need to adjust the y axis by 48 for the normal spacing or 32 for the condensed spacing for each of the MenuItems. You may also need to change the alignment of the PopoverContainer to ensure correct positioning.
 
-<Canvas of={MenuStories.Popover} />
+Floating menus that have complex functionalities or actions, like the example below, should have the menu role.
+
+Click through each item to see how the `Menu`s appear (and disappear when the item is clicked again, or another item is selected.)
 
+<Canvas of={MenuStories.FloatingMenuExample} />
 
 ## Playground
+
 <Canvas sourceState="shown" of={MenuStories.Default} />
 
 <Controls />
diff --git a/packages/styleguide/src/lib/Molecules/Menu/Menu.stories.tsx b/packages/styleguide/src/lib/Molecules/Menu/Menu.stories.tsx
index 9934e2d9a1..fe2ef046e8 100644
--- a/packages/styleguide/src/lib/Molecules/Menu/Menu.stories.tsx
+++ b/packages/styleguide/src/lib/Molecules/Menu/Menu.stories.tsx
@@ -14,87 +14,128 @@ const meta: Meta<typeof Menu> = {
   component: Menu,
   // This is a known issue with SB 8, see: https://github.com/storybookjs/storybook/issues/23170
   // Will fix this casting when the issue is resolved
-  subcomponents: { MenuItem: MenuItem as React.ComponentType<unknown>, MenuSeparator: MenuSeparator as React.ComponentType<unknown> },
+  subcomponents: {
+    MenuItem: MenuItem as React.ComponentType<unknown>,
+    MenuSeparator: MenuSeparator as React.ComponentType<unknown>,
+  },
   args: {
-    spacing: 'normal'
+    spacing: 'normal',
   },
 };
 
 export default meta;
 type Story = StoryObj<typeof Menu>;
 
-const MenuItemsExample: React.FC<{
-  type?: 'button' | 'link' | 'default';
-}> = ({ type }) => {
-  const menuItemProps =
-    type === 'button'
-      ? { onClick: () => null }
-      : type === 'link'
-      ? { href: '#' }
-      : {};
-  return (
-    <>
-      <MenuItem {...menuItemProps}>Menu Item</MenuItem>
-      <MenuItem active {...menuItemProps}>
-        Active Item
-      </MenuItem>
-      <MenuSeparator />
-      <MenuItem icon={MultipleUsersIcon} {...menuItemProps}>
-        Icon Item
-      </MenuItem>
-      <MenuItem {...menuItemProps}>Menu Item</MenuItem>
-    </>
-  );
-};
-
-
 export const Default: Story = {
   args: {
-    variant: 'select',
-    children: <MenuItemsExample type="default" />,
+    children: (
+      <>
+        <MenuItem>Menu Item</MenuItem>
+        <MenuItem active>Active Item</MenuItem>
+        <MenuItem icon={MultipleUsersIcon}>Icon Item</MenuItem>
+        <MenuItem>Menu Item</MenuItem>
+      </>
+    ),
   },
 };
 
-export const Action: Story = {
+export const Popover: Story = {
   args: {
-    variant: 'action',
-    children: <MenuItemsExample type="button" />,
+    variant: 'popover',
+    children: (
+      <>
+        <MenuItem onClick={() => null}>Menu Item</MenuItem>
+        <MenuItem active onClick={() => null}>
+          Active Item
+        </MenuItem>
+        <MenuItem icon={MultipleUsersIcon} onClick={() => null}>
+          Icon Item
+        </MenuItem>
+        <MenuItem onClick={() => null}>Menu Item</MenuItem>
+      </>
+    ),
   },
 };
 
-export const Navigation: Story = {
+export const Fixed: Story = {
   args: {
-    variant: 'navigation',
-    children: <MenuItemsExample type="link" />,
+    variant: 'fixed',
+    children: (
+      <>
+        <MenuItem href="#">Menu Item</MenuItem>
+        <MenuItem active href="#">
+          Active Item
+        </MenuItem>
+        <MenuItem icon={MultipleUsersIcon} href="#">
+          Icon Item
+        </MenuItem>
+        <MenuItem href="#">Menu Item</MenuItem>
+      </>
+    ),
   },
 };
 
-export const SelectCondensed: Story = {
+export const PopoverCondensed: Story = {
   args: {
-    variant: 'select',
-    children: <MenuItemsExample type="default" />,
-    spacing: 'condensed'
+    variant: 'popover',
+    children: (
+      <>
+        <MenuItem>Menu Item</MenuItem>
+        <MenuItem active>Active Item</MenuItem>
+        <MenuItem icon={MultipleUsersIcon}>Icon Item</MenuItem>
+        <MenuItem>Menu Item</MenuItem>
+      </>
+    ),
+    spacing: 'condensed',
   },
 };
 
-export const ActionCondensed: Story = {
+export const FixedCondensed: Story = {
   args: {
-    variant: 'action',
-    children: <MenuItemsExample type="button" />,
-    spacing: 'condensed'
+    variant: 'fixed',
+    children: (
+      <>
+        <MenuItem>Menu Item</MenuItem>
+        <MenuItem active>Active Item</MenuItem>
+        <MenuItem icon={MultipleUsersIcon}>Icon Item</MenuItem>
+        <MenuItem>Menu Item</MenuItem>
+      </>
+    ),
+    spacing: 'condensed',
   },
 };
 
-export const NavigationCondensed: Story = {
+export const PopoverMenuSeparator: Story = {
   args: {
-    variant: 'navigation',
-    children: <MenuItemsExample type="link" />,
-    spacing: 'condensed'
+    variant: 'popover',
+    children: (
+      <>
+        <MenuItem>Menu Item</MenuItem>
+        <MenuItem active>Active Item</MenuItem>
+        <MenuSeparator />
+        <MenuItem icon={MultipleUsersIcon}>Icon Item</MenuItem>
+        <MenuItem>Menu Item</MenuItem>
+      </>
+    ),
   },
 };
 
+export const FixedMenuSeparator: Story = {
+  args: {
+    variant: 'fixed',
+    children: (
+      <>
+        <MenuItem>Menu Item</MenuItem>
+        <MenuItem active>Active Item</MenuItem>
+        <MenuSeparator my={4} />
+        <MenuItem icon={MultipleUsersIcon}>Icon Item</MenuItem>
+        <MenuItem>Menu Item</MenuItem>
+      </>
+    ),
+  },
+};
 
-export const PopoverMenuExample: React.FC = () => {
+export const FloatingMenuExample: React.FC = () => {
   const target = useRef<HTMLDivElement>(null);
   const [isOpen, setIsOpen] = useState(false);
   const [currentTarget, setCurrentTarget] = useState(0);
@@ -117,7 +158,7 @@ export const PopoverMenuExample: React.FC = () => {
   };
 
   return (
-    <FlexBox minHeight="30px" width={1} position="relative" m={48}>
+    <FlexBox minHeight="30px" position="relative" m={48}>
       <FlexBox flex={1}>
         <Background bg="black" height="100%" pl={48} borderRadius="lg">
           <FlexBox
@@ -128,7 +169,7 @@ export const PopoverMenuExample: React.FC = () => {
             height="100%"
             ref={target}
           >
-            <Menu border="none" variant="navigation" role="menu">
+            <Menu variant="fixed" role="menu">
               <MenuItem
                 active={activeIndex === 0}
                 onClick={() => clickHandler(-68, 0)}
@@ -141,7 +182,6 @@ export const PopoverMenuExample: React.FC = () => {
               >
                 Active Item
               </MenuItem>
-              <MenuSeparator />
               <MenuItem
                 active={activeIndex === 2}
                 onClick={() => clickHandler(-164, 2)}
@@ -163,19 +203,16 @@ export const PopoverMenuExample: React.FC = () => {
             targetRef={target}
           >
             <Background bg="white" borderRadius="lg">
-              <Menu variant="select" role="menu">
+              <Menu variant="popover" role="menu">
                 {activeIndex % 2 === 0 ? (
                   <>
                     <MenuItem>i am a side menu!</MenuItem>
-                    <MenuSeparator />
                     <MenuItem href="cool">cool link</MenuItem>
                   </>
                 ) : (
                   <>
                     <MenuItem>i am a DIFFERENT menu!</MenuItem>
-                    <MenuSeparator />
                     <MenuItem href="cool-too"> another cool link</MenuItem>
-                    <MenuSeparator />
                     <MenuItem>an action</MenuItem>
                   </>
                 )}
@@ -187,8 +224,3 @@ export const PopoverMenuExample: React.FC = () => {
     </FlexBox>
   );
 };
-
-export const Popover: Story = {
-  render: () => <PopoverMenuExample />,
-}
-
diff --git a/packages/styleguide/src/static/molecules/menuAnatomy.png b/packages/styleguide/src/static/molecules/menuAnatomy.png
new file mode 100644
index 0000000000..db110dcad2
Binary files /dev/null and b/packages/styleguide/src/static/molecules/menuAnatomy.png differ