diff --git a/next/app/test/hayley/mycomponent/page.tsx b/next/app/test/hayley/mycomponent/page.tsx
new file mode 100644
index 0000000..e693729
--- /dev/null
+++ b/next/app/test/hayley/mycomponent/page.tsx
@@ -0,0 +1,5 @@
+import HayleyComponent from "@/components/dev/HayleyComponent";
+
+export default function MyComponent() {
+  return <HayleyComponent />;
+}
diff --git a/next/components/dev/HayleyComponent.tsx b/next/components/dev/HayleyComponent.tsx
new file mode 100644
index 0000000..77ad1ea
--- /dev/null
+++ b/next/components/dev/HayleyComponent.tsx
@@ -0,0 +1,7 @@
+export default function HayleyComponent() {
+    return (
+        <div>
+            <h1 className="text-blue-600"> This is Hayley's blue component!</h1>
+        </div>
+    )
+}
\ No newline at end of file