diff --git a/components/sesyon/login-provider.js b/components/sesyon/login-provider.js
index 979e391..ad678a0 100644
--- a/components/sesyon/login-provider.js
+++ b/components/sesyon/login-provider.js
@@ -17,7 +17,7 @@ export default function LoginProvider({id, title, width, height, callbackUrl}) {
 
   return (
     <Link passHref href='/api/auth/signin'>
-      <Button variant='outlined' color='inherit' startIcon={
+      <Button variant='outlined' color='info' startIcon={
         <Image
           width={width}
           height={height}
diff --git a/pages/_app.js b/pages/_app.js
index bbe1dc3..2005fd9 100644
--- a/pages/_app.js
+++ b/pages/_app.js
@@ -28,6 +28,9 @@ const getDesignTokens = mode => ({
         primary: green,
         secondary: red,
         divider: green[200],
+        info: {
+          main: grey[900]
+        },
         text: {
           primary: grey[900],
           secondary: grey[800],
@@ -37,6 +40,9 @@ const getDesignTokens = mode => ({
         // Palette values for dark mode
         primary: green,
         secondary: red,
+        info: {
+          main: '#fff'
+        },
         divider: green[700],
         background: {
           default: '#082211',