diff --git a/gallery/public/images/clearspace.png b/gallery/public/images/clearspace.png
new file mode 100644
index 000000000000..ffd1aa5f62d5
Binary files /dev/null and b/gallery/public/images/clearspace.png differ
diff --git a/gallery/public/images/logo-variants.png b/gallery/public/images/logo-variants.png
new file mode 100644
index 000000000000..2a35152ce563
Binary files /dev/null and b/gallery/public/images/logo-variants.png differ
diff --git a/gallery/public/images/logo.png b/gallery/public/images/logo.png
new file mode 100644
index 000000000000..e3faf04c5a76
Binary files /dev/null and b/gallery/public/images/logo.png differ
diff --git a/gallery/public/images/using-our-logo.png b/gallery/public/images/using-our-logo.png
new file mode 100644
index 000000000000..0199a37b64a4
Binary files /dev/null and b/gallery/public/images/using-our-logo.png differ
diff --git a/gallery/src/pages/brand/logo.markdown b/gallery/src/pages/brand/logo.markdown
new file mode 100644
index 000000000000..e931fed8aff6
--- /dev/null
+++ b/gallery/src/pages/brand/logo.markdown
@@ -0,0 +1,34 @@
+---
+title: "Logo"
+---
+
+![Using our logo](/images/using-our-logo.png)
+
+# Using our logo
+
+As a community, we are proud of our logo. Follow these guidelines to ensure it always looks its best. Our logo follows Google's material design spec and uses the blue interface color.
+
+[Download Logo](https://github.com/home-assistant/assets/tree/master/logo)
+
+![Logo](/images/logo.png)
+
+
+## Using the icon
+
+Our icon is a shorter and most used version of our logo. The icon can exist without the wordmark, the wordmark should never exist without the icon.
+
+![Logo variants](/images/logo-variants.png)
+
+## Using the right variant
+
+The pretty blue logo with a background shadow, pictured top left, is our primary logo. It should only be used with black, white, and non-duotone photography.
+
+When needed you can use our logo without a shadow, as seen as the second variant. 
+
+The outlined logo should only be used on packaging.
+
+## Exclusion zone
+
+The logo needs some personal space. It's exclusion zone is equal to a quarter the height of the icon.
+
+![Clearspace](/images/clearspace.png)