diff --git a/src/components/button/button.css b/src/components/button/button.css
index 1062748fea9954592d0631726cdbffafbad74d90..1c145975c7f131766caba688165fbd133483423f 100644
--- a/src/components/button/button.css
+++ b/src/components/button/button.css
@@ -1,4 +1,4 @@
-.button {
+.outlined-button {
     cursor: pointer;
     border-radius: 4px;
     padding: .75rem;
diff --git a/src/components/button/button.jsx b/src/components/button/button.jsx
index a85e8e6abd5f5a962ec06eb46661e89d7c5f109d..5f26763bea7e267ba1e2264a2bb47fc6fb69f7e2 100644
--- a/src/components/button/button.jsx
+++ b/src/components/button/button.jsx
@@ -29,7 +29,7 @@ const ButtonComponent = ({
     return (
         <span
             className={classNames(
-                styles.button,
+                styles.outlinedButton,
                 className
             )}
             role="button"