diff --git a/src/styles/algolia.scss b/src/styles/algolia.scss
index d7b8686b175..9d0cd3361ad 100644
--- a/src/styles/algolia.scss
+++ b/src/styles/algolia.scss
@@ -29,10 +29,15 @@
     }
 
     &:focus {
+      box-shadow: none;
+    }
+
+    &:focus-visible {
+      transition: none;
       background-color: var(--amplify-components-button-hover-background-color);
-      border-color: var(--amplify-components-button-focus-border-color);
       color: var(--amplify-components-button-focus-color);
-      box-shadow: var(--amplify-components-button-focus-box-shadow);
+      outline: 2px solid var(--amplify-colors-border-focus);
+      outline-offset: 2px;
     }
 
     .DocSearch-Search-Icon {
diff --git a/src/styles/base.scss b/src/styles/base.scss
index d06ea9c8d98..4bfde6571a6 100644
--- a/src/styles/base.scss
+++ b/src/styles/base.scss
@@ -132,7 +132,7 @@ a,
     text-decoration: none;
   }
 
-  &:focus {
+  &:focus-visible {
     outline: 2px solid var(--amplify-colors-border-focus);
   }
 }
@@ -189,6 +189,14 @@ ol:not([class]) {
   }
 }
 
+.amplify-button {
+  &:focus-visible {
+    transition: none;
+    outline: 2px solid var(--amplify-colors-border-focus);
+    outline-offset: 2px;
+  }
+}
+
 .skip-to-main {
   position: fixed;
   z-index: 201; // GlobalNav is set to 200
@@ -204,4 +212,9 @@ ol:not([class]) {
     white-space: nowrap;
     width: 1px;
   }
+  [data-amplify-theme='default-theme'] & {
+    &:focus-visible {
+      outline-color: var(--amplify-colors-white);
+    }
+  }
 }
diff --git a/src/styles/code.scss b/src/styles/code.scss
index b5699390d3e..f428d966c62 100644
--- a/src/styles/code.scss
+++ b/src/styles/code.scss
@@ -250,7 +250,7 @@ hover style on the other */
 .code-copy {
   --code-copy-hover-background-color: var(--amplify-colors-neutral-90);
   --code-copy-focus-background-color: var(--amplify-colors-neutral-90);
-  --code-copy-focus-box-shadow: var(--amplify-colors-neutral-10);
+  --code-copy-focus-outline-color: var(--amplify-colors-white);
   margin-inline-start: auto;
   padding-block: var(--amplify-space-xxxs);
   color: var(--amplify-colors-white);
@@ -260,14 +260,16 @@ hover style on the other */
     color: var(--amplify-colors-white);
     background-color: var(--code-copy-hover-background-color);
   }
-  &:focus {
+  &:focus,
+  &:active {
     color: var(--amplify-colors-white);
     background-color: var(--code-copy-focus-background-color);
-    box-shadow: 0 0 0 2px var(--code-copy-focus-box-shadow);
+  }
+  &:focus-visible {
+    outline-color: var(--code-copy-focus-outline-color);
   }
   @include darkMode {
     --code-copy-hover-background-color: var(--amplify-colors-neutral-20);
     --code-copy-focus-background-color: var(--amplify-colors-neutral-20);
-    --code-copy-focus-box-shadow: var(--amplify-colors-neutral-100);
   }
 }
diff --git a/src/styles/feedback.scss b/src/styles/feedback.scss
index 97b526cfb48..6b1b9ae9830 100644
--- a/src/styles/feedback.scss
+++ b/src/styles/feedback.scss
@@ -1,5 +1,6 @@
 .feedback {
-  padding-top: var(--amplify-space-xl);
+  padding: var(--amplify-space-xl) var(--amplify-space-xxxs)
+    var(--amplify-space-xxxs);
   overflow: hidden;
 }
 
@@ -12,7 +13,6 @@
   font-size: 0.9rem;
   justify-content: center;
   gap: 0;
-  // pointer-events: none;
   visibility: hidden;
   &-no {
     &:hover {
diff --git a/src/styles/gen-switcher.scss b/src/styles/gen-switcher.scss
index 4a302d3866e..dc17b9734f6 100644
--- a/src/styles/gen-switcher.scss
+++ b/src/styles/gen-switcher.scss
@@ -5,10 +5,8 @@
   &:hover {
     background-color: var(--amplify-colors-primary-90);
   }
-  &:focus {
-    box-shadow: none;
-    outline: 2px solid var(--amplify-colors-white);
-    outline-offset: 2px;
+  &:focus-visible {
+    outline-color: var(--amplify-colors-white);
   }
   .popover-icon {
     font-size: var(--amplify-font-sizes-xs);
diff --git a/src/styles/overview.scss b/src/styles/overview.scss
index ac1390e2b9a..f7eb6e386cf 100644
--- a/src/styles/overview.scss
+++ b/src/styles/overview.scss
@@ -3,6 +3,7 @@
   &__link {
     color: inherit;
     text-decoration: none;
+    border-radius: var(--amplify-radii-small);
 
     &:hover &__card__title {
       color: var(--amplify-colors-primary-60);
diff --git a/src/themes/baseTheme.ts b/src/themes/baseTheme.ts
index aca3d3b66e8..d6f68a285f0 100644
--- a/src/themes/baseTheme.ts
+++ b/src/themes/baseTheme.ts
@@ -34,13 +34,20 @@ export const baseTheme = createTheme({
         _focus: {
           borderColor: { value: 'transparent' },
           boxShadow: {
-            value: '0 0 0 2px var(--amplify-colors-border-focus)'
+            value: 'none'
           }
         },
         link: {
           _focus: {
             boxShadow: {
-              value: '0 0 0 2px var(--amplify-colors-border-focus)'
+              value: 'none'
+            }
+          }
+        },
+        primary: {
+          _focus: {
+            boxShadow: {
+              value: 'none'
             }
           }
         },
diff --git a/src/themes/gen1Theme.ts b/src/themes/gen1Theme.ts
index b9ac33aafae..d1e468894fc 100644
--- a/src/themes/gen1Theme.ts
+++ b/src/themes/gen1Theme.ts
@@ -16,10 +16,7 @@ export const gen1Theme = createTheme(
             },
             _focus: {
               backgroundColor: { value: '{colors.primary.20}' },
-              color: { value: '{colors.font.primary}' },
-              boxShadow: {
-                value: '0 0 0 2px var(--amplify-colors-border-focus)'
-              }
+              color: { value: '{colors.font.primary}' }
             },
             _hover: {
               backgroundColor: { value: '{colors.primary.20}' },