diff --git a/packages/docs/src/pages/components/svg.mdx b/packages/docs/src/pages/components/svg.mdx
new file mode 100644
index 000000000..07161309e
--- /dev/null
+++ b/packages/docs/src/pages/components/svg.mdx
@@ -0,0 +1,17 @@
+---
+title: SVG
+---
+
+# SVG
+
+A drop-in replacement for the `<svg>` tag, but themeable
+
+```js
+import { SVG } from 'theme-ui'
+```
+
+```jsx live=true
+<SVG title="Menu" size={24}>
+  <path d="M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" />
+</SVG>
+```
diff --git a/packages/docs/src/sidebar.mdx b/packages/docs/src/sidebar.mdx
index 9e5a15b80..75b1a5063 100644
--- a/packages/docs/src/sidebar.mdx
+++ b/packages/docs/src/sidebar.mdx
@@ -37,6 +37,7 @@
   - [Progress](/components/progress)
   - [Donut](/components/donut)
   - [Spinner](/components/spinner)
+  - [SVG](/components/svg)
   - [Avatar](/components/avatar)
   - [Badge](/components/badge)
   - [Close](/components/close)