diff --git a/src/app/pages/settings/languages/languages.html b/src/app/pages/settings/languages/languages.html
new file mode 100644
index 0000000..c387d91
--- /dev/null
+++ b/src/app/pages/settings/languages/languages.html
@@ -0,0 +1,6 @@
+
+
+
diff --git a/src/app/pages/settings/languages/languages.scss b/src/app/pages/settings/languages/languages.scss
new file mode 100644
index 0000000..44c1b69
--- /dev/null
+++ b/src/app/pages/settings/languages/languages.scss
@@ -0,0 +1,4 @@
+:host {
+ --mat-list-list-item-leading-avatar-color: transparent;
+ --mat-list-list-item-leading-avatar-size: 24px;
+}
\ No newline at end of file
diff --git a/src/app/pages/settings/languages/languages.spec.ts b/src/app/pages/settings/languages/languages.spec.ts
new file mode 100644
index 0000000..6658a01
--- /dev/null
+++ b/src/app/pages/settings/languages/languages.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { Languages } from './languages';
+import { provideTranslateService } from '@ngx-translate/core';
+
+describe('Languages', () => {
+ let component: Languages;
+ let fixture: ComponentFixture;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ imports: [Languages],
+ providers: [provideTranslateService({})],
+ })
+ .compileComponents();
+
+ fixture = TestBed.createComponent(Languages);
+ component = fixture.componentInstance;
+ await fixture.whenStable();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/pages/settings/languages/languages.ts b/src/app/pages/settings/languages/languages.ts
new file mode 100644
index 0000000..8b70644
--- /dev/null
+++ b/src/app/pages/settings/languages/languages.ts
@@ -0,0 +1,21 @@
+import { Component, inject } from '@angular/core';
+import { SimpleLayout } from '../../../components/simple-layout/simple-layout';
+import { MatListModule } from '@angular/material/list';
+import { IconActionList } from '../../../components/icon-action-list/icon-action-list';
+import { IconActionListItem } from '../../../components/icon-action-list/IconActionListItem';
+import { TranslateService } from '@ngx-translate/core';
+
+@Component({
+ selector: 'app-languages',
+ imports: [SimpleLayout, MatListModule, IconActionList],
+ templateUrl: './languages.html',
+ styleUrl: './languages.scss',
+})
+export class Languages {
+ protected readonly translateService = inject(TranslateService);
+ readonly languages = [
+ new IconActionListItem('/icons/flags/sp.png', 'settings.language.spanish', 'es'),
+ new IconActionListItem('/icons/flags/us.png', 'settings.language.english', 'en'),
+ new IconActionListItem('/icons/flags/br.png', 'settings.language.portuguese', 'pt'),
+ ];
+}