diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fa-button.scss b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fa-button.scss
new file mode 100644
index 0000000..cbdf96c
--- /dev/null
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fa-button.scss
@@ -0,0 +1,16 @@
+.fa-button {
+  padding: 16px 16px 13px 16px;
+  border-radius: 8px;
+  background-color: #083b94;
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  font-size: 18px;
+  font-weight: 600;
+  text-align: center;
+  color: #fff;
+
+  &:hover {
+    cursor: pointer;
+  }
+
+  width: 400px;
+}
\ No newline at end of file
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.scss b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.scss
index c8c92b4..e69de29 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.scss
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.scss
@@ -1,15 +0,0 @@
-.fa-button {
-  padding: 16px 16px 13px 16px;
-  border-radius: 8px;
-  background-color: #083b94;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
-    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-  font-size: 18px;
-  font-weight: 600;
-  text-align: center;
-  color: #fff;
-  &:hover {
-    cursor: pointer;
-  }
-  width: 400px;
-}
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.ts b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.ts
index ea09be6..3db385a 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.ts
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-login.button/fusion-auth-login-button.component.ts
@@ -4,7 +4,7 @@ import { FusionAuthService } from '../../fusion-auth.service';
 @Component({
   selector: 'fa-login',
   templateUrl: './fusion-auth-login-button.component.html',
-  styleUrls: ['./fusion-auth-login-button.component.scss'],
+  styleUrls: ['../fa-button.scss', './fusion-auth-login-button.component.scss']
 })
 export class FusionAuthLoginButtonComponent {
   @Input() state: string | undefined;
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.html b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.html
index 59fd407..76d66b6 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.html
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.html
@@ -1,3 +1,3 @@
-<button class="fa-logout-button" (click)="logout()">
-  <span>logout</span>
-</button>
+<button class="fa-button" (click)="logout()">
+  <span>Logout</span>
+</button>
\ No newline at end of file
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.scss b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.scss
index f1d17b3..e69de29 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.scss
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.scss
@@ -1,14 +0,0 @@
-.fa-logout-button {
-  padding: 7px 13px;
-  border-radius: 3px;
-  display: block;
-  border: solid 1px #083b94;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
-    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-  font-size: 12px;
-  text-align: center;
-  color: #083b94;
-  &:hover {
-    cursor: pointer;
-  }
-}
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.ts b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.ts
index 7029d8a..d93015b 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.ts
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-logout.button/fusion-auth-logout-button.component.ts
@@ -4,7 +4,7 @@ import { FusionAuthService } from '../../fusion-auth.service';
 @Component({
   selector: 'fa-logout',
   templateUrl: './fusion-auth-logout-button.component.html',
-  styleUrls: ['./fusion-auth-logout-button.component.scss'],
+  styleUrls: ['../fa-button.scss', './fusion-auth-logout-button.component.scss']
 })
 export class FusionAuthLogoutButtonComponent {
   constructor(private fusionAuth: FusionAuthService) {}
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.scss b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.scss
index a7abbc9..e69de29 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.scss
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.scss
@@ -1,16 +0,0 @@
-.fa-button {
-  padding: 16px 16px 13px 16px;
-  border-radius: 8px;
-  background-color: #083b94;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica,
-    Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
-  font-size: 18px;
-  font-weight: 600;
-  text-align: center;
-  color: #fff;
-  &:hover {
-    cursor: pointer;
-  }
-
-  width: 400px;
-}
diff --git a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.ts b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.ts
index c4efaba..be2b4fb 100644
--- a/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.ts
+++ b/packages/sdk-angular/projects/fusionauth-angular-sdk/src/lib/components/fusionauth-register.button/fusion-auth-register-button.component.ts
@@ -4,7 +4,7 @@ import { FusionAuthService } from '../../fusion-auth.service';
 @Component({
   selector: 'fa-register',
   templateUrl: './fusion-auth-register-button.component.html',
-  styleUrls: ['./fusion-auth-register-button.component.scss'],
+  styleUrls: ['../fa-button.scss', './fusion-auth-register-button.component.scss']
 })
 export class FusionAuthRegisterButtonComponent {
   @Input() state: string | undefined;