diff --git a/src/components.css b/src/components.css
index e0ccf5e..193114e 100644
--- a/src/components.css
+++ b/src/components.css
@@ -227,10 +227,12 @@
         --button-text: var(--color-info);
       }
       &:hover {
+        color: var(--button-text);
         background-color: color-mix(in oklch, var(--button-text) 8%, transparent);
         box-shadow: var(--elevation-0);
       }
       &:active {
+        color: var(--button-text);
         background-color: color-mix(in oklch, var(--button-text) 18%, transparent);
       }
     }
@@ -276,6 +278,7 @@
     &.icon:not(:disabled) {
       --button-text: var(--color-on-surface-variant);
       --button-surface: transparent;
+      padding: calc(var(--spacing) * 1);
       &.selected {
         --button-text: var(--color-primary);
         &.secondary {
@@ -310,10 +313,12 @@
     &.icon:disabled {
       --button-text: color-mix(in oklch, var(--color-on-surface) 38%, transparent);
       --button-surface: transparent;
+      padding: calc(var(--spacing) * 1);
     }
     &.filled_icon:not(:disabled) {
       --button-text: var(--color-on-primary);
       --button-surface: var(--color-primary);
+      padding: calc(var(--spacing) * 1);
       &.secondary {
         --button-text: var(--color-on-secondary);
         --button-surface: var(--color-secondary);
@@ -346,10 +351,12 @@
     &.filled_icon:disabled {
       --button-text: color-mix(in oklch, var(--color-on-surface) 38%, transparent);
       --button-surface: color-mix(in oklch, var(--color-on-surface) 12%, transparent);
+      padding: calc(var(--spacing) * 1);
     }
     &.tonal_icon:not(:disabled) {
       --button-text: var(--color-on-primary-container);
       --button-surface: var(--color-primary-container);
+      padding: calc(var(--spacing) * 1);
       &.secondary {
         --button-text: var(--color-on-secondary-container);
         --button-surface: var(--color-secondary-container);
@@ -364,38 +371,40 @@
       }
       &.warn {
         --button-text: var(--color-on-warning-container);
-        --button-surface: var(--color-warning);
+        --button-surface: var(--color-warning-container);
       }
       &.success {
         --button-text: var(--color-on-success-container);
         --button-surface: var(--color-success-container);
       }
       &.info {
-        --button-text: var(--color-on-info);
-        --button-surface: var(--color-info);
+        --button-text: var(--color-on-info-container);
+        --button-surface: var(--color-info-container);
       }
       &.unselected {
         --button-text: var(--color-on-surface-variant);
         --button-surface: var(--color-surface-container-highest);
       }
       &:hover {
-        color: var(--button-text);
-        background-color: color-mix(in oklch, var(--button-text) 8%, transparent);
+        color: var(--button-surface);
+        background-color: color-mix(in oklch, var(--button-surface) 8%, transparent);
         box-shadow: var(--elevation-0);
       }
       &:active {
-        color: var(--button-text);
-        background-color: color-mix(in oklch, var(--button-text) 18%, transparent);
+        color: var(--button-surface);
+        background-color: color-mix(in oklch, var(--button-surface) 18%, transparent);
       }
     }
     &.tonal_icon:disabled {
       --button-text: color-mix(in oklch, var(--color-on-surface) 38%, transparent);
       --button-surface: color-mix(in oklch, var(--color-on-surface) 12%, transparent);
+      padding: calc(var(--spacing) * 1);
     }
     &.outlined_icon:not(:disabled) {
       --button-text: var(--color-on-surface-variant);
       --button-surface: transparent;
       border: 1px solid var(--button-outline);
+      padding: calc(var(--spacing) * 1);
       &.selected {
         --button-text: var(--color-inverse-on-surface);
         --button-surface: var(--color-inverse-surface);
@@ -414,6 +423,7 @@
       --button-text: color-mix(in oklch, var(--color-on-surface) 38%, transparent);
       --button-surface: color-mix(in oklch, var(--color-on-surface) 12%, transparent);
       border: 1px solid color-mix(in oklch, var(--color-on-surface) 12%, transparent);
+      padding: calc(var(--spacing) * 1);
     }
   }