diff --git a/frontend/app/common/angular/BUILD b/frontend/app/common/angular/BUILD
index d695dec40..5440319f8 100644
--- a/frontend/app/common/angular/BUILD
+++ b/frontend/app/common/angular/BUILD
@@ -107,7 +107,7 @@ ts_library(
 )
 
 ts_library(
-    name = "angular_material_legacy_radio",
+    name = "angular_material_radio",
     srcs = [],
     deps = [
         "@npm//@angular/material",
@@ -139,7 +139,7 @@ ts_library(
 )
 
 ts_library(
-    name = "angular_material_legacy_slide_toggle",
+    name = "angular_material_slide_toggle",
     srcs = [],
     deps = [
         "@npm//@angular/material",
diff --git a/frontend/app/components/capture_profile/capture_profile_dialog/BUILD b/frontend/app/components/capture_profile/capture_profile_dialog/BUILD
index 23e02ffe6..dae38d462 100644
--- a/frontend/app/components/capture_profile/capture_profile_dialog/BUILD
+++ b/frontend/app/components/capture_profile/capture_profile_dialog/BUILD
@@ -23,8 +23,8 @@ xprof_ng_module(
         "@org_xprof//frontend/app/common/angular:angular_material_expansion",
         "@org_xprof//frontend/app/common/angular:angular_material_form_field",
         "@org_xprof//frontend/app/common/angular:angular_material_input",
-        "@org_xprof//frontend/app/common/angular:angular_material_legacy_radio",
         "@org_xprof//frontend/app/common/angular:angular_material_legacy_tooltip",
+        "@org_xprof//frontend/app/common/angular:angular_material_radio",
         "@org_xprof//frontend/app/common/angular:angular_material_select",
         "@org_xprof//frontend/app/common/interfaces",
     ],
diff --git a/frontend/app/components/capture_profile/capture_profile_dialog/capture_profile_dialog_module.ts b/frontend/app/components/capture_profile/capture_profile_dialog/capture_profile_dialog_module.ts
index 242d32ac2..b42e89f71 100644
--- a/frontend/app/components/capture_profile/capture_profile_dialog/capture_profile_dialog_module.ts
+++ b/frontend/app/components/capture_profile/capture_profile_dialog/capture_profile_dialog_module.ts
@@ -6,7 +6,7 @@ import {MatButtonModule} from '@angular/material/button';
 import {MatDialogModule} from '@angular/material/dialog';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
-import {MatLegacyRadioModule} from '@angular/material/legacy-radio';
+import {MatRadioModule} from '@angular/material/radio';
 import {MatSelectModule} from '@angular/material/select';
 import {MatLegacyTooltipModule} from '@angular/material/legacy-tooltip';
 import {BrowserModule} from '@angular/platform-browser';
@@ -25,7 +25,7 @@ import {CaptureProfileDialog} from './capture_profile_dialog';
     MatExpansionModule,
     MatFormFieldModule,
     MatInputModule,
-    MatLegacyRadioModule,
+    MatRadioModule,
     MatSelectModule,
     MatLegacyTooltipModule,
   ],
diff --git a/frontend/app/components/op_profile/BUILD b/frontend/app/components/op_profile/BUILD
index 01ad7982b..6877e33b9 100644
--- a/frontend/app/components/op_profile/BUILD
+++ b/frontend/app/components/op_profile/BUILD
@@ -23,9 +23,9 @@ xprof_ng_module(
         "@org_xprof//frontend/app/common/angular:angular_material_form_field",
         "@org_xprof//frontend/app/common/angular:angular_material_icon",
         "@org_xprof//frontend/app/common/angular:angular_material_input",
-        "@org_xprof//frontend/app/common/angular:angular_material_legacy_slide_toggle",
         "@org_xprof//frontend/app/common/angular:angular_material_legacy_slider",
         "@org_xprof//frontend/app/common/angular:angular_material_legacy_tooltip",
+        "@org_xprof//frontend/app/common/angular:angular_material_slide_toggle",
         "@org_xprof//frontend/app/common/interfaces",
         "@org_xprof//frontend/app/components/op_profile/op_table",
         "@org_xprof//frontend/app/services/data_service",
diff --git a/frontend/app/components/op_profile/op_profile_common.scss b/frontend/app/components/op_profile/op_profile_common.scss
index 41cf97653..a7c04bb5a 100644
--- a/frontend/app/components/op_profile/op_profile_common.scss
+++ b/frontend/app/components/op_profile/op_profile_common.scss
@@ -15,7 +15,8 @@
 
 .control-container {
   display: flex;
-  padding-top: 32px;
+  align-items: center;
+  margin-top: 32px;
 }
 
 .control {
diff --git a/frontend/app/components/op_profile/op_profile_module.ts b/frontend/app/components/op_profile/op_profile_module.ts
index 53a3288be..6aae79e6b 100644
--- a/frontend/app/components/op_profile/op_profile_module.ts
+++ b/frontend/app/components/op_profile/op_profile_module.ts
@@ -2,7 +2,7 @@ import {NgModule} from '@angular/core';
 import {MatIconModule} from '@angular/material/icon';
 import {MatFormFieldModule} from '@angular/material/form-field';
 import {MatInputModule} from '@angular/material/input';
-import {MatLegacySlideToggleModule} from '@angular/material/legacy-slide-toggle';
+import {MatSlideToggleModule} from '@angular/material/slide-toggle';
 import {MatLegacySliderModule} from '@angular/material/legacy-slider';
 import {MatLegacyTooltipModule} from '@angular/material/legacy-tooltip';
 
@@ -16,7 +16,7 @@ import {OpTableModule} from './op_table/op_table_module';
     MatFormFieldModule,
     MatInputModule,
     MatLegacySliderModule,
-    MatLegacySlideToggleModule,
+    MatSlideToggleModule,
     OpTableModule,
     MatIconModule,
     MatLegacyTooltipModule,
diff --git a/frontend/styles.scss b/frontend/styles.scss
index a4c62a485..90e8b8484 100644
--- a/frontend/styles.scss
+++ b/frontend/styles.scss
@@ -39,6 +39,8 @@ $theme: mat.define-light-theme(
 @include mat.dialog-theme($theme);
 @include mat.progress-spinner-theme($theme);
 @include mat.progress-bar-theme($theme);
+@include mat.slide-toggle-theme(map-merge($theme, (density: -5)));
+@include mat.radio-theme($theme);
 
 html, body {
   height: 100%;