diff --git a/apps/www/content/docs/blocks.mdx b/apps/www/content/docs/blocks.mdx
index a3ee31a6ce..a895449264 100644
--- a/apps/www/content/docs/blocks.mdx
+++ b/apps/www/content/docs/blocks.mdx
@@ -153,6 +153,21 @@ pnpm registry:build
 
 Once the build script is finished, you can view your block at `http://localhost:3333/blocks/[CATEGORY]` or a full screen preview at `http://localhost:3333/view/styles/new-york/dashboard-01`.
 
+<Image
+  src="/images/block-preview-light.png"
+  width="1432"
+  height="960"
+  alt="Block preview"
+  className="border dark:hidden shadow-sm rounded-lg overflow-hidden mt-6 w-full"
+/>
+<Image
+  src="/images/block-preview-dark.png"
+  width="1432"
+  height="960"
+  alt="Block preview"
+  className="border hidden dark:block shadow-sm rounded-lg overflow-hidden mt-6 w-full"
+/>
+
 ### Build your block
 
 You can now build your block by editing the files in the block folder and viewing the changes in the browser.
diff --git a/apps/www/public/images/block-preview-dark.png b/apps/www/public/images/block-preview-dark.png
new file mode 100644
index 0000000000..61e8b0b9f7
Binary files /dev/null and b/apps/www/public/images/block-preview-dark.png differ
diff --git a/apps/www/public/images/block-preview-light.png b/apps/www/public/images/block-preview-light.png
new file mode 100644
index 0000000000..03c1d608a7
Binary files /dev/null and b/apps/www/public/images/block-preview-light.png differ