diff --git a/projects/natural/src/lib/_natural.theme.scss b/projects/natural/src/lib/_natural.theme.scss
index 40df46d3..e69de29b 100644
--- a/projects/natural/src/lib/_natural.theme.scss
+++ b/projects/natural/src/lib/_natural.theme.scss
@@ -1,72 +0,0 @@
-@use 'sass:map';
-@use '@angular/material' as mat;
-
-// Non themes
-@use 'styles/table';
-@use 'modules/panels/panels.external';
-// Themes
-@use 'modules/alert/alert.theme';
-@use 'modules/sidenav/sidenav.theme';
-@use 'modules/search/search.theme';
-@use 'modules/file/component/file.theme';
-
-/**
- * Global css
- */
-.mat-mdc-table .mdc-button__label {
-    white-space: nowrap;
-}
-
-/**
- * Wrapped theme
- */
-@mixin natural($theme) {
-    $primary: map.get($theme, primary);
-    $accent: map.get($theme, accent);
-    $warn: map.get($theme, warn);
-    $background: map.get($theme, background);
-    $foreground: map.get($theme, foreground);
-
-    @include alert.natural-alert($theme);
-    @include sidenav.natural-sidenav($theme);
-    @include search.natural-search($theme);
-    @include table.natural-table($theme);
-    @include file.natural-file($theme);
-
-    .mat-mdc-tab-labels,
-    .mat-mdc-tab-links,
-    .mdc-data-table__row:last-child .mdc-data-table__cell {
-        border-bottom: 1px solid mat.m2-get-color-from-palette($foreground, divider);
-    }
-
-    // Since MDC dialogs, text color is too pale, so we restore a higher contrast for better readability
-    // See https://github.com/angular/components/issues/26797
-    .mat-mdc-dialog-container .mdc-dialog__content {
-        color: mat.m2-get-color-from-palette(map.get($theme, foreground), base, 0.87);
-    }
-
-    .natural-elevation {
-        box-shadow:
-            inset 0 1px rgba(255, 255, 255, 0.3),
-            0 2px 1px -1px rgba(0, 0, 0, 0.2),
-            0 1px 1px 0 rgba(0, 0, 0, 0.14),
-            0 1px 3px 0 rgba(0, 0, 0, 0.12);
-    }
-}
-
-$defaultConfig: mat.m2-define-typography-config();
-
-// This is the default Material typography, but with button with normal letter-spacing instead of wider letter-spacing.
-$typography: mat.m2-define-typography-config(
-    $button: mat.m2-define-typography-level(
-            $font-family: mat.m2-font-family($defaultConfig, 'button'),
-            $font-weight: mat.m2-font-weight($defaultConfig, 'button'),
-            $font-size: mat.m2-font-size($defaultConfig, 'button'),
-            $line-height: mat.m2-line-height($defaultConfig, 'button'),
-            $letter-spacing: normal,
-        ),
-);
-
-.mdc-snackbar {
-    margin-top: 75px !important;
-}
diff --git a/src/_theme-colors.scss b/src/_theme-colors.scss
new file mode 100644
index 00000000..9c0433e3
--- /dev/null
+++ b/src/_theme-colors.scss
@@ -0,0 +1,137 @@
+// This file was generated by running 'ng generate @angular/material:theme-color'.
+// Proceed with caution if making changes to this file.
+
+@use 'sass:map';
+@use '@angular/material' as mat;
+
+// Note: Color palettes are generated from primary: #2a7ae2, secondary: #b72ae2, tertiary: #f44336
+$_palettes: (
+    primary: (
+        0: #000000,
+        10: #001b3e,
+        20: #002f64,
+        25: #003a79,
+        30: #00458e,
+        35: #0051a3,
+        40: #005db9,
+        50: #2275dd,
+        60: #4890f9,
+        70: #7bacff,
+        80: #aac7ff,
+        90: #d6e3ff,
+        95: #ecf0ff,
+        98: #f9f9ff,
+        99: #fdfbff,
+        100: #ffffff,
+    ),
+    secondary: (
+        0: #000000,
+        10: #330043,
+        20: #54006c,
+        25: #660082,
+        30: #780098,
+        35: #8a00af,
+        40: #9d00c7,
+        50: #bb30e6,
+        60: #d755ff,
+        70: #e585ff,
+        80: #f1afff,
+        90: #fbd7ff,
+        95: #ffebfe,
+        98: #fff7fb,
+        99: #fffbff,
+        100: #ffffff,
+    ),
+    tertiary: (
+        0: #000000,
+        10: #410001,
+        20: #690002,
+        25: #7e0004,
+        30: #930005,
+        35: #a90107,
+        40: #bb1614,
+        50: #e0342a,
+        60: #ff5545,
+        70: #ff8a7b,
+        80: #ffb4a9,
+        90: #ffdad5,
+        95: #ffedea,
+        98: #fff8f7,
+        99: #fffbff,
+        100: #ffffff,
+    ),
+    neutral: (
+        0: #000000,
+        10: #191c22,
+        20: #2d3037,
+        25: #383b42,
+        30: #44474e,
+        35: #50525a,
+        40: #5c5e66,
+        50: #74777f,
+        60: #8e9099,
+        70: #a9abb3,
+        80: #c4c6cf,
+        90: #e1e2eb,
+        95: #eff0f9,
+        98: #f9f9ff,
+        99: #fdfbff,
+        100: #ffffff,
+        4: #0b0e14,
+        6: #10131a,
+        12: #1d2026,
+        17: #272a31,
+        22: #32353c,
+        24: #363940,
+        87: #d8dae3,
+        92: #e6e8f1,
+        94: #ecedf7,
+        96: #f2f3fc,
+    ),
+    neutral-variant: (
+        0: #000000,
+        10: #161c26,
+        20: #2b303c,
+        25: #363b47,
+        30: #414753,
+        35: #4d525f,
+        40: #595e6b,
+        50: #727784,
+        60: #8b919e,
+        70: #a6abb9,
+        80: #c1c6d5,
+        90: #dde2f1,
+        95: #ecf0ff,
+        98: #f9f9ff,
+        99: #fdfbff,
+        100: #ffffff,
+    ),
+    error: (
+        0: #000000,
+        10: #410002,
+        20: #690005,
+        25: #7e0007,
+        30: #93000a,
+        35: #a80710,
+        40: #ba1a1a,
+        50: #de3730,
+        60: #ff5449,
+        70: #ff897d,
+        80: #ffb4ab,
+        90: #ffdad6,
+        95: #ffedea,
+        98: #fff8f7,
+        99: #fffbff,
+        100: #ffffff,
+    ),
+);
+
+$_rest: (
+    secondary: map.get($_palettes, secondary),
+    neutral: map.get($_palettes, neutral),
+    neutral-variant: map.get($_palettes, neutral-variant),
+    error: map.get($_palettes, error),
+);
+
+$primary-palette: map.merge(map.get($_palettes, primary), $_rest);
+$tertiary-palette: map.merge(map.get($_palettes, tertiary), $_rest);
diff --git a/src/styles.scss b/src/styles.scss
index 2c280ade..0fe35895 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -11,9 +11,9 @@
 
 // Include components themes
 @mixin components-theme($theme) {
-    @include natural.natural($theme);
-    @include natural-editor.natural-editor($theme);
-    @include home.home($theme);
+    //@include natural.natural($theme);
+    //@include natural-editor.natural-editor($theme);
+    //@include home.home($theme);
 }
 
 $blue: (
@@ -115,46 +115,58 @@ $pink: (
     ),
 );
 
-$theme-primary: mat.m2-define-palette($blue);
-$theme-accent: mat.m2-define-palette($pink);
+//$theme-primary: mat.m2-define-palette($blue);
+//$theme-accent: mat.m2-define-palette($pink);
 $theme-warn: mat.m2-define-palette(mat.$m2-red-palette);
-$light-theme: mat.m2-define-light-theme(
-    (
-        color: (
-            primary: $theme-primary,
-            accent: $theme-accent,
-            warn: $theme-warn,
-        ),
-        typography: natural.$typography,
-    )
-);
-$dark-theme: mat.m2-define-dark-theme(
-    (
-        color: (
-            primary: $theme-primary,
-            accent: $theme-accent,
-            warn: $theme-warn,
-        ),
-    )
-);
-
-$baseColorLight: mat.m2-get-color-from-palette(map.get($light-theme, foreground), base);
-$baseColorDark: mat.m2-get-color-from-palette(map.get($dark-theme, foreground), base);
-$baseBgColorDark: mat.m2-get-color-from-palette(map.get($dark-theme, background), background);
-
-@include mat.all-component-themes($light-theme);
+//$light-theme: mat.m2-define-light-theme(
+//    (
+//        color: (
+//            primary: $theme-primary,
+//            accent: $theme-accent,
+//            warn: $theme-warn,
+//        ),
+//        typography: natural.$typography,
+//    )
+//);
+//$dark-theme: mat.m2-define-dark-theme(
+//    (
+//        color: (
+//            primary: $theme-primary,
+//            accent: $theme-accent,
+//            warn: $theme-warn,
+//        ),
+//    )
+//);
+
+//$baseColorLight: mat.m2-get-color-from-palette(map.get($light-theme, foreground), base);
+//$baseColorDark: mat.m2-get-color-from-palette(map.get($dark-theme, foreground), base);
+//$baseBgColorDark: mat.m2-get-color-from-palette(map.get($dark-theme, background), background);
+
+//@include mat.all-component-themes($light-theme);
 
 .default {
-    color: $baseColorLight;
-    @include components-theme($light-theme);
+    @include mat.theme(
+        (
+            color: mat.$violet-palette,
+            typography: Roboto,
+            density: 0,
+        )
+    );
 }
 
 .defaultDark {
-    background: $baseBgColorDark;
-    color: $baseColorDark;
-
-    @include mat.all-component-colors($dark-theme);
-    @include components-theme($dark-theme);
+    @include mat.theme(
+        (
+            color: mat.$blue-palette,
+            typography: Roboto,
+            density: 0,
+        )
+    );
+    //background: $baseBgColorDark;
+    //color: $baseColorDark;
+    //
+    //@include mat.all-component-colors($dark-theme);
+    //@include components-theme($dark-theme);
 }
 
 body {