add product switcher image (#1437)

Author: ethanpalm

images/navigation/product-switcher-dark.png

@@ -321,6 +321,16 @@ In the `navigation` object, `dropdowns` is an array where each entry is an objec
 
 ## Products
 
+<img
+  className="block dark:hidden pointer-events-none"
+  src="/images/navigation/product-switcher-light.png"
+/>
+
+<img
+  className="hidden dark:block pointer-events-none"
+  src="/images/navigation/product-switcher-dark.png"
+/>
+
 Products create a dedicated navigation division for organizing product-specific documentation. Use products to separate different offerings, services, or major feature sets within your documentation.
 
 In the `navigation` object, `products` is an array where each entry is an object that requires a `product` field and can contain other navigation fields such as groups, pages, icons, or links to external pages.