diff --git a/docs/components/stack-blitz.tsx b/docs/components/stack-blitz.tsx
new file mode 100644
index 00000000..8dae50e2
--- /dev/null
+++ b/docs/components/stack-blitz.tsx
@@ -0,0 +1,20 @@
+export const StackBlitz = (props: {
+  name: string
+  height?: number
+  view?: 'preview' | 'editor'
+  openFile?: string
+  hideExplorer?: boolean
+  showDevtools?: boolean
+}) => {
+  return (
+    <iframe
+      src={`https://stackblitz.com/edit/${props.name}?embed=1&hideExplorer=${
+        props.hideExplorer ? 1 : 0
+      }&file=${props.openFile}&view=${props.view}&devToolsHeight=${
+        props.showDevtools ? '50' : '0'
+      }`}
+      height={props.height || 600}
+      style={{ width: '100%', borderRadius: '7px', margin: '2em 0' }}
+    />
+  )
+}
diff --git a/docs/pages/examples/vanilla-javascript.mdx b/docs/pages/examples/vanilla-javascript.mdx
index e69de29b..8c59cdd9 100644
--- a/docs/pages/examples/vanilla-javascript.mdx
+++ b/docs/pages/examples/vanilla-javascript.mdx
@@ -0,0 +1,5 @@
+import { StackBlitz } from '../../components/stack-blitz'
+
+# Vanilla JS Example
+
+<StackBlitz name="js-1sexbs" openFile="Input/Input.tsx" />
\ No newline at end of file