diff --git a/apps/vr-tests/src/stories/ContextualMenu.stories.tsx b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
index 5e6f6cff36cff..5073b369e47aa 100644
--- a/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
+++ b/apps/vr-tests/src/stories/ContextualMenu.stories.tsx
@@ -84,6 +84,41 @@ const itemsWithIcons = [
   }
 ];
 
+const itemsWithSecondaryText = [
+  {
+    key: 'Later Today',
+    iconProps: {
+      iconName: 'Clock'
+    },
+    name: 'Later Today',
+    secondaryText: '7:00 PM'
+  },
+  {
+    key: 'Tomorrow',
+    iconProps: {
+      iconName: 'Coffeescript'
+    },
+    name: 'Tomorrow',
+    secondaryText: 'Thu. 8:00 AM'
+  },
+  {
+    key: 'This Weekend',
+    iconProps: {
+      iconName: 'Vacation'
+    },
+    name: 'This Weekend',
+    secondaryText: 'Sat. 10:00 AM'
+  },
+  {
+    key: 'Next Week',
+    iconProps: {
+      iconName: 'Suitcase'
+    },
+    name: 'Next Week',
+    secondaryText: 'Mon. 8:00 AM'
+  }
+];
+
 const itemsWithSubmenu = [
   {
     key: 'newItem',
@@ -219,7 +254,6 @@ const itemsWithSplitButtonSubmenu = [
   }
 ];
 
-
 storiesOf('ContextualMenu', module)
   .addDecorator(FabricDecorator)
   .addDecorator(story => (
@@ -247,6 +281,11 @@ storiesOf('ContextualMenu', module)
       items={ itemsWithIcons }
     />
   ))
+  .add('With secondaryText', () => (
+    <ContextualMenu
+      items={ itemsWithSecondaryText }
+    />
+  ))
   .add('With submenu', () => (
     <ContextualMenu
       items={ itemsWithSubmenu }
diff --git a/common/changes/office-ui-fabric-react/maroquem-customdata_2018-05-05-07-50.json b/common/changes/office-ui-fabric-react/maroquem-customdata_2018-05-05-07-50.json
new file mode 100644
index 0000000000000..bbcb43ba9312b
--- /dev/null
+++ b/common/changes/office-ui-fabric-react/maroquem-customdata_2018-05-05-07-50.json
@@ -0,0 +1,11 @@
+{
+  "changes": [
+    {
+      "packageName": "office-ui-fabric-react",
+      "comment": "Add secondaryText to ContextualMenuItem to render on the right of item.name (text)",
+      "type": "minor"
+    }
+  ],
+  "packageName": "office-ui-fabric-react",
+  "email": "maroquem@microsoft.com"
+}
\ No newline at end of file
diff --git a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
index fccb203582f21..3a2e68771e58b 100644
--- a/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
+++ b/packages/office-ui-fabric-react/src/components/Button/Button.types.ts
@@ -424,6 +424,11 @@ export interface IButtonStyles {
    */
   description?: IStyle;
 
+  /**
+   * Style for the description text if applicable (for compound buttons.)
+   */
+  secondaryText?: IStyle;
+
   /**
    * Style override for the description text when the button is hovered.
    */
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
index 5463c487adb10..3f8e3f917bd3c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.classNames.ts
@@ -1,8 +1,8 @@
-import { memoizeFunction } from '../../Utilities';
+import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';
+import { getMenuItemStyles, getStyles as getContextualMenuStyles } from './ContextualMenu.styles';
 import { ITheme, mergeStyleSets } from '../../Styling';
-import { getStyles as getContextualMenuStyles, getMenuItemStyles } from './ContextualMenu.styles';
 import { IVerticalDividerClassNames } from '../Divider/VerticalDivider.types';
-import { getDividerClassNames } from '../Divider/VerticalDivider.classNames';
+import { memoizeFunction } from '../../Utilities';
 
 export interface IContextualMenuClassNames {
   container: string;
@@ -21,6 +21,7 @@ export interface IMenuItemClassNames {
   checkmarkIcon: string;
   subMenuIcon: string;
   label: string;
+  secondaryText: string;
   splitContainer: string;
   splitPrimary: string;
   splitMenu: string;
@@ -198,6 +199,10 @@ export const getItemClassNames = memoizeFunction((
       'ms-ContextualMenu-itemText',
       styles.label
     ],
+    secondaryText: [
+      'ms-ContextualMenu-secondaryText',
+      styles.secondaryText
+    ],
     splitContainer: [
       styles.splitButtonFlexContainer,
       !disabled && !checked && [{
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
index e65b4b3d650b4..4a1299d8e44a8 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.styles.ts
@@ -1,14 +1,13 @@
 import {
+  concatStyleSets,
   FontSizes,
   FontWeights,
-  IRawStyle,
-  ITheme,
-  concatStyleSets,
   getFocusStyle,
-  HighContrastSelector
+  HighContrastSelector,
+  IRawStyle,
+  ITheme
 } from '../../Styling';
 import { IContextualMenuStyles, IMenuItemStyles } from './ContextualMenu.types';
-
 import { memoizeFunction } from '../../Utilities';
 
 const ContextualMenuItemHeight = '32px';
@@ -117,6 +116,11 @@ export const getMenuItemStyles = memoizeFunction((
       overflow: 'hidden',
       whiteSpace: 'nowrap'
     },
+    secondaryText: {
+      color: theme.palette.neutralTertiary,
+      paddingLeft: '20px',
+      textAlign: 'right',
+    },
     icon: {
       display: 'inline-block',
       minHeight: '1px',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
index 1b85fb59a11da..be148d2028326 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenu.types.ts
@@ -276,6 +276,11 @@ export interface IContextualMenuItem {
    */
   name?: string;
 
+  /**
+   * Seconday description for the menu item to display
+   */
+  secondaryText?: string;
+
   itemType?: ContextualMenuItemType;
 
   /**
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
index 76545c463f2c1..a307d1847888c 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.test.tsx
@@ -134,6 +134,7 @@ function getMenuItemClassNames(): IMenuItemClassNames {
     checkmarkIcon: 'checkmarkIcon',
     subMenuIcon: 'subMenuIcon',
     label: 'label',
+    secondaryText: 'secondaryText',
     splitContainer: 'splitContainer',
     splitPrimary: 'splitPrimary',
     splitMenu: 'splitMenu',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
index 5de1b09a30b8f..d4a273b59453a 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItem.tsx
@@ -54,6 +54,13 @@ const renderItemName = ({ item, classNames }: IContextualMenuItemProps) => {
   return null;
 };
 
+const renderSecondaryText = ({ item, classNames }: IContextualMenuItemProps) => {
+  if (item.secondaryText) {
+    return <span className={ classNames.secondaryText }>{ item.secondaryText }</span>;
+  }
+  return null;
+};
+
 const renderSubMenuIcon = ({ item, classNames }: IContextualMenuItemProps) => {
   if (hasSubmenu(item)) {
     return (
@@ -81,6 +88,7 @@ export class ContextualMenuItem extends BaseComponent<IContextualMenuItemProps,
         { renderCheckMarkIcon(this.props) }
         { renderItemIcon(this.props) }
         { renderItemName(this.props) }
+        { renderSecondaryText(this.props) }
         { renderSubMenuIcon(this.props) }
       </div>
     );
@@ -109,4 +117,4 @@ export class ContextualMenuItem extends BaseComponent<IContextualMenuItemProps,
       dismissMenu(undefined /* ev */, dismissAll);
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx
index b225c5d81d03d..25687274af96d 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuAnchor.test.tsx
@@ -39,6 +39,7 @@ function getMenuItemClassNames(): IMenuItemClassNames {
     checkmarkIcon: 'checkmarkIcon',
     subMenuIcon: 'subMenuIcon',
     label: 'label',
+    secondaryText: 'secondaryText',
     splitContainer: 'splitContainer',
     splitPrimary: 'splitPrimary',
     splitMenu: 'splitMenu',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx
index d78a6eabf2e80..98313139a48ed 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuButton.test.tsx
@@ -39,6 +39,7 @@ function getMenuItemClassNames(): IMenuItemClassNames {
     checkmarkIcon: 'checkmarkIcon',
     subMenuIcon: 'subMenuIcon',
     label: 'label',
+    secondaryText: 'secondaryText',
     splitContainer: 'splitContainer',
     splitPrimary: 'splitPrimary',
     splitMenu: 'splitMenu',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx
index 93d4bbe181307..02b4d778a16fb 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuItemWrapper/ContextualMenuSplitButton.test.tsx
@@ -39,6 +39,7 @@ function getMenuItemClassNames(): IMenuItemClassNames {
     checkmarkIcon: 'checkmarkIcon',
     subMenuIcon: 'subMenuIcon',
     label: 'label',
+    secondaryText: 'secondaryText',
     splitContainer: 'splitContainer',
     splitPrimary: 'splitPrimary',
     splitMenu: 'splitMenu',
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
index 1307bd2ae58f9..5cf6241e425b4 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/ContextualMenuPage.tsx
@@ -8,6 +8,7 @@ import {
 } from '@uifabric/example-app-base';
 import { ContextualMenuBasicExample } from './examples/ContextualMenu.Basic.Example';
 import { ContextualMenuIconExample } from './examples/ContextualMenu.Icon.Example';
+import { ContextualMenuIconSecondaryTextExample } from './examples/ContextualMenu.Icon.SecondaryText.Example';
 import { ContextualMenuSectionExample } from './examples/ContextualMenu.Section.Example';
 import { ContextualMenuSubmenuExample } from './examples/ContextualMenu.Submenu.Example';
 import { ContextualMenuCustomizationWithNoWrapExample } from './examples/ContextualMenu.CustomizationWithNoWrap.Example';
@@ -21,6 +22,7 @@ import { ContextualMenuStatus } from './ContextualMenu.checklist';
 
 const ContextualMenuBasicExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Basic.Example.tsx') as string;
 const ContextualMenuIconExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.Example.tsx') as string;
+const ContextualMenuIconSecondaryTextExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.SecondaryText.Example.tsx') as string;
 const ContextualMenuSectionExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Section.Example.tsx') as string;
 const ContextualMenuSubmenuExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Submenu.Example.tsx') as string;
 const ContextualMenuCheckmarksExampleCode = require('!raw-loader!office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Checkmarks.Example.tsx') as string;
@@ -51,6 +53,12 @@ export class ContextualMenuPage extends React.Component<IComponentDemoPageProps,
             >
               <ContextualMenuIconExample />
             </ExampleCard>
+            <ExampleCard
+              title='ContextualMenu with icons and secondary text'
+              code={ ContextualMenuIconSecondaryTextExampleCode }
+            >
+              <ContextualMenuIconSecondaryTextExample />
+            </ExampleCard>
             <ExampleCard
               title='ContextualMenu with submenus'
               code={ ContextualMenuSubmenuExampleCode }
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap b/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
index 8561a5bbb3357..a996cd93b80a6 100644
--- a/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/__snapshots__/ContextualMenuItem.test.tsx.snap
@@ -15,6 +15,7 @@ ShallowWrapper {
         "linkContent": "linkContent",
         "linkContentMenu": "linkContentMenu",
         "root": "root",
+        "secondaryText": "secondaryText",
         "splitContainer": "splitContainer",
         "splitMenu": "splitMenu",
         "splitPrimary": "splitPrimary",
@@ -51,6 +52,7 @@ ShallowWrapper {
         null,
         null,
         null,
+        null,
       ],
       "className": "linkContent",
     },
@@ -72,6 +74,7 @@ ShallowWrapper {
       null,
       null,
       null,
+      null,
     ],
     "type": "div",
   },
@@ -90,6 +93,7 @@ ShallowWrapper {
           null,
           null,
           null,
+          null,
         ],
         "className": "linkContent",
       },
@@ -111,6 +115,7 @@ ShallowWrapper {
         null,
         null,
         null,
+        null,
       ],
       "type": "div",
     },
@@ -140,6 +145,7 @@ ShallowWrapper {
         "linkContent": "linkContent",
         "linkContentMenu": "linkContentMenu",
         "root": "root",
+        "secondaryText": "secondaryText",
         "splitContainer": "splitContainer",
         "splitMenu": "splitMenu",
         "splitPrimary": "splitPrimary",
@@ -174,6 +180,7 @@ ShallowWrapper {
           className="icon"
         />,
         null,
+        null,
         <StyledIconBase
           className="subMenuIcon"
           iconName="ChevronRight"
@@ -196,6 +203,7 @@ ShallowWrapper {
         "type": [Function],
       },
       null,
+      null,
       Object {
         "instance": null,
         "key": undefined,
@@ -223,6 +231,7 @@ ShallowWrapper {
             className="icon"
           />,
           null,
+          null,
           <StyledIconBase
             className="subMenuIcon"
             iconName="ChevronRight"
@@ -245,6 +254,7 @@ ShallowWrapper {
           "type": [Function],
         },
         null,
+        null,
         Object {
           "instance": null,
           "key": undefined,
@@ -286,6 +296,7 @@ ShallowWrapper {
         "linkContent": "linkContent",
         "linkContentMenu": "linkContentMenu",
         "root": "root",
+        "secondaryText": "secondaryText",
         "splitContainer": "splitContainer",
         "splitMenu": "splitMenu",
         "splitPrimary": "splitPrimary",
@@ -320,6 +331,7 @@ ShallowWrapper {
         />,
         null,
         null,
+        null,
       ],
       "className": "linkContent",
     },
@@ -339,6 +351,7 @@ ShallowWrapper {
       },
       null,
       null,
+      null,
     ],
     "type": "div",
   },
@@ -355,6 +368,7 @@ ShallowWrapper {
           />,
           null,
           null,
+          null,
         ],
         "className": "linkContent",
       },
@@ -374,6 +388,7 @@ ShallowWrapper {
         },
         null,
         null,
+        null,
       ],
       "type": "div",
     },
@@ -403,6 +418,7 @@ ShallowWrapper {
         "linkContent": "linkContent",
         "linkContentMenu": "linkContentMenu",
         "root": "root",
+        "secondaryText": "secondaryText",
         "splitContainer": "splitContainer",
         "splitMenu": "splitMenu",
         "splitPrimary": "splitPrimary",
@@ -443,6 +459,7 @@ ShallowWrapper {
           menuItem
         </span>,
         null,
+        null,
       ],
       "className": "linkContent",
     },
@@ -474,6 +491,7 @@ ShallowWrapper {
         "type": "span",
       },
       null,
+      null,
     ],
     "type": "div",
   },
@@ -495,6 +513,7 @@ ShallowWrapper {
             menuItem
           </span>,
           null,
+          null,
         ],
         "className": "linkContent",
       },
@@ -526,6 +545,7 @@ ShallowWrapper {
           "type": "span",
         },
         null,
+        null,
       ],
       "type": "div",
     },
diff --git a/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.SecondaryText.Example.tsx b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.SecondaryText.Example.tsx
new file mode 100644
index 0000000000000..b691e2fb1e93d
--- /dev/null
+++ b/packages/office-ui-fabric-react/src/components/ContextualMenu/examples/ContextualMenu.Icon.SecondaryText.Example.tsx
@@ -0,0 +1,61 @@
+import * as React from 'react';
+import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
+
+export class ContextualMenuIconSecondaryTextExample extends React.Component<{}, { showCallout: boolean }> {
+
+  constructor(props: {}) {
+    super(props);
+    this.state = {
+      showCallout: false
+    };
+  }
+
+  public render(): JSX.Element {
+    return (
+      <div>
+        <DefaultButton
+          id='ContextualMenuButton2'
+          text='Click for ContextualMenu'
+          menuProps={ {
+            shouldFocusOnMount: true,
+            items: [
+              {
+                key: 'Later Today',
+                iconProps: {
+                  iconName: 'Clock'
+                },
+                name: 'Later Today',
+                secondaryText: '7:00 PM'
+              },
+              {
+                key: 'Tomorrow',
+                iconProps: {
+                  iconName: 'Coffeescript'
+                },
+                name: 'Tomorrow',
+                secondaryText: 'Thu. 8:00 AM'
+              },
+              {
+                key: 'This Weekend',
+                iconProps: {
+                  iconName: 'Vacation'
+                },
+                name: 'This Weekend',
+                secondaryText: 'Sat. 10:00 AM'
+              },
+              {
+                key: 'Next Week',
+                iconProps: {
+                  iconName: 'Suitcase'
+                },
+                name: 'Next Week',
+                secondaryText: 'Mon. 8:00 AM'
+              },
+            ]
+          }
+          }
+        />
+      </div>
+    );
+  }
+}