diff --git a/pages/index.tsx b/pages/index.tsx
index 656ff83..2a4334f 100644
--- a/pages/index.tsx
+++ b/pages/index.tsx
@@ -85,6 +85,11 @@ export default function Landing({ jobs, skills, projects }: LandingProps) {
             <p>An endless trail of links to my personal notes</p>
             <a href="/notes" target="_blank">Go To Notes {'->'}</a>
           </article>
+
+          <article>
+            <h2 className="text-1xl font-bold uppercase">Experimental Stuff</h2>
+            <a href="/portfolio2" target="_blank">Portfolio 2 {"->"}</a>
+          </article>
         </section>
       </main>
     </div>
diff --git a/pages/playground/index.tsx b/pages/playground/index.tsx
new file mode 100644
index 0000000..861442b
--- /dev/null
+++ b/pages/playground/index.tsx
@@ -0,0 +1,31 @@
+import Head from "next/head";
+
+export default function Home() {
+  return (
+    <div>
+      <Head>
+        <body className="bg-[radial-gradient(ellipse_at_top_right,_var(--tw-gradient-stops))] from-gray-600 to-gray-900  " />
+      </Head>
+      <div className="parent min-h-screen grid grid-cols-23 grid-rows-22 gap-5 p-10 scale-75">
+        <div className="[grid-area:1_/_1_/_14_/_6] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent "> </div>
+        <div className="[grid-area:14_/_1_/_17_/_6] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:1_/_6_/_8_/_12] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:1_/_12_/_8_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:17_/_1_/_21_/_10] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:21_/_1_/_23_/_10] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:17_/_18_/_23_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:12_/_18_/_17_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:7_/_18_/_12_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:1_/_18_/_7_/_24] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:8_/_6_/_17_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+        <div className="[grid-area:17_/_10_/_23_/_18] bg-white bg-opacity-5 border border-t-gray-400 border-r-gray-500 border-l-transparent border-b-transparent"> </div>
+      </div>
+
+      <div className="p-10 flex gap-4  bg-white">
+        <div className="bg-sky-50 transition-all duration-500 hover:w-36 hover:bg-sky-500 w-20 h-20 shadow-lg hover:shadow-sky-300 rounded-full" />
+        <div className="bg-red-50 transition-all duration-500 hover:w-36 hover:bg-red-500 w-20 h-20 shadow-lg hover:shadow-red-300 rounded-full" />
+        <div className="bg-purple-50 transition-all duration-500 hover:w-36 hover:bg-purple-500 w-20 h-20 shadow-lg hover:shadow-purple-300 rounded-full" />
+      </div>
+    </div>
+  )
+}
diff --git a/styles/global.css b/styles/global.css
index 9bec671..abf4c7e 100644
--- a/styles/global.css
+++ b/styles/global.css
@@ -10,15 +10,23 @@
   --white: #ffffffff;
 }
 
+
+.parent>* {
+  border-radius: 16px;
+  box-shadow: -10px 16px 25px #0004;
+}
+
+
+
 @layer components {
 
-:root {
-  /* LOGO Theme colors */
-  --rich-black: #071425ff;
-  --air-force-blue: #6f8fa5ff;
-  --light-blue: #a5c6cdff;
-  --white: #ffffffff;
-}
+  :root {
+    /* LOGO Theme colors */
+    --rich-black: #071425ff;
+    --air-force-blue: #6f8fa5ff;
+    --light-blue: #a5c6cdff;
+    --white: #ffffffff;
+  }
 
   .nav-bar {
     @apply px-5 py-2 bg-slate-500 bg-opacity-20 flex flex-col;
