diff --git a/src/GarageApp/modules/DummyButton.tsx b/src/GarageApp/modules/DummyButton.tsx
new file mode 100644
index 00000000..060c6f34
--- /dev/null
+++ b/src/GarageApp/modules/DummyButton.tsx
@@ -0,0 +1,9 @@
+import * as React from 'react';
+import Button from '@mui/material/Button';
+
+export default function TextButtons() {
+  return (
+	  <Button variant="contained">Temp Button</Button>
+  );
+}
+
diff --git a/src/ProjectButtons.json b/src/ProjectButtons.json
new file mode 100644
index 00000000..eaf0afe3
--- /dev/null
+++ b/src/ProjectButtons.json
@@ -0,0 +1,13 @@
+[
+      {
+	      "text": "GarageApp",
+	      "href": "GarageApp",
+	      "var":"contained" 
+      },
+      { 
+	      "text": "Wisher",
+	      "href": "Wisher",
+	      "var": "outlined"
+      }
+]
+
diff --git a/src/buttons.tsx b/src/buttons.tsx
new file mode 100644
index 00000000..c3ea37dd
--- /dev/null
+++ b/src/buttons.tsx
@@ -0,0 +1,32 @@
+import * as React from 'react';
+import Button from '@mui/material/Button';
+import Container from '@mui/material/Container';
+import Grid from '@mui/material/Grid';
+import btns from "./ProjectButtons.json";
+
+// const btns = [
+// 	{ text: 'GarageApp', href: 'GarageApp', var:'contained' },
+// 	{ text: 'Wisher', href: 'Wisher', var: 'outlined' }
+// ];
+
+const btn = props => {
+	return (
+		<Button variant="contained" href={props.href}>{props.text}</Button>
+	);
+};
+
+const BtnGrid = () => {
+	return (
+		<Container>
+			<Grid container spacing={2}>
+				{btns.map((btn, index) => (
+					<Grid item key={index} xs={12} sm={6} md={4}>
+					  	<Button variant={btn.var} href={btn.href}>{btn.text}</Button>
+					</Grid>
+				))}
+			</Grid>
+		</Container>
+	);
+};
+
+export default BtnGrid