diff --git a/src-ui/src/app/components/admin/settings/settings.component.html b/src-ui/src/app/components/admin/settings/settings.component.html
index ce423f9ae..0c71c0dda 100644
--- a/src-ui/src/app/components/admin/settings/settings.component.html
+++ b/src-ui/src/app/components/admin/settings/settings.component.html
@@ -259,11 +259,14 @@
                   <span i18n>Suggestions use</span>
                 </div>
                 <div class="col">
-                  <select class="form-select" formControlName="documentEditingSuggestionSource">
-                    <option [ngValue]="SuggestionSource.ML" i18n>ML</option>
-                    <option [ngValue]="SuggestionSource.AI" i18n>AI</option>
-                    <option [ngValue]="SuggestionSource.Both" i18n>Both</option>
-                  </select>
+                  <div class="btn-group btn-group-sm" role="group">
+                    <input type="radio" class="btn-check" id="suggestionSourceML" [value]="SuggestionSource.ML" formControlName="documentEditingSuggestionSource">
+                    <label class="btn btn-outline-primary" for="suggestionSourceML"><i-bs class="me-1" name="cpu"></i-bs><ng-container i18n>ML</ng-container></label>
+                    <input type="radio" class="btn-check" id="suggestionSourceAI" [value]="SuggestionSource.AI" formControlName="documentEditingSuggestionSource">
+                    <label class="btn btn-outline-primary" for="suggestionSourceAI"><i-bs class="me-1" name="stars"></i-bs><ng-container i18n>AI</ng-container></label>
+                    <input type="radio" class="btn-check" id="suggestionSourceBoth" [value]="SuggestionSource.Both" formControlName="documentEditingSuggestionSource">
+                    <label class="btn btn-outline-primary" for="suggestionSourceBoth"><i-bs name="cpu"></i-bs><i-bs class="me-1" name="stars"></i-bs><ng-container i18n>Both</ng-container></label>
+                  </div>
                 </div>
               </div>
             }
diff --git a/src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.html b/src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.html
index d43b56fbc..f67861ce1 100644
--- a/src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.html
+++ b/src-ui/src/app/components/common/suggestions-dropdown/suggestions-dropdown.component.html
@@ -74,11 +74,11 @@
         <div class="small text-muted mb-2" i18n>Suggest using:</div>
         <div class="form-check">
           <input class="form-check-input" type="checkbox" id="suggestionSourceML" [checked]="useML" [disabled]="useML && !useAI" (change)="toggleSource(SuggestionSource.ML)">
-          <label class="form-check-label" for="suggestionSourceML" i18n>ML</label>
+          <label class="form-check-label" for="suggestionSourceML"><i-bs class="me-1" name="cpu"></i-bs><ng-container i18n>ML</ng-container></label>
         </div>
         <div class="form-check">
           <input class="form-check-input" type="checkbox" id="suggestionSourceAI" [checked]="useAI" [disabled]="useAI && !useML" (change)="toggleSource(SuggestionSource.AI)">
-          <label class="form-check-label" for="suggestionSourceAI" i18n>AI</label>
+          <label class="form-check-label" for="suggestionSourceAI"><i-bs class="me-1" name="stars"></i-bs><ng-container i18n>AI</ng-container></label>
         </div>
       </div>
     </div>
diff --git a/src-ui/src/main.ts b/src-ui/src/main.ts
index dc8d8d3f5..788629ff6 100644
--- a/src-ui/src/main.ts
+++ b/src-ui/src/main.ts
@@ -74,6 +74,7 @@ import {
   clipboardCheckFill,
   clipboardFill,
   clockHistory,
+  cpu,
   creditCard,
   dash,
   dashCircle,
@@ -322,6 +323,7 @@ const icons = {
   clipboardCheckFill,
   clipboardFill,
   clockHistory,
+  cpu,
   cash,
   creditCard,
   dash,