diff --git a/src/components/modal/__snapshots__/modal.test.tsx.snap b/src/components/modal/__snapshots__/modal.test.tsx.snap
index 374934f..3b507fe 100644
--- a/src/components/modal/__snapshots__/modal.test.tsx.snap
+++ b/src/components/modal/__snapshots__/modal.test.tsx.snap
@@ -27,7 +27,7 @@ exports[`Modal all options renders 1`] = `
     <div
       aria-describedby="radix-35"
       aria-labelledby="radix-34"
-      class="relative my12 my60-mm wmax360 w-11/12 bg-white round"
+      class="relative my120 wmax360 w-11/12 bg-white round"
       data-state="open"
       id="radix-33"
       role="dialog"
diff --git a/src/components/modal/modal.test.tsx b/src/components/modal/modal.test.tsx
index 0b7ab96..97a8128 100644
--- a/src/components/modal/modal.test.tsx
+++ b/src/components/modal/modal.test.tsx
@@ -97,6 +97,7 @@ describe('Modal', () => {
     const props = {
       accessibleTitle: 'All options',
       padding: 'none',
+      margin: 'large',
       size: 'small',
       onExit: jest.fn(),
       initialFocus: '#foo',
diff --git a/src/components/modal/modal.tsx b/src/components/modal/modal.tsx
index ae6cd9e..ee9dd88 100644
--- a/src/components/modal/modal.tsx
+++ b/src/components/modal/modal.tsx
@@ -13,6 +13,7 @@ interface Props {
   accessibleTitle: string;
   size?: 'small' | 'large' | 'auto';
   padding?: 'large' | 'none';
+  margin?: 'large' | 'default';
   onExit?: () => void;
   allowEventBubbling?: boolean;
   initialFocus?: string;
@@ -50,6 +51,7 @@ export default function Modal({
   accessibleTitle,
   size = 'large',
   padding = 'large',
+  margin = 'default',
   allowEventBubbling = false,
   initialFocus,
   primaryAction,
@@ -81,6 +83,11 @@ export default function Modal({
     widthClass = 'wmax600 w-11/12';
   }
 
+  let marginClass = 'my12 my60-mm'
+  if (margin === 'large') {
+    marginClass = 'my120';
+  }
+
   const overlayProps: {
     className: string,
     style: CSSProperties
@@ -109,7 +116,7 @@ export default function Modal({
     onOpenAutoFocus?: (e) => void
   } = {
     className: classnames(
-      `relative my12 my60-mm ${widthClass} bg-white round`,
+      `relative ${marginClass} ${widthClass} bg-white round`,
       { 'px36 py36': padding === 'large' }
     )
   }
@@ -201,6 +208,10 @@ Modal.propTypes = {
    * `'large'` or `'none'`.
    */
   padding: PropTypes.oneOf(['large', 'none']),
+  /**
+   * `'large'` to compensate for a fixed top header or `'default'` to be closer to the top of the viewport.
+   */
+  margin: PropTypes.oneOf(['large', 'default']),
   /**
    * The modal's primary action. If this is provided, an encouraging
    * button will be rendered at the bottom of the modal.