diff --git a/src/components/BigHeader.tsx b/src/components/BigHeader.tsx
new file mode 100644
index 0000000..7200b8f
--- /dev/null
+++ b/src/components/BigHeader.tsx
@@ -0,0 +1,28 @@
+import Typography from "@mui/material/Typography";
+
+interface BigHeaderProps {
+  children: React.ReactNode;
+}
+
+export default function BigHeader({ children, ...props }: BigHeaderProps) {
+  return (
+    <Typography variant="h1" sx={{
+        fontSize: {
+          xs: '4rem',
+          sm: '6.5rem',
+        },
+        textTransform: 'uppercase',
+        margin: '0 auto',
+        color: '#000',
+        width: '100%',
+        span: {
+          fontWeight: 'bold',
+          fontStyle: 'italic',
+        }
+      }}
+      {...props}
+    >
+      {children}
+    </Typography>
+  );
+}
diff --git a/src/components/Nav.tsx b/src/components/Nav.tsx
new file mode 100644
index 0000000..b931ab6
--- /dev/null
+++ b/src/components/Nav.tsx
@@ -0,0 +1,19 @@
+import Button from '@mui/material/Button';
+import Stack from '@mui/material/Stack';
+
+export default function Nav() {
+  return (
+    <Stack direction="row" spacing={2} sx={{
+      '.MuiButtonBase-root': {
+        fontSize: {
+          xs: '1.5rem',
+          sm: '2rem',
+        }
+      }
+    }}>
+      <Button size="large" href="/about">Our Story</Button>
+      <Button size="large" href="/ontap">On Tap</Button>
+      <Button size="large" href="/contact">Contact</Button>
+    </Stack>
+  );
+}