diff --git a/packages/website/docs/patterns/pre_ga_badges.mdx b/packages/website/docs/patterns/pre_ga_badges.mdx
index 8ba5a3b57db..5f52fe2da35 100644
--- a/packages/website/docs/patterns/pre_ga_badges.mdx
+++ b/packages/website/docs/patterns/pre_ga_badges.mdx
@@ -7,11 +7,11 @@ slug: /patterns/pre-ga-badges
 
 Using badges in the interface allows to indicate upcoming features and product innovations available for testing and to set user expectations about the maturity, (non-)support, and stability of a feature.
 
-
+![An example of a beta badge alongside a link to the Explorer feature](./beta_badges.png)
 
 ## Choosing between designations
 
-When a feature becomes available for users before being officially Generally Available (GA), it is marked using a badge. A badge can have a default and a short form (with a simple icon). With both forms, a tooltip text explains what this means for the feature to help users get the correct expectations. 
+When a feature becomes available for users before being officially Generally Available (GA), it is marked using a badge. A badge can have a default and a short form (with a simple icon). With both forms, a tooltip text explains what this means for the feature to help users get the correct expectations.
 
 Features don't necessarily go through each stage defined in this document. For example, it can start with Beta, or it can start with Technical preview and be announced as GA next.
 
diff --git a/packages/website/package.json b/packages/website/package.json
index 85921cddf68..8ff435969b0 100644
--- a/packages/website/package.json
+++ b/packages/website/package.json
@@ -4,8 +4,8 @@
   "private": true,
   "scripts": {
     "docusaurus": "docusaurus",
-    "start": "docusaurus start",
-    "build": "docusaurus build",
+    "start": "cross-env NODE_OPTIONS=--openssl-legacy-provider docusaurus start",
+    "build": "cross-env NODE_OPTIONS=--openssl-legacy-provider docusaurus build",
     "swizzle": "docusaurus swizzle",
     "deploy": "docusaurus deploy",
     "clear": "docusaurus clear",
@@ -39,6 +39,7 @@
     "@docusaurus/types": "3.4.0",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
+    "cross-env": "^7.0.3",
     "typescript": "~5.5.4"
   },
   "browserslist": {
diff --git a/yarn.lock b/yarn.lock
index c325ecb9774..5a8a1fecab9 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -5765,6 +5765,7 @@ __metadata:
     "@types/react": "npm:^18.3.3"
     "@types/react-dom": "npm:^18.3.0"
     clsx: "npm:^2.0.0"
+    cross-env: "npm:^7.0.3"
     docusaurus-lunr-search: "npm:^3.4.0"
     hast-util-is-element: "npm:1.1.0"
     moment: "npm:^2.30.1"
@@ -15230,6 +15231,18 @@ __metadata:
   languageName: node
   linkType: hard
 
+"cross-env@npm:^7.0.3":
+  version: 7.0.3
+  resolution: "cross-env@npm:7.0.3"
+  dependencies:
+    cross-spawn: "npm:^7.0.1"
+  bin:
+    cross-env: src/bin/cross-env.js
+    cross-env-shell: src/bin/cross-env-shell.js
+  checksum: 10c0/f3765c25746c69fcca369655c442c6c886e54ccf3ab8c16847d5ad0e91e2f337d36eedc6599c1227904bf2a228d721e690324446876115bc8e7b32a866735ecf
+  languageName: node
+  linkType: hard
+
 "cross-spawn@npm:^4.0.0":
   version: 4.0.2
   resolution: "cross-spawn@npm:4.0.2"