diff --git a/src/reusecore/Button/btn.style.js b/src/reusecore/Button/btn.style.js
index ce5c981a88e96b..1d53f26ab0612e 100644
--- a/src/reusecore/Button/btn.style.js
+++ b/src/reusecore/Button/btn.style.js
@@ -18,12 +18,18 @@ const ButtonStyle = styled.button`
     color: ${props => props.theme.white };
     background-color: #00B39F;
     z-index: 999;
-    &:hover,
-    &:focus {
+    &:hover {
         color: white;
         background: ${props => props.theme.activeColor}; 
         box-shadow: 0 2px 10px ${props => props.theme.whiteFourToBlackFour};
     }
+    &:focus-visible {
+        outline: 3px solid ${props => props.theme.secondaryColor};
+        outline-offset: 3px;
+    }
+    &:focus:not(:focus-visible) {
+        outline: none;
+    }
     &:active{
         box-shadow: 0 2px 10px ${props => props.theme.blackFourToWhiteFour};
         transform: scale(0.98);