diff --git a/src/app/services/teacherProjectTranslationService.spec.ts b/src/app/services/teacherProjectTranslationService.spec.ts
index d7ddb632fa6..9509e8eb58c 100644
--- a/src/app/services/teacherProjectTranslationService.spec.ts
+++ b/src/app/services/teacherProjectTranslationService.spec.ts
@@ -48,4 +48,19 @@ describe('TeacherProjectTranslationService', () => {
       expect(request.request.body).toEqual({});
     });
   });
+  describe('getTranslationSuggestion()', () => {
+    it('makes a POST request to backend with do not translate tags', () => {
+      service
+        .getTranslationSuggestion('srcLang', 'targetLang', '<span>srcText</span> untagged')
+        .subscribe();
+      const request = http.expectOne(`/api/author/project/translate/suggest`);
+      expect(request.request.method).toEqual('POST');
+      expect(request.request.body).toEqual({
+        srcLang: 'srcLang',
+        targetLang: 'targetLang',
+        srcText:
+          '<span translate="no"><span></span>srcText<span translate="no"></span></span> untagged'
+      });
+    });
+  });
 });
diff --git a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.scss b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.scss
index 2f11ee88776..86ccac6b154 100644
--- a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.scss
+++ b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.scss
@@ -1,21 +1,45 @@
+@reference "tailwindcss";
+
 mat-form-field.translatable-form-field {
   width: 100%;
+
+  .mat-mdc-form-field-bottom-align::before {
+    @apply -ms-2;
+  }
 }
 
 .translatable {
   .mat-mdc-form-field-hint-wrapper {
     position: relative;
-    margin: -20px 0 4px;
+    margin: 0;
+    padding: 0;
     flex-direction: column;
     align-items: flex-start;
   }
 
+  .mat-mdc-form-field-bottom-align::before {
+    display: none;
+  }
+
   .mat-mdc-form-field-hint-spacer {
-  display: none;
+    display: none;
   }
 
   .source-language {
-    padding: 4px 8px;
-    margin-top: 4px;
+    @apply px-2 py-1;
   }
 }
+
+.translation-tools {
+  @apply flex flex-wrap items-center gap-2 text-sm;
+}
+
+.translation-link {
+  @apply flex items-center gap-1;
+
+  .mat-icon {
+    font-size: inherit;
+    height: 1rem;
+    width: 1rem;
+  }
+}
\ No newline at end of file
diff --git a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts
index e58bde1ec7f..2197ca43032 100644
--- a/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts
+++ b/src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts
@@ -1,12 +1,15 @@
+import { ConfigService } from '../../../services/configService';
+import { copy } from '../../../common/object/object';
+import { generateRandomKey } from '../../../common/string/string';
 import { Input, Signal, Output, computed, Directive } from '@angular/core';
-import { Subject, Subscription, debounceTime } from 'rxjs';
 import { Language } from '../../../../../app/domain/language';
+import { MatDialog, MatDialogRef } from '@angular/material/dialog';
+import { Subject, Subscription, debounceTime } from 'rxjs';
 import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService';
 import { TeacherProjectService } from '../../../services/teacherProjectService';
-import { generateRandomKey } from '../../../common/string/string';
 import { toObservable } from '@angular/core/rxjs-interop';
 import { Translations } from '../../../../../app/domain/translations';
-import { copy } from '../../../common/object/object';
+import { TranslationSuggestionsDialogComponent } from '../translation-suggestions-dialog/translation-suggestions-dialog.component';
 
 @Directive()
 export abstract class AbstractTranslatableFieldComponent {
@@ -27,6 +30,8 @@ export abstract class AbstractTranslatableFieldComponent {
   protected translationText: string;
   protected translationTextChanged: Subject<string> = new Subject<string>();
   constructor(
+    protected configService: ConfigService,
+    protected dialog: MatDialog,
     protected projectService: TeacherProjectService,
     protected projectTranslationService: TeacherProjectTranslationService
   ) {}
@@ -71,8 +76,57 @@ export abstract class AbstractTranslatableFieldComponent {
   }
 
   protected saveTranslationText(text: string): void {
+    if (this.i18nId === undefined) {
+      this.createI18NField();
+    }
     const currentTranslations = copy(this.projectTranslationService.currentTranslations());
     currentTranslations[this.i18nId] = { value: text, modified: new Date().getTime() };
     this.projectTranslationService.saveCurrentTranslations(currentTranslations).subscribe();
   }
+
+  protected isTranslationServiceEnabled(): boolean {
+    return this.configService.getConfigParam('translationServiceEnabled');
+  }
+
+  protected async translateText(event: Event): Promise<void> {
+    event.preventDefault();
+    if (this.translationText) {
+      this.openDialog();
+    } else {
+      this.projectTranslationService
+        .getTranslationSuggestion(
+          this.defaultLanguage.language,
+          this.currentLanguage().language,
+          this.content[this.key]
+        )
+        .subscribe({
+          next: (translation) => this.saveTranslationText(translation),
+          error: () =>
+            alert(
+              $localize`There was an error translating the text. Please contact WISE staff if the error persists.`
+            )
+        });
+    }
+  }
+
+  private openDialog(): void {
+    const dialogRef = this.createDialogRef();
+    dialogRef.afterClosed().subscribe((result: string) => {
+      if (result) {
+        this.saveTranslationText(result);
+      }
+    });
+  }
+
+  private createDialogRef(): MatDialogRef<TranslationSuggestionsDialogComponent> {
+    return this.dialog.open(TranslationSuggestionsDialogComponent, {
+      panelClass: 'dialog-md',
+      data: {
+        defaultLanguage: this.defaultLanguage.language,
+        currentLanguage: this.currentLanguage().language,
+        defaultLanguageContent: this.content[this.key],
+        currentLanguageContent: this.translationText
+      }
+    });
+  }
 }
diff --git a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.spec.ts b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.spec.ts
index 56b20343fe7..8d3dd60f57c 100644
--- a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.spec.ts
+++ b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.spec.ts
@@ -1,4 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ConfigService } from '../../../services/configService';
 import { TranslatableAssetChooserComponent } from './translatable-asset-chooser.component';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -21,7 +22,7 @@ describe('TranslatableAssetChooserComponent', () => {
         StudentTeacherCommonServicesModule,
         TranslatableAssetChooserComponent
       ],
-      providers: [TeacherProjectService, TeacherProjectTranslationService]
+      providers: [ConfigService, TeacherProjectService, TeacherProjectTranslationService]
     });
     spyOn(TestBed.inject(TeacherProjectService), 'getLocale').and.returnValue(
       new ProjectLocale({ default: 'en-US' })
diff --git a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts
index 610a9f945bf..390790affb1 100644
--- a/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts
+++ b/src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts
@@ -1,4 +1,5 @@
 import { Component, Input } from '@angular/core';
+import { ConfigService } from '../../../services/configService';
 import { MatIconModule } from '@angular/material/icon';
 import { MatButtonModule } from '@angular/material/button';
 import { MatTooltipModule } from '@angular/material/tooltip';
@@ -22,11 +23,12 @@ export class TranslatableAssetChooserComponent extends AbstractTranslatableField
   };
 
   constructor(
-    private dialog: MatDialog,
+    protected configService: ConfigService,
+    protected dialog: MatDialog,
     protected projectService: TeacherProjectService,
     protected projectTranslationService: TeacherProjectTranslationService
   ) {
-    super(projectService, projectTranslationService);
+    super(configService, dialog, projectService, projectTranslationService);
   }
 
   protected chooseAsset(): void {
diff --git a/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.html b/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.html
index 0e418991fa8..ef89f7a2f34 100644
--- a/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.html
+++ b/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.html
@@ -11,9 +11,17 @@
     @if (hint) {
       <mat-hint>{{ hint }}</mat-hint>
     }
-    <mat-hint class="source-language selected-bg-bg">
-      <strong><mat-icon>translate</mat-icon> {{ defaultLanguage.language }}:</strong>
-      {{ content[key] }}
+    <mat-hint class="translation-tools mt-1 mb-2">
+      <div class="source-language selected-bg-bg">
+        <strong><mat-icon>translate</mat-icon> {{ defaultLanguage.language }}:</strong>
+        {{ content[key] }}
+      </div>
+      @if (content[key] && isTranslationServiceEnabled()) {
+        <span class="translation-link">
+          <mat-icon class="primary align-middle">auto_awesome</mat-icon>
+          <a href="#" role="button" (click)="translateText($event)" i18n>Translate with AI</a>
+        </span>
+      }
     </mat-hint>
   </mat-form-field>
 } @else {
diff --git a/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.spec.ts b/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.spec.ts
index de8a10a8ef8..913b95b8c7b 100644
--- a/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.spec.ts
+++ b/src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.spec.ts
@@ -1,4 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ConfigService } from '../../../services/configService';
 import { MockProviders } from 'ng-mocks';
 import { ProjectLocale } from '../../../../../app/domain/projectLocale';
 import { TeacherProjectService } from '../../../services/teacherProjectService';
@@ -12,7 +13,9 @@ describe('TranslatableInputComponent', () => {
   beforeEach(() => {
     TestBed.configureTestingModule({
       imports: [TranslatableInputComponent],
-      providers: [MockProviders(TeacherProjectService, TeacherProjectTranslationService)]
+      providers: [
+        MockProviders(ConfigService, TeacherProjectService, TeacherProjectTranslationService)
+      ]
     });
     const projectService = TestBed.inject(TeacherProjectService);
     spyOn(projectService, 'getLocale').and.returnValue(new ProjectLocale({ default: 'en-US' }));
diff --git a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html
index 900e80f181f..5378f0fdd91 100644
--- a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html
+++ b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html
@@ -2,7 +2,7 @@
   <mat-tab-group mat-stretch-tabs="false">
     <mat-tab label="{{ currentLanguage().language }}">
       <ng-template matTabContent>
-        <div class="translation-tools">
+        <div class="translation-tools my-2">
           <button
             class="enable-in-translation"
             mat-stroked-button
@@ -12,6 +12,12 @@
           >
             Copy content from {{ defaultLanguage.language }}
           </button>
+          @if (content[key] && isTranslationServiceEnabled()) {
+            <span class="translation-link">
+              <mat-icon class="primary align-middle">auto_awesome</mat-icon>
+              <a href="#" role="button" (click)="translateText($event)" i18n>Translate with AI</a>
+            </span>
+          }
         </div>
         <wise-authoring-tinymce-editor
           [language]="currentLanguage()"
@@ -22,7 +28,7 @@
     </mat-tab>
     <mat-tab label="{{ defaultLanguage.language }}">
       <ng-template matTabContent>
-        <div class="translation-tools flex flex-row justify-start items-center gap-2">
+        <div class="translation-tools my-2">
           <span class="info mat-caption" i18n
             >Note: Editing is disabled. Please switch back to {{ defaultLanguage.language }} if you
             want to edit.</span
diff --git a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts
index 40fddaf4437..ab0eb4690dc 100644
--- a/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts
+++ b/src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts
@@ -6,12 +6,20 @@ import { insertWiseLinks, replaceWiseLinks } from '../../../common/wise-link/wis
 import { ConfigService } from '../../../services/configService';
 import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService';
 import { TeacherProjectService } from '../../../services/teacherProjectService';
+import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
 
 @Component({
-  imports: [MatButtonModule, MatTabsModule, WiseAuthoringTinymceEditorComponent],
+  imports: [
+    MatButtonModule,
+    MatDialogModule,
+    MatIconModule,
+    MatTabsModule,
+    WiseAuthoringTinymceEditorComponent
+  ],
   selector: 'translatable-rich-text-editor',
-  styles: ['.translation-tools { padding: 8px 0; }'],
+  styleUrl: '../abstract-translatable-field/abstract-translatable-field.component.scss',
   templateUrl: './translatable-rich-text-editor.component.html'
 })
 export class TranslatableRichTextEditorComponent extends AbstractTranslatableFieldComponent {
@@ -19,11 +27,12 @@ export class TranslatableRichTextEditorComponent extends AbstractTranslatableFie
   @ViewChild(MatTabGroup) private tabs: MatTabGroup;
 
   constructor(
-    private configService: ConfigService,
+    protected configService: ConfigService,
+    protected dialog: MatDialog,
     protected projectService: TeacherProjectService,
     protected projectTranslationService: TeacherProjectTranslationService
   ) {
-    super(projectService, projectTranslationService);
+    super(configService, dialog, projectService, projectTranslationService);
   }
 
   ngOnChanges(): void {
diff --git a/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.html b/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.html
index 5a71253a018..3a2bfb92ea4 100644
--- a/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.html
+++ b/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.html
@@ -12,9 +12,17 @@
     @if (hint) {
       <mat-hint>{{ hint }}</mat-hint>
     }
-    <mat-hint class="source-language selected-bg-bg">
-      <strong><mat-icon>translate</mat-icon> {{ defaultLanguage.language }}:</strong>
-      {{ content[key] }}
+    <mat-hint class="translation-tools mt-1 mb-2">
+      <div class="source-language selected-bg-bg">
+        <strong><mat-icon>translate</mat-icon> {{ defaultLanguage.language }}:</strong>
+        {{ content[key] }}
+      </div>
+      @if (content[key] && isTranslationServiceEnabled()) {
+        <span class="translation-link">
+          <mat-icon class="primary align-middle">auto_awesome</mat-icon>
+          <a href="#" role="button" (click)="translateText($event)" i18n>Translate with AI</a>
+        </span>
+      }
     </mat-hint>
   </mat-form-field>
 } @else {
diff --git a/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.spec.ts b/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.spec.ts
index 11aad65d97f..5aaf3f50f86 100644
--- a/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.spec.ts
+++ b/src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.spec.ts
@@ -1,4 +1,5 @@
 import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { ConfigService } from '../../../services/configService';
 import { TranslatableTextareaComponent } from './translatable-textarea.component';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
@@ -19,7 +20,7 @@ describe('TranslatableTextareaComponent', () => {
         StudentTeacherCommonServicesModule,
         TranslatableTextareaComponent
       ],
-      providers: [TeacherProjectTranslationService, TeacherProjectService]
+      providers: [ConfigService, TeacherProjectTranslationService, TeacherProjectService]
     });
     spyOn(TestBed.inject(TeacherProjectService), 'getLocale').and.returnValue(
       new ProjectLocale({ default: 'en-US' })
diff --git a/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html
new file mode 100644
index 00000000000..ef1cc80dc74
--- /dev/null
+++ b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html
@@ -0,0 +1,18 @@
+<h2 mat-dialog-title i18n>Replace Translation</h2>
+<mat-divider />
+<mat-dialog-content class="!my-4">
+  <p class="font-medium" i18n>{{ this.data.defaultLanguage }} text:</p>
+  <p class="text-sm px-2">{{ this.data.defaultLanguageContent }}</p>
+  <p class="font-medium" i18n>{{ this.data.currentLanguage }} text (current translation):</p>
+  <p class="text-sm px-2">{{ this.data.currentLanguageContent }}</p>
+  <p class="font-medium" i18n>{{ this.data.currentLanguage }} text (AI suggested translation):</p>
+  <p class="text-sm px-2">{{ this.translation }}</p>
+  <p class="pt-2 font-medium" i18n>
+    Do you want to replace the current translation with the AI suggested translation?
+  </p>
+</mat-dialog-content>
+<mat-divider />
+<mat-dialog-actions align="end">
+  <button mat-button (click)="onClose(false)" i18n>Cancel</button>
+  <button mat-flat-button color="primary" (click)="onClose(true)" i18n>Replace</button>
+</mat-dialog-actions>
diff --git a/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.scss b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.scss
new file mode 100644
index 00000000000..2991245a003
--- /dev/null
+++ b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.scss
@@ -0,0 +1,7 @@
+.text-content {
+  margin-left: 15px;
+}
+
+.replace-translation {
+  margin-top: 20px;
+}
\ No newline at end of file
diff --git a/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.spec.ts b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.spec.ts
new file mode 100644
index 00000000000..5a129a2df31
--- /dev/null
+++ b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.spec.ts
@@ -0,0 +1,35 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService';
+import { TranslationSuggestionsDialogComponent } from './translation-suggestions-dialog.component';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MockProvider } from 'ng-mocks';
+import { of } from 'rxjs';
+
+describe('TranslationSuggestionsDialogComponent', () => {
+  let component: TranslationSuggestionsDialogComponent;
+  let fixture: ComponentFixture<TranslationSuggestionsDialogComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [TranslationSuggestionsDialogComponent],
+      providers: [
+        MockProvider(TeacherProjectTranslationService),
+        { provide: MAT_DIALOG_DATA, useValue: {} },
+        { provide: MatDialogRef, useValue: {} }
+      ]
+    }).compileComponents();
+
+    spyOn(
+      TestBed.inject(TeacherProjectTranslationService),
+      'getTranslationSuggestion'
+    ).and.returnValue(of('Example translated text'));
+
+    fixture = TestBed.createComponent(TranslationSuggestionsDialogComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.ts b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.ts
new file mode 100644
index 00000000000..ce4ac16ebb7
--- /dev/null
+++ b/src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.ts
@@ -0,0 +1,54 @@
+import { Component, inject } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { MatButtonModule } from '@angular/material/button';
+import { MAT_DIALOG_DATA, MatDialogModule, MatDialogRef } from '@angular/material/dialog';
+import { MatDividerModule } from '@angular/material/divider';
+import { MatInputModule } from '@angular/material/input';
+import { TeacherProjectTranslationService } from '../../../services/teacherProjectTranslationService';
+
+interface TranslationSuggestionsDialogData {
+  defaultLanguage: string;
+  currentLanguage: string;
+  defaultLanguageContent: string;
+  currentLanguageContent?: string;
+}
+
+@Component({
+  imports: [MatDividerModule, MatInputModule, FormsModule, MatButtonModule, MatDialogModule],
+  selector: 'translation-suggestions-dialog',
+  styles: [
+    `
+      .mat-divider {
+        margin: 0;
+      }
+    `
+  ],
+  templateUrl: './translation-suggestions-dialog.component.html'
+})
+export class TranslationSuggestionsDialogComponent {
+  readonly dialogRef = inject(MatDialogRef<TranslationSuggestionsDialogComponent>);
+  readonly data = inject<TranslationSuggestionsDialogData>(MAT_DIALOG_DATA);
+  protected translation;
+
+  constructor(protected projectTranslationService: TeacherProjectTranslationService) {
+    this.generateTranslationSuggestion();
+  }
+
+  private generateTranslationSuggestion(): void {
+    this.projectTranslationService
+      .getTranslationSuggestion(
+        this.data.defaultLanguage,
+        this.data.currentLanguage,
+        this.data.defaultLanguageContent
+      )
+      .subscribe({
+        next: (suggestedTranslation) => (this.translation = suggestedTranslation),
+        error: () =>
+          alert($localize`There was an error translating the text. Please talk to WISE staff.`)
+      });
+  }
+
+  protected onClose(saveTranslation: boolean): void {
+    this.dialogRef.close(saveTranslation && this.translation);
+  }
+}
diff --git a/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.html b/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.html
index 593078a7cb5..08e877460c4 100644
--- a/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.html
+++ b/src/assets/wise5/components/animation/animation-authoring/animation-authoring.component.html
@@ -105,7 +105,7 @@
   let isLast = $last
 ) {
   <div class="object-container">
-    <div class="flex flex-row justify-start items-center">
+    <div class="flex flex-row justify-start">
       <div>
         <mat-radio-group
           [(ngModel)]="object.type"
@@ -121,7 +121,7 @@
         </mat-radio-group>
       </div>
       @if (object.type === 'image') {
-        <div class="object-image-input-container flex flex-row justify-start items-center">
+        <div class="object-image-input-container flex flex-row justify-start">
           <translatable-input
             [content]="object"
             key="image"
@@ -215,7 +215,7 @@
       </div>
     }
     @if (object.type === 'image') {
-      <div class="flex flex-row justify-start items-center">
+      <div class="flex flex-row justify-start">
         <translatable-input
           [content]="object"
           key="imageMovingLeft"
@@ -312,7 +312,7 @@
         let isFirst = $first;
         let isLast = $last
       ) {
-        <div class="data-point-container flex flex-row flex-wrap justify-start items-center">
+        <div class="data-point-container flex flex-row flex-wrap justify-start">
           <mat-form-field class="data-point-input">
             <mat-label i18n>Time</mat-label>
             <input
diff --git a/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.html b/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.html
index 8b1c54d9712..39c64b0e20a 100644
--- a/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.html
+++ b/src/assets/wise5/components/conceptMap/concept-map-authoring/concept-map-authoring.component.html
@@ -3,7 +3,7 @@
     [componentContent]="componentContent"
     (promptChangedEvent)="promptChanged($event)"
   />
-  <div class="flex flex-row items-center gap-2">
+  <div class="flex flex-row gap-2">
     <translatable-input
       [content]="componentContent"
       key="background"
diff --git a/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.html b/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.html
index e56d8feeea9..0dd2f3b23d5 100644
--- a/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.html
+++ b/src/assets/wise5/components/draw/draw-authoring/draw-authoring.component.html
@@ -2,7 +2,7 @@
   [componentContent]="componentContent"
   (promptChangedEvent)="promptChanged($event)"
 />
-<div class="flex flex-row items-center gap-2">
+<div class="flex flex-row gap-2">
   <translatable-input
     [content]="componentContent"
     key="background"
diff --git a/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.html b/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.html
index 0368e40783f..fbfe09f8f12 100644
--- a/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.html
+++ b/src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.html
@@ -2,7 +2,7 @@
   [componentContent]="componentContent"
   (promptChangedEvent)="promptChanged($event)"
 />
-<div class="flex flex-row flex-wrap items-center gap-2">
+<div class="flex flex-row flex-wrap items-start gap-2">
   <translatable-input
     [content]="componentContent"
     key="title"
@@ -40,7 +40,7 @@
     />
   </mat-form-field>
 </div>
-<div class="flex flex-row flex-wrap items-center gap-2">
+<div class="flex flex-row flex-wrap items-start gap-2">
   <span i18n>X Axis</span>
   <translatable-input
     [content]="componentContent.xAxis.title"
@@ -180,7 +180,7 @@
 </div>
 @if (enableMultipleYAxes) {
   @for (y of [].constructor(componentContent.yAxis.length); track y; let yAxisIndex = $index) {
-    <div class="flex flex-row flex-wrap items-center gap-2">
+    <div class="flex flex-row flex-wrap gap-2">
       <span i18n>Y Axis</span>
       <translatable-input
         [content]="componentContent.yAxis[yAxisIndex].title"
@@ -298,7 +298,7 @@
     </mat-checkbox>
   </div>
 }
-<div class="flex flex-row items-center">
+<div class="flex flex-row">
   <translatable-input
     [content]="componentContent"
     key="backgroundImage"
@@ -413,7 +413,7 @@
 }
 @for (series of componentContent.series; track series; let seriesIndex = $index) {
   <div class="series">
-    <div class="flex flex-row flex-wrap items-center gap-2">
+    <div class="flex flex-row flex-wrap gap-2">
       <translatable-input
         [content]="series"
         key="name"
diff --git a/src/assets/wise5/components/label/label-authoring/label-authoring.component.html b/src/assets/wise5/components/label/label-authoring/label-authoring.component.html
index daa7fac1ce2..11c75b34b63 100644
--- a/src/assets/wise5/components/label/label-authoring/label-authoring.component.html
+++ b/src/assets/wise5/components/label/label-authoring/label-authoring.component.html
@@ -2,7 +2,7 @@
   [componentContent]="componentContent"
   (promptChangedEvent)="promptChanged($event)"
 />
-<div class="flex flex-row items-center justify-start">
+<div class="flex flex-row justify-start">
   <translatable-input
     [content]="componentContent"
     key="backgroundImage"
diff --git a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
index c03fe8448b6..7fbc93ae133 100644
--- a/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
+++ b/src/assets/wise5/components/multipleChoice/multiple-choice-authoring/multiple-choice-authoring.component.html
@@ -32,7 +32,7 @@
 }
 @for (choice of componentContent.choices; track choice.id; let last = $last; let first = $first) {
   <div class="choice-container">
-    <div class="flex flex-row flex-wrap justify-start items-center gap-2">
+    <div class="flex flex-row flex-wrap justify-start gap-2">
       <translatable-input
         [content]="choice"
         key="text"
@@ -62,7 +62,7 @@
         </mat-checkbox>
       </div>
     </div>
-    <div class="flex flex-row flex-wrap justify-start items-center">
+    <div class="flex flex-row flex-wrap justify-start">
       <translatable-input
         [content]="choice"
         key="feedback"
diff --git a/src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html b/src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html
index 8187ba507db..a86b44eca3e 100644
--- a/src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html
+++ b/src/assets/wise5/components/openResponse/edit-open-response-advanced/edit-open-response-advanced.component.html
@@ -436,7 +436,7 @@
                   </mat-form-field>
                 }
               </div>
-              <div class="flex items-start justify-start gap-4">
+              <div class="flex justify-start gap-4">
                 <mat-checkbox
                   color="primary"
                   class="checkbox"
@@ -456,7 +456,7 @@
                   />
                 }
               </div>
-              <div class="flex items-start justify-start gap-4">
+              <div class="flex justify-start gap-4">
                 <mat-checkbox
                   color="primary"
                   class="checkbox"
diff --git a/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html b/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
index dd800c52eee..3fb37377eed 100644
--- a/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
+++ b/src/assets/wise5/components/summary/summary-authoring/summary-authoring.component.html
@@ -141,7 +141,7 @@
   let isFirst = $first;
   let isLast = $last
 ) {
-  <div class="custom-label-color-container flex flex-row flex-wrap justify-start items-center">
+  <div class="custom-label-color-container flex flex-row flex-wrap justify-start">
     <translatable-input
       [content]="customLabelColor"
       key="label"
diff --git a/src/assets/wise5/components/table/table-authoring/table-authoring.component.html b/src/assets/wise5/components/table/table-authoring/table-authoring.component.html
index a8f7dfa08b2..f732a517b13 100644
--- a/src/assets/wise5/components/table/table-authoring/table-authoring.component.html
+++ b/src/assets/wise5/components/table/table-authoring/table-authoring.component.html
@@ -151,7 +151,7 @@
         </td>
         @for (cell of row; track cell) {
           <td class="inner-cell-container">
-            <div class="flex flex-col justify-center items-center">
+            <div class="flex flex-col justify-center">
               <translatable-input
                 [content]="cell"
                 key="text"
diff --git a/src/assets/wise5/services/teacherProjectTranslationService.ts b/src/assets/wise5/services/teacherProjectTranslationService.ts
index 627dfd30a2e..4c5a267e1d6 100644
--- a/src/assets/wise5/services/teacherProjectTranslationService.ts
+++ b/src/assets/wise5/services/teacherProjectTranslationService.ts
@@ -48,4 +48,37 @@ export class TeacherProjectTranslationService extends ProjectTranslationService
         })
       );
   }
+
+  getTranslationSuggestion(
+    defaultLanguage: string,
+    currentLanguage: string,
+    defaultLanguageText: string
+  ): Observable<string> {
+    return this.http
+      .post(
+        `/api/author/project/translate/suggest`,
+        {
+          srcLang: defaultLanguage,
+          targetLang: currentLanguage,
+          srcText: this.addDoNotTranslateTags(defaultLanguageText)
+        },
+        { responseType: 'text' }
+      )
+      .pipe(map(this.removeDoNotTranslateTags));
+  }
+
+  private addDoNotTranslateTags(textToTranslate: string): string {
+    return textToTranslate
+      .replaceAll(/<.*?>/g, (match) => '<span translate="no">' + match + '</span>')
+      .replaceAll(
+        /link-text='.*?'/g,
+        (match) => match.slice(0, 11) + '</span>' + match.slice(11, -1) + '<span translate="no">\''
+      );
+  }
+
+  private removeDoNotTranslateTags(translatedText: string): string {
+    return translatedText.replaceAll(/<span translate="no"><.*?><\/span>/g, (match) =>
+      match.slice(21, -7)
+    );
+  }
 }
diff --git a/src/messages.xlf b/src/messages.xlf
index 3a55e3f5715..4d3fe9d9a6c 100644
--- a/src/messages.xlf
+++ b/src/messages.xlf
@@ -491,6 +491,10 @@
           <context context-type="sourcefile">src/assets/wise5/authoringTool/choose-node-location/choose-move-node-location/choose-move-node-location.component.html</context>
           <context context-type="linenumber">3,6</context>
         </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">16,17</context>
+        </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/create-branch/create-branch.component.html</context>
           <context context-type="linenumber">50,54</context>
@@ -11063,6 +11067,13 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
           <context context-type="linenumber">5,9</context>
         </context-group>
       </trans-unit>
+      <trans-unit id="3243437861876933284" datatype="html">
+        <source>There was an error translating the text. Please contact WISE staff if the error persists.</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/abstract-translatable-field/abstract-translatable-field.component.ts</context>
+          <context context-type="linenumber">106</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="9041444200911417888" datatype="html">
         <source>Selected</source>
         <context-group purpose="location">
@@ -11257,7 +11268,22 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
         <source>Choose image</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-asset-chooser/translatable-asset-chooser.component.ts</context>
-          <context context-type="linenumber">19</context>
+          <context context-type="linenumber">20</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="2416604626558510435" datatype="html">
+        <source>Translate with AI</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-input/translatable-input.component.html</context>
+          <context context-type="linenumber">22,27</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html</context>
+          <context context-type="linenumber">18,22</context>
+        </context-group>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-textarea/translatable-textarea.component.html</context>
+          <context context-type="linenumber">23,28</context>
         </context-group>
       </trans-unit>
       <trans-unit id="8183679777797552825" datatype="html">
@@ -11271,21 +11297,70 @@ Click &quot;Cancel&quot; to keep the invalid JSON open so you can fix it.</sourc
         <source>Note: Editing is disabled. Please switch back to <x id="INTERPOLATION" equiv-text="{{ defaultLanguage.language }}"/> if you want to edit.</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html</context>
-          <context context-type="linenumber">27,28</context>
+          <context context-type="linenumber">33,34</context>
         </context-group>
       </trans-unit>
       <trans-unit id="2602981828256525663" datatype="html">
         <source> Copy content to <x id="INTERPOLATION" equiv-text="{{ currentLanguage().language }}"/> </source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.html</context>
-          <context context-type="linenumber">37,38</context>
+          <context context-type="linenumber">43,44</context>
         </context-group>
       </trans-unit>
       <trans-unit id="5046317553228226783" datatype="html">
         <source>Are you sure you want to replace the content in <x id="PH" equiv-text="this.currentLanguage().language"/> with content in <x id="PH_1" equiv-text="this.defaultLanguage.language"/> for this item?</source>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translatable-rich-text-editor/translatable-rich-text-editor.component.ts</context>
-          <context context-type="linenumber">50,52</context>
+          <context context-type="linenumber">59,61</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="3634855983456779633" datatype="html">
+        <source>Replace Translation</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">1,4</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="8429306013866107963" datatype="html">
+        <source><x id="INTERPOLATION" equiv-text="{{ this.data.defaultLanguage }}"/> text:</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">4,5</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="6003394533689080903" datatype="html">
+        <source><x id="INTERPOLATION" equiv-text="{{ this.data.currentLanguage }}"/> text (current translation):</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">6,7</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="6589804180513143194" datatype="html">
+        <source><x id="INTERPOLATION" equiv-text="{{ this.data.currentLanguage }}"/> text (AI suggested translation):</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">8,9</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="4577949766167811649" datatype="html">
+        <source> Do you want to replace the current translation with the AI suggested translation? </source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">11,15</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="6254459922754143568" datatype="html">
+        <source>Replace</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.html</context>
+          <context context-type="linenumber">17,19</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="7053786808549278445" datatype="html">
+        <source>There was an error translating the text. Please talk to WISE staff.</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/assets/wise5/authoringTool/components/translation-suggestions-dialog/translation-suggestions-dialog.component.ts</context>
+          <context context-type="linenumber">47</context>
         </context-group>
       </trans-unit>
       <trans-unit id="2170693430286604200" datatype="html">
@@ -20067,7 +20142,7 @@ Category Name: <x id="PH_1" equiv-text="categoryName"/></source>
         </context-group>
         <context-group purpose="location">
           <context context-type="sourcefile">src/assets/wise5/components/graph/graph-authoring/graph-authoring.component.html</context>
-          <context context-type="linenumber">297,301</context>
+          <context context-type="linenumber">297,302</context>
         </context-group>
       </trans-unit>
       <trans-unit id="1902100407096396858" datatype="html">