diff --git a/docs/source/backgrounds.md b/docs/source/backgrounds.md
index 3e8b59e05..0315080cb 100644
--- a/docs/source/backgrounds.md
+++ b/docs/source/backgrounds.md
@@ -46,14 +46,6 @@ title: "Backgrounds"
     <td class="w-24 h-12 bg-orange-light border-b border-dark-overlay-softer"></td>
     <td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-orange-light</code></td>
   </tr>
-  <tr>
-    <td class="w-24 h-12 bg-amber border-b border-dark-overlay-softer"></td>
-    <td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-amber</code></td>
-  </tr>
-  <tr>
-    <td class="w-24 h-12 bg-amber-light border-b border-dark-overlay-softer"></td>
-    <td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-amber-light</code></td>
-  </tr>
   <tr>
     <td class="w-24 h-12 bg-yellow border-b border-dark-overlay-softer"></td>
     <td class="border-b border-dark-overlay-softer py-3 px-6" style="vertical-align: middle;"><code>.bg-yellow</code></td>
diff --git a/docs/source/buttons.md b/docs/source/buttons.md
index a0c730a95..0fc689d49 100644
--- a/docs/source/buttons.md
+++ b/docs/source/buttons.md
@@ -17,7 +17,7 @@ title: "Buttons"
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-dark mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-dark hover-bg-dark-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-dark-soft mr-4">
@@ -28,66 +28,74 @@ title: "Buttons"
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-red mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-red hover-bg-red-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-red-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-amber mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-orange hover-bg-orange-dark mr-4">
         Save
     </button>
-    <button class="text-medium text-light rounded py-2 px-4 bg-amber-light mr-4">
-        Save
+    <button class="text-medium text-light rounded py-2 px-4 bg-orange-light mr-4">
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-green mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-yellow hover-bg-yellow-dark mr-4">
+        Save
+    </button>
+    <button class="text-medium text-light rounded py-2 px-4 bg-yellow-light mr-4">
+        Disabled
+    </button>
+</div>
+<div class="mb-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-green hover-bg-green-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-green-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-teal mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-teal hover-bg-teal-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-teal-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-blue mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-blue hover-bg-blue-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-blue-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-indigo mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-indigo hover-bg-indigo-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-indigo-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-purple mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-purple hover-bg-purple-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-purple-light mr-4">
-        Save
+        Disabled
     </button>
 </div>
 <div class="mb-4">
-    <button class="text-medium text-light rounded py-2 px-4 bg-pink mr-4">
+    <button class="text-medium text-light rounded py-2 px-4 bg-pink hover-bg-pink-dark mr-4">
         Save
     </button>
     <button class="text-medium text-light rounded py-2 px-4 bg-pink-light mr-4">
-        Save
+        Disabled
     </button>
 </div>