diff --git a/.changeset/fix-heading-secondary-color.md b/.changeset/fix-heading-secondary-color.md
new file mode 100644
index 000000000..e33f954df
--- /dev/null
+++ b/.changeset/fix-heading-secondary-color.md
@@ -0,0 +1,5 @@
+---
+"spectacle": patch
+---
+
+Fix Heading component not applying secondary color styling. Restores correct theme color for headings that was lost in v10.2.2 when replacing defaultProps with attrs method.
diff --git a/packages/spectacle/src/components/typography.test.tsx b/packages/spectacle/src/components/typography.test.tsx
index b8eb73384..8e71d1a29 100644
--- a/packages/spectacle/src/components/typography.test.tsx
+++ b/packages/spectacle/src/components/typography.test.tsx
@@ -34,6 +34,11 @@ describe('<Heading />', () => {
     const { getByText } = mountWithTheme(<Heading>Spectacle!</Heading>);
     expect(getByText('Spectacle!')).toHaveStyle({ fontSize: 'h1' });
   });
+
+  it('should apply the secondary color from theme', () => {
+    const { getByText } = mountWithTheme(<Heading>Spectacle!</Heading>);
+    expect(getByText('Spectacle!')).toHaveStyle({ color: '#fc6986' });
+  });
 });
 
 describe('<Quote />', () => {
diff --git a/packages/spectacle/src/components/typography.tsx b/packages/spectacle/src/components/typography.tsx
index c6054f9b0..9bf648da9 100644
--- a/packages/spectacle/src/components/typography.tsx
+++ b/packages/spectacle/src/components/typography.tsx
@@ -53,15 +53,16 @@ const Link = styled.a.attrs<CommonTypographyProps & DecorationProps>(
   compose(color, typography, space, decoration)
 );
 
-const Heading = styled(Text).attrs<CommonTypographyProps>((props) => ({
+const Heading = styled.div.attrs<CommonTypographyProps>((props) => ({
   color: 'secondary',
   fontFamily: 'header',
   fontSize: 'h1',
   fontWeight: 'bold',
   textAlign: 'center',
   margin: 1,
+  padding: 0,
   ...props
-}))<CommonTypographyProps>({});
+}))<CommonTypographyProps>(compose(color, typography, space));
 
 const Quote = styled(
   Text as FC<