diff --git a/src/404.webc b/src/404.webc
index 01f45f2..6daadb4 100644
--- a/src/404.webc
+++ b/src/404.webc
@@ -1,7 +1,7 @@
 ---
 layout: default.webc
 title: 404
-description: The origin story of Diamond UI
+description: Page not found
 ---
 
 <diamond-wrap size="lg" class="diamond-spacing-bottom-fluid">
diff --git a/src/assets/share-cards/large.png b/src/assets/share-cards/large.png
new file mode 100644
index 0000000..f03ea8f
Binary files /dev/null and b/src/assets/share-cards/large.png differ
diff --git a/src/assets/share-cards/medium.png b/src/assets/share-cards/medium.png
new file mode 100644
index 0000000..63f8267
Binary files /dev/null and b/src/assets/share-cards/medium.png differ
diff --git a/src/assets/share-cards/small.png b/src/assets/share-cards/small.png
new file mode 100644
index 0000000..3133193
Binary files /dev/null and b/src/assets/share-cards/small.png differ
diff --git a/src/layouts/default.webc b/src/layouts/default.webc
index ed854be..6f2b589 100644
--- a/src/layouts/default.webc
+++ b/src/layouts/default.webc
@@ -17,6 +17,34 @@
     <meta name="msapplication-config" content="/assets/icons/browserconfig.xml">
     <meta name="theme-color" content="#ffffff">
 
+    <!-- Share cards -->
+    <meta property="og:url" content="https://diamond.etch.co"/>
+    <meta property="og:site_name" content="Diamond UI"/>
+    <meta property="og:title" :content="title"/>
+    <meta property="og:description" :content="description"/>
+    
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/large.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="1200"/>
+    <meta property="og:image:height" content="630"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+    
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/medium.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="600"/>
+    <meta property="og:image:height" content="314"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+    
+    <meta property="og:image" content="https://diamond.etch.co/images/share-cards/small.png"/>
+    <meta property="og:image:type" content="image/png"/>
+    <meta property="og:image:width" content="400"/>
+    <meta property="og:image:height" content="400"/>
+    <meta property="og:image:alt" content="Diamond UI - Bring clarity to your components"/>
+    
+    <meta name="twitter:card" content="summary"/>
+    <meta name="twitter:site" content="@etch"/>
+    <meta name="twitter:creator" content="@etch"/>
+
     <!--- Bundled base styles --->
     <link rel="stylesheet" href="../../node_modules/@etchteam/diamond-ui/diamond-ui.css" webc:bucket="styles">
     <link rel="stylesheet" href="../styles/reset.css" webc:bucket="styles">