diff --git a/docs/content/Heading.md b/docs/content/Heading.md
index 824a33be9f4..3e71f224abf 100644
--- a/docs/content/Heading.md
+++ b/docs/content/Heading.md
@@ -2,11 +2,13 @@
 title: Heading
 ---
 
-The Heading component will render an html `h1-6` tag without any default styling. Please reference the [w3 recommendations for headings](https://www.w3.org/WAI/tutorials/page-structure/headings/) to ensure your headings provide an accessible experience for screen reader users.
+The Heading component will render an html `h2` tag without any default styling. Other heading level elements `h1-h6` are available through use of the `as` prop (see [System Props](/system-props) for additional explanation). Please reference the [w3 recommendations for headings](https://www.w3.org/WAI/tutorials/page-structure/headings/) to ensure your headings provide an accessible experience for screen reader users.
+
+**Attention:** Make sure to include a valid heading element to render a Heading component other than `h2` (`<Heading as="h1">H1 Element</Heading>`).
 
 ## Default example
 ```jsx live
-<Heading fontSize={1} mb={2}>With fontSize={1}</Heading>
+<Heading fontSize={1} mb={2}>H2 heading with fontSize={1}</Heading>
 ```
 
 ## System props
@@ -15,4 +17,6 @@ Heading components get `TYPOGRAPHY` and `COMMON` system props. Read our [System
 
 ## Component props
 
-Heading does not get any additional props other than the system props mentioned above.
+| Prop name | Type    | Description                                      |
+| :-------- | :------ | :----------------------------------------------- |
+| as        | String  | sets the HTML tag for the component              |
diff --git a/index.d.ts b/index.d.ts
index deeb1649689..6759c0445a4 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -70,7 +70,9 @@ declare module '@primer/components' {
     extends BaseProps,
       CommonProps,
       TypographyProps,
-      Omit<React.HTMLAttributes<HTMLHeadingElement>, 'color'> {}
+      Omit<React.HTMLAttributes<HTMLHeadingElement>, 'color'> {
+    as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'
+  }
 
   export const Heading: React.FunctionComponent<HeadingProps>
 
diff --git a/src/Heading.js b/src/Heading.js
index f75ff14c3bc..1027da6ace7 100644
--- a/src/Heading.js
+++ b/src/Heading.js
@@ -3,7 +3,7 @@ import PropTypes from 'prop-types'
 import {TYPOGRAPHY, COMMON, get} from './constants'
 import theme from './theme'
 
-const Heading = styled.h1`
+const Heading = styled.h2`
   font-weight: ${get('fontWeights.bold')};
   font-size: ${get('fontSizes.5')};
   margin: 0;
@@ -17,7 +17,8 @@ Heading.defaultProps = {
 Heading.propTypes = {
   ...COMMON.propTypes,
   ...TYPOGRAPHY.propTypes,
-  theme: PropTypes.object
+  theme: PropTypes.object,
+  as: PropTypes.oneOf(['h1', 'h2', 'h3', 'h4', 'h5', 'h6']),
 }
 
 export default Heading
diff --git a/src/__tests__/Heading.js b/src/__tests__/Heading.js
index d447cc2c587..2540da192c0 100644
--- a/src/__tests__/Heading.js
+++ b/src/__tests__/Heading.js
@@ -31,8 +31,8 @@ const theme = {
 }
 
 describe('Heading', () => {
-  it('renders <h1> by default', () => {
-    expect(render(<Heading />).type).toEqual('h1')
+  it('renders <h2> by default', () => {
+    expect(render(<Heading />).type).toEqual('h2')
   })
 
   it('should have no axe violations', async () => {
@@ -94,7 +94,6 @@ describe('Heading', () => {
 
   it('respects the "fontStyle" prop', () => {
     expect(render(<Heading fontStyle="italic" />)).toHaveStyleRule('font-style', 'italic')
-    expect(render(<Heading as="i" fontStyle="normal" />)).toHaveStyleRule('font-style', 'normal')
   })
 
   it.skip('renders fontSize with f* classes using inverse scale', () => {