diff --git a/docs/src/_data/site.js b/docs/src/_data/site.js
new file mode 100644
index 0000000..19aaab7
--- /dev/null
+++ b/docs/src/_data/site.js
@@ -0,0 +1,9 @@
+export default {
+  title: "Basecoat",
+  description: "A components library built with Tailwind CSS that works with any web stack.",
+  author: {
+    name: "Ronan Berder",
+    x: "@hunvreus"
+  },
+  url: process.env.ELEVENTY_ENV === 'development' ? "http://localhost:8080" : "https://basecoatui.com"
+};
\ No newline at end of file
diff --git a/docs/src/_data/site.json b/docs/src/_data/site.json
deleted file mode 100644
index 05d4ae9..0000000
--- a/docs/src/_data/site.json
+++ /dev/null
@@ -1,4 +0,0 @@
-{
-  "title": "Basecoat",
-  "description": "shadcn/ui for the rest of us"
-}
\ No newline at end of file
diff --git a/docs/src/_includes/layouts/base.njk b/docs/src/_includes/layouts/base.njk
index 171328f..aa485c9 100644
--- a/docs/src/_includes/layouts/base.njk
+++ b/docs/src/_includes/layouts/base.njk
@@ -45,15 +45,34 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
 
   <!-- Title & Description -->
-  <title>{{ site.title + ": " + title if page.url === "/" else title + " - " + site.title }}</title>
-  <meta name="description" content="{{ description or site.description }}"/>
-  <meta name="title" content="{{ title }} | Basecoat">
-  <meta name="description" content="{{ description }}">
+  {% set meta_title = title ~ ' | ' ~ site.title  if title else site.title %}
+  {% set meta_description = description or site.description %}
+  <title>{{ meta_title }}</title>
+  <meta name="description" content="{{ meta_description }}"/>
+  <meta name="title" content="{{ meta_title }}">
 
   <!-- Favicon -->
   <link rel="icon" type="image/svg+xml" href="/assets/favicon.svg">
   <link rel="apple-touch-icon" sizes="180x180" href="/assets/apple-touch-icon.png">
 
+   <!-- Open Graph / Facebook -->
+  <meta property="og:type" content="website">
+  <meta property="og:url" content="{{ site.url }}{{ page.url }}">
+  <meta property="og:title" content="{{ meta_title }}">
+  <meta property="og:description" content="{{ meta_description }}">
+  <meta property="og:image" content="{{ site.url }}/assets/social.png">
+  <meta property="og:site_name" content="{{ site.title }}">
+  <meta property="og:locale" content="en_US">
+  <meta property="og:author" content="{{ site.author.name }}">
+
+  <!-- X/Twitter -->
+  <meta name="twitter:card" content="summary_large_image">
+  <meta name="twitter:url" content="{{ site.url }}{{ page.url }}">
+  <meta name="twitter:title" content="{{ title if title else site.title }}">
+  <meta name="twitter:description" content="{{ meta_description }}">
+  <meta name="twitter:image" content="{{ site.url }}/assets/social.png">
+  <meta name="twitter:creator" content="{{ site.author.x }}">
+
   <!-- CSS -->
   <link rel="preconnect" href="https://rsms.me/">
   <link rel="stylesheet" href="https://rsms.me/inter/inter.css">
diff --git a/docs/src/assets/apple-touch-icon.png b/docs/src/assets/apple-touch-icon.png
index 48ff0e1..4801626 100644
Binary files a/docs/src/assets/apple-touch-icon.png and b/docs/src/assets/apple-touch-icon.png differ
diff --git a/docs/src/assets/images/avatar-1.png b/docs/src/assets/images/avatar-1.png
index c190101..bc5f13a 100644
Binary files a/docs/src/assets/images/avatar-1.png and b/docs/src/assets/images/avatar-1.png differ
diff --git a/docs/src/assets/images/avatar-2.png b/docs/src/assets/images/avatar-2.png
index b2aae01..8579f83 100644
Binary files a/docs/src/assets/images/avatar-2.png and b/docs/src/assets/images/avatar-2.png differ
diff --git a/docs/src/assets/images/avatar-3.png b/docs/src/assets/images/avatar-3.png
index f04b6b0..bde4851 100644
Binary files a/docs/src/assets/images/avatar-3.png and b/docs/src/assets/images/avatar-3.png differ
diff --git a/docs/src/assets/images/screenshot.png b/docs/src/assets/images/screenshot.png
index 916b3cf..5a34759 100644
Binary files a/docs/src/assets/images/screenshot.png and b/docs/src/assets/images/screenshot.png differ
diff --git a/docs/src/assets/social.png b/docs/src/assets/social.png
new file mode 100644
index 0000000..75d2dd6
Binary files /dev/null and b/docs/src/assets/social.png differ
diff --git a/docs/src/assets/styles.css b/docs/src/assets/styles.css
index 1283994..41e3d1f 100644
--- a/docs/src/assets/styles.css
+++ b/docs/src/assets/styles.css
@@ -498,9 +498,6 @@
   .w-max {
     width: max-content;
   }
-  .max-w-80 {
-    max-width: calc(var(--spacing) * 80);
-  }
   .max-w-\[75\%\] {
     max-width: 75%;
   }
diff --git a/package.json b/package.json
index d4e8e17..68dab8d 100644
--- a/package.json
+++ b/package.json
@@ -46,7 +46,7 @@
     "build": "node ./scripts/build.js",
     "docs:build": "tailwindcss -i ./docs/css/styles.css -o ./docs/src/assets/styles.css --minify && eleventy",
     "docs:dev:css": "tailwindcss -i ./docs/css/styles.css -o ./docs/src/assets/styles.css --watch",
-    "docs:dev:eleventy": "eleventy --serve",
+    "docs:dev:eleventy": "ELEVENTY_ENV=prod eleventy --serve",
     "docs:dev": "concurrently \"npm:docs:dev:css\" \"npm:docs:dev:eleventy\""
   },
   "devDependencies": {