diff --git a/libs/components/src/form-field/form-field.component.html b/libs/components/src/form-field/form-field.component.html
index c4fd018b3ba..db3f29fc1ea 100644
--- a/libs/components/src/form-field/form-field.component.html
+++ b/libs/components/src/form-field/form-field.component.html
@@ -85,8 +85,8 @@
     <div
       class="tw-gap-1 tw-flex tw-min-h-[1.85rem] tw-border-0 tw-border-solid"
       [ngClass]="{
-        'tw-border-secondary-300/50 tw-border-b tw-pb-[2px]': !disableReadOnlyBorder,
-        'tw-border-transparent tw-pb-[3px]': disableReadOnlyBorder,
+        'tw-border-secondary-300/50 tw-border-b tw-pb-[2px]': !disableReadOnlyBorder(),
+        'tw-border-transparent tw-pb-[3px]': disableReadOnlyBorder(),
       }"
     >
       <div
diff --git a/libs/components/src/form-field/form-field.component.ts b/libs/components/src/form-field/form-field.component.ts
index cf50ad2f5e1..929e8ca1cf6 100644
--- a/libs/components/src/form-field/form-field.component.ts
+++ b/libs/components/src/form-field/form-field.component.ts
@@ -9,10 +9,10 @@ import {
   ElementRef,
   HostBinding,
   HostListener,
-  Input,
   ViewChild,
   signal,
   input,
+  model,
 } from "@angular/core";
 
 import { I18nPipe } from "@bitwarden/ui-common";
@@ -42,10 +42,7 @@ export class BitFormFieldComponent implements AfterContentChecked {
   readonly disableMargin = input(false, { transform: booleanAttribute });
 
   /** If `true`, remove the bottom border for `readonly` inputs */
-  // TODO: Skipped for migration because:
-  //  Your application code writes to the input. This prevents migration.
-  @Input({ transform: booleanAttribute })
-  disableReadOnlyBorder = false;
+  disableReadOnlyBorder = model(false);
 
   protected prefixHasChildren = signal(false);
   protected suffixHasChildren = signal(false);
diff --git a/libs/components/src/form-field/password-input-toggle.directive.ts b/libs/components/src/form-field/password-input-toggle.directive.ts
index dfe6e10777f..0eeeca7362f 100644
--- a/libs/components/src/form-field/password-input-toggle.directive.ts
+++ b/libs/components/src/form-field/password-input-toggle.directive.ts
@@ -5,7 +5,7 @@ import {
   Host,
   HostBinding,
   HostListener,
-  Input,
+  model,
   OnChanges,
   Output,
 } from "@angular/core";
@@ -18,14 +18,15 @@ import { BitFormFieldComponent } from "./form-field.component";
 
 @Directive({
   selector: "[bitPasswordInputToggle]",
+  host: {
+    "[attr.aria-pressed]": "toggled()",
+  },
 })
 export class BitPasswordInputToggleDirective implements AfterContentInit, OnChanges {
   /**
    * Whether the input is toggled to show the password.
    */
-  // TODO: Skipped for migration because:
-  //  Your application code writes to the input. This prevents migration.
-  @HostBinding("attr.aria-pressed") @Input() toggled = false;
+  toggled = model(false);
   @Output() toggledChange = new EventEmitter<boolean>();
 
   @HostBinding("attr.title") title = this.i18nService.t("toggleVisibility");
@@ -35,8 +36,8 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
    * Click handler to toggle the state of the input type.
    */
   @HostListener("click") onClick() {
-    this.toggled = !this.toggled;
-    this.toggledChange.emit(this.toggled);
+    this.toggled.update((toggled) => !toggled);
+    this.toggledChange.emit(this.toggled());
 
     this.update();
   }
@@ -48,7 +49,7 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
   ) {}
 
   get icon() {
-    return this.toggled ? "bwi-eye-slash" : "bwi-eye";
+    return this.toggled() ? "bwi-eye-slash" : "bwi-eye";
   }
 
   ngOnChanges(): void {
@@ -57,7 +58,7 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
 
   ngAfterContentInit(): void {
     if (this.formField.input?.type) {
-      this.toggled = this.formField.input.type !== "password";
+      this.toggled.set(this.formField.input.type !== "password");
     }
     this.button.icon = this.icon;
   }
@@ -65,8 +66,8 @@ export class BitPasswordInputToggleDirective implements AfterContentInit, OnChan
   private update() {
     this.button.icon = this.icon;
     if (this.formField.input?.type != null) {
-      this.formField.input.type = this.toggled ? "text" : "password";
-      this.formField.input.spellcheck = this.toggled ? false : undefined;
+      this.formField.input.type = this.toggled() ? "text" : "password";
+      this.formField.input.spellcheck = this.toggled() ? false : undefined;
     }
   }
 }
diff --git a/libs/components/src/form-field/prefix.directive.ts b/libs/components/src/form-field/prefix.directive.ts
index e468572561a..58fb5f8970a 100644
--- a/libs/components/src/form-field/prefix.directive.ts
+++ b/libs/components/src/form-field/prefix.directive.ts
@@ -1,16 +1,15 @@
-import { Directive, HostBinding, Input, OnInit, Optional } from "@angular/core";
+import { Directive, input, OnInit, Optional } from "@angular/core";
 
 import { BitIconButtonComponent } from "../icon-button/icon-button.component";
 
 @Directive({
   selector: "[bitPrefix]",
+  host: {
+    "[attr.class]": "classList()",
+  },
 })
 export class BitPrefixDirective implements OnInit {
-  // TODO: Skipped for migration because:
-  //  Accessor inputs cannot be migrated as they are too complex.
-  @HostBinding("class") @Input() get classList() {
-    return ["tw-text-muted"];
-  }
+  readonly classList = input(["tw-text-muted"]);
 
   constructor(@Optional() private iconButtonComponent: BitIconButtonComponent) {}
 
diff --git a/libs/components/src/form-field/suffix.directive.ts b/libs/components/src/form-field/suffix.directive.ts
index 6c09c7580ae..6d0118723bf 100644
--- a/libs/components/src/form-field/suffix.directive.ts
+++ b/libs/components/src/form-field/suffix.directive.ts
@@ -1,16 +1,15 @@
-import { Directive, HostBinding, Input, OnInit, Optional } from "@angular/core";
+import { Directive, input, OnInit, Optional } from "@angular/core";
 
 import { BitIconButtonComponent } from "../icon-button/icon-button.component";
 
 @Directive({
   selector: "[bitSuffix]",
+  host: {
+    "[attr.class]": "classList()",
+  },
 })
 export class BitSuffixDirective implements OnInit {
-  // TODO: Skipped for migration because:
-  //  Accessor inputs cannot be migrated as they are too complex.
-  @HostBinding("class") @Input() get classList() {
-    return ["tw-text-muted"];
-  }
+  readonly classList = input(["tw-text-muted"]);
 
   constructor(@Optional() private iconButtonComponent: BitIconButtonComponent) {}
 
diff --git a/libs/vault/src/cipher-view/read-only-cipher-card/read-only-cipher-card.component.ts b/libs/vault/src/cipher-view/read-only-cipher-card/read-only-cipher-card.component.ts
index 8f6b9954a9f..335297c95b7 100644
--- a/libs/vault/src/cipher-view/read-only-cipher-card/read-only-cipher-card.component.ts
+++ b/libs/vault/src/cipher-view/read-only-cipher-card/read-only-cipher-card.component.ts
@@ -19,7 +19,7 @@ export class ReadOnlyCipherCardComponent implements AfterViewInit {
       // Delay model update until next change detection cycle
       setTimeout(() => {
         if (this.formFields) {
-          this.formFields.last.disableReadOnlyBorder = true;
+          this.formFields.last.disableReadOnlyBorder.set(true);
         }
       });
     }