diff --git a/docs/src/components/custom-board-form.js b/docs/src/components/custom-board-form.js
index 0279f6b1..e8ae4294 100644
--- a/docs/src/components/custom-board-form.js
+++ b/docs/src/components/custom-board-form.js
@@ -34,7 +34,7 @@ function CustomBoardForm({
           <div className="profilerInput">
             <label>
               Output Voltage{" "}
-              <span tooltip="Output Voltage of the PSU used by the system">
+              <span data-tooltip="Output Voltage of the PSU used by the system">
                 ⓘ
               </span>
             </label>
@@ -45,7 +45,7 @@ function CustomBoardForm({
             <div className="profilerInput">
               <label>
                 PSU Efficiency{" "}
-                <span tooltip="The estimated efficiency with a VIN of 3.8 and the output voltage entered above">
+                <span data-tooltip="The estimated efficiency with a VIN of 3.8 and the output voltage entered above">
                   ⓘ
                 </span>
               </label>
@@ -64,7 +64,7 @@ function CustomBoardForm({
           <div className="profilerInput">
             <label>
               PSU Quiescent{" "}
-              <span tooltip="The standby usage of the PSU">ⓘ</span>
+              <span data-tooltip="The standby usage of the PSU">ⓘ</span>
             </label>
             <div className="inputBox">
               <input {...bindQuiescentMicroA} type="number" />
@@ -74,7 +74,7 @@ function CustomBoardForm({
           <div className="profilerInput">
             <label>
               Other Quiescent{" "}
-              <span tooltip="Any other standby usage of the board (voltage dividers, extra ICs, etc)">
+              <span data-tooltip="Any other standby usage of the board (voltage dividers, extra ICs, etc)">
                 ⓘ
               </span>
             </label>
diff --git a/docs/src/css/power-profiler.css b/docs/src/css/power-profiler.css
index 94c4a5dd..a0c18928 100644
--- a/docs/src/css/power-profiler.css
+++ b/docs/src/css/power-profiler.css
@@ -26,12 +26,12 @@
   font-size: 14px;
 }
 
-span[tooltip] {
+span[data-tooltip] {
   position: relative;
 }
 
-span[tooltip]::before {
-  content: attr(tooltip);
+span[data-tooltip]::before {
+  content: attr(data-tooltip);
   font-size: 13px;
   padding: 5px 10px;
   position: absolute;
@@ -47,7 +47,7 @@ span[tooltip]::before {
   left: 50%;
 }
 
-span[tooltip]::after {
+span[data-tooltip]::after {
   content: "";
   position: absolute;
   border-top: 8px solid var(--ifm-background-surface-color);
@@ -62,12 +62,12 @@ span[tooltip]::after {
   left: 50%;
 }
 
-span[tooltip]:hover::before {
+span[data-tooltip]:hover::before {
   opacity: 1;
   visibility: visible;
 }
 
-span[tooltip]:hover::after {
+span[data-tooltip]:hover::after {
   opacity: 1;
   visibility: visible;
 }
diff --git a/docs/src/pages/power-profiler.js b/docs/src/pages/power-profiler.js
index c909ec02..d28886ef 100644
--- a/docs/src/pages/power-profiler.js
+++ b/docs/src/pages/power-profiler.js
@@ -155,7 +155,7 @@ function PowerProfiler() {
                 <div className="profilerInput">
                   <label>
                     Bonded Bluetooth Profiles{" "}
-                    <span tooltip="The average number of host devices connected at once">
+                    <span data-tooltip="The average number of host devices connected at once">
                       ⓘ
                     </span>
                   </label>
@@ -167,7 +167,7 @@ function PowerProfiler() {
                 <div className="profilerInput">
                   <label>
                     Percentage Asleep{" "}
-                    <span tooltip="How much time the keyboard is in deep sleep (15 min. default timeout)">
+                    <span data-tooltip="How much time the keyboard is in deep sleep (15 min. default timeout)">
                       ⓘ
                     </span>
                   </label>