diff --git a/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart b/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart
index b0cf35a84..3a1b842f6 100644
--- a/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart
+++ b/lib/pages/settings_views/global_settings_view/appearance_settings_view.dart
@@ -141,7 +141,10 @@ class AppearanceSettingsView extends ConsumerWidget {
                                             key: "colorScheme",
                                             value: (newValue
                                                     ? ThemeType.dark
-                                                    : ThemeType.light)
+                                                    : (newValue
+                                                        ? ThemeType.light
+                                                        : ThemeType
+                                                            .oceanBreeze))
                                                 .name,
                                           );
                                           ref
diff --git a/lib/utilities/text_styles.dart b/lib/utilities/text_styles.dart
index db4764459..c9dd15e1d 100644
--- a/lib/utilities/text_styles.dart
+++ b/lib/utilities/text_styles.dart
@@ -16,6 +16,11 @@ class STextStyles {
           fontSize: 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -34,6 +39,11 @@ class STextStyles {
           fontSize: 18,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 18,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -52,6 +62,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -70,6 +85,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -88,6 +108,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -106,6 +131,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -124,6 +154,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -142,6 +177,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -160,6 +200,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextPrimary,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextPrimary,
@@ -178,6 +223,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -196,6 +246,11 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark3,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark3,
@@ -214,6 +269,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark3,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark3,
@@ -232,6 +292,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle1,
+          fontWeight: FontWeight.w500,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle1,
@@ -251,6 +316,12 @@ class STextStyles {
           height: 14 / 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textFieldActiveSearchIconRight,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+          height: 14 / 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textFieldActiveSearchIconRight,
@@ -270,6 +341,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle1,
+          fontWeight: FontWeight.w700,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle1,
@@ -288,6 +364,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).infoItemLabel,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).infoItemLabel,
@@ -306,6 +387,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -324,6 +410,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -343,6 +434,12 @@ class STextStyles {
           height: 1.5,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle2,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+          height: 1.5,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle2,
@@ -363,6 +460,12 @@ class STextStyles {
           height: 1.5,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+          height: 1.5,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -382,6 +485,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -400,6 +508,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).accentColorRed,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).accentColorRed,
@@ -418,6 +531,11 @@ class STextStyles {
           fontSize: 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).infoItemIcons,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).infoItemIcons,
@@ -436,6 +554,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).accentColorBlue,
+          fontWeight: FontWeight.w500,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).accentColorBlue,
@@ -454,6 +577,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -472,6 +600,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -490,6 +623,11 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -508,6 +646,11 @@ class STextStyles {
           fontSize: 10,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textError,
+          fontWeight: FontWeight.w500,
+          fontSize: 10,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textError,
@@ -526,6 +669,11 @@ class STextStyles {
           fontSize: 10,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle1,
+          fontWeight: FontWeight.w500,
+          fontSize: 10,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle1,
@@ -547,6 +695,12 @@ class STextStyles {
           height: 40 / 40,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 40,
+          height: 40 / 40,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -567,6 +721,12 @@ class STextStyles {
           height: 32 / 32,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 32,
+          height: 32 / 32,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -587,6 +747,12 @@ class STextStyles {
           height: 24 / 24,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 24,
+          height: 24 / 24,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -607,6 +773,12 @@ class STextStyles {
           height: 30 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 30 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -627,6 +799,12 @@ class STextStyles {
           height: 30 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 20,
+          height: 30 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -647,6 +825,12 @@ class STextStyles {
           height: 28 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 20,
+          height: 28 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -667,6 +851,12 @@ class STextStyles {
           height: 33 / 24,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 24,
+          height: 33 / 24,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -687,6 +877,12 @@ class STextStyles {
           height: 26 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextPrimary,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 26 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextPrimary,
@@ -707,6 +903,12 @@ class STextStyles {
           height: 26 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextPrimaryDisabled,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 26 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextPrimaryDisabled,
@@ -727,6 +929,12 @@ class STextStyles {
           height: 26 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextSecondary,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 26 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextSecondary,
@@ -747,6 +955,12 @@ class STextStyles {
           height: 26 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextSecondaryDisabled,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 26 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextSecondaryDisabled,
@@ -767,6 +981,12 @@ class STextStyles {
           height: 27 / 18,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 18,
+          height: 27 / 18,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextPrimaryDisabled,
@@ -787,6 +1007,12 @@ class STextStyles {
           height: 24 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextPrimaryDisabled,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 24 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextPrimaryDisabled,
@@ -807,6 +1033,12 @@ class STextStyles {
           height: 21 / 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle1,
+          fontWeight: FontWeight.w500,
+          fontSize: 14,
+          height: 21 / 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle1,
@@ -827,6 +1059,12 @@ class STextStyles {
           height: 21 / 14,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 14,
+          height: 21 / 14,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -847,6 +1085,12 @@ class STextStyles {
           height: 24 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).buttonTextSecondary,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 24 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).buttonTextSecondary,
@@ -867,6 +1111,12 @@ class STextStyles {
           height: 30 / 20,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textSubtitle2,
+          fontWeight: FontWeight.w500,
+          fontSize: 20,
+          height: 30 / 20,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textSubtitle2,
@@ -887,6 +1137,12 @@ class STextStyles {
           height: 20.8 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark.withOpacity(0.8),
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 20.8 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark.withOpacity(0.8),
@@ -907,6 +1163,12 @@ class STextStyles {
           height: 20.8 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 20.8 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -927,6 +1189,12 @@ class STextStyles {
           height: 20.8 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark.withOpacity(0.5),
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 20.8 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark.withOpacity(0.5),
@@ -947,6 +1215,12 @@ class STextStyles {
           height: 20.8 / 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w500,
+          fontSize: 16,
+          height: 20.8 / 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           color: _theme(context).textDark,
@@ -966,6 +1240,11 @@ class STextStyles {
           fontSize: 8,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.roboto(
+          color: _theme(context).textDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 8,
+        );
       case ThemeType.dark:
         return GoogleFonts.roboto(
           color: _theme(context).textDark,
@@ -984,6 +1263,11 @@ class STextStyles {
           fontSize: 26,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.roboto(
+          color: _theme(context).numberTextDefault,
+          fontWeight: FontWeight.w400,
+          fontSize: 26,
+        );
       case ThemeType.dark:
         return GoogleFonts.roboto(
           color: _theme(context).numberTextDefault,
@@ -1003,6 +1287,12 @@ class STextStyles {
           fontSize: 12,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          letterSpacing: 0.5,
+          color: _theme(context).accentColorDark,
+          fontWeight: FontWeight.w400,
+          fontSize: 12,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           letterSpacing: 0.5,
@@ -1023,6 +1313,12 @@ class STextStyles {
           fontSize: 16,
         );
       case ThemeType.oceanBreeze:
+        return GoogleFonts.inter(
+          letterSpacing: 0.5,
+          color: _theme(context).accentColorDark,
+          fontWeight: FontWeight.w600,
+          fontSize: 16,
+        );
       case ThemeType.dark:
         return GoogleFonts.inter(
           letterSpacing: 0.5,
diff --git a/lib/utilities/theme/ocean_breeze_colors.dart b/lib/utilities/theme/ocean_breeze_colors.dart
new file mode 100644
index 000000000..ff2f4e85e
--- /dev/null
+++ b/lib/utilities/theme/ocean_breeze_colors.dart
@@ -0,0 +1,306 @@
+import 'package:flutter/material.dart';
+import 'package:stackwallet/utilities/theme/color_theme.dart';
+
+class OceanBreezeColors extends StackColorTheme {
+  @override
+  ThemeType get themeType => ThemeType.oceanBreeze;
+
+  @override
+  Color get background => const Color(0xFFF3F7FA);
+  @override
+  Color get overlay => const Color(0xFF111215);
+
+  @override
+  Color get accentColorBlue => const Color(0xFF077CBE);
+  @override
+  Color get accentColorGreen => const Color(0xFF00A591);
+  @override
+  Color get accentColorYellow => const Color(0xFFF4C517);
+  @override
+  Color get accentColorRed => const Color(0xFFD1382D);
+  @override
+  Color get accentColorOrange => const Color(0xFFFF985F);
+  @override
+  Color get accentColorDark => const Color(0xFF232323);
+
+  @override
+  Color get shadow => const Color(0xFF388192);
+
+  @override
+  Color get textDark => const Color(0xFF232323);
+  @override
+  Color get textDark2 => const Color(0xFF333333);
+  @override
+  Color get textDark3 => const Color(0xFF696B6C);
+  @override
+  Color get textSubtitle1 => const Color(0xFF7E8284);
+  @override
+  Color get textSubtitle2 => const Color(0xFF919393);
+  @override
+  Color get textSubtitle3 => const Color(0xFFB0B2B2);
+  @override
+  Color get textSubtitle4 => const Color(0xFFD1D3D3);
+  @override
+  Color get textSubtitle5 => const Color(0xFFDEDFE1);
+  @override
+  Color get textSubtitle6 => const Color(0xFFF1F1F1);
+  @override
+  Color get textWhite => const Color(0xFFFFFFFF);
+  @override
+  Color get textFavoriteCard => const Color(0xFF232323);
+  @override
+  Color get textError => const Color(0xFF8D0006);
+
+  // button background
+  @override
+  Color get buttonBackPrimary => const Color(0xFF227386);
+  @override
+  Color get buttonBackSecondary => const Color(0xFFC2DAE2);
+  @override
+  Color get buttonBackPrimaryDisabled => const Color(0xFFBDD5DB);
+  @override
+  Color get buttonBackSecondaryDisabled => const Color(0xFFBDBDBD);
+  @override
+  Color get buttonBackBorder => const Color(0xFF227386);
+  @override
+  Color get buttonBackBorderDisabled => const Color(0xFFBDD5DB);
+
+  @override
+  Color get numberBackDefault => const Color(0xFFFFFFFF);
+  @override
+  Color get numpadBackDefault => const Color(0xFF227386);
+  @override
+  Color get bottomNavBack => const Color(0xFFFFFFFF);
+
+  // button text/element
+  @override
+  Color get buttonTextPrimary => const Color(0xFFFFFFFF);
+  @override
+  Color get buttonTextSecondary => const Color(0xFF232323);
+  @override
+  Color get buttonTextPrimaryDisabled => const Color(0xFFFFFFFF);
+  @override
+  Color get buttonTextSecondaryDisabled => const Color(0xFFBDD5DB);
+  @override
+  Color get buttonTextBorder => const Color(0xFF227386);
+  @override
+  Color get buttonTextDisabled => const Color(0xFFFFFFFF);
+  @override
+  Color get buttonTextBorderless => const Color(0xFF056EC6);
+  @override
+  Color get buttonTextBorderlessDisabled => const Color(0xFFB6B6B6);
+  @override
+  Color get numberTextDefault => const Color(0xFF232323);
+  @override
+  Color get numpadTextDefault => const Color(0xFFFFFFFF);
+  @override
+  Color get bottomNavText => const Color(0xFF232323);
+
+  // switch
+  @override
+  Color get switchBGOn => const Color(0xFF056EC6);
+  @override
+  Color get switchBGOff => const Color(0xFFCCDBF9);
+  @override
+  Color get switchBGDisabled => const Color(0xFFC5C6C9);
+  @override
+  Color get switchCircleOn => const Color(0xFFDAE2FF);
+  @override
+  Color get switchCircleOff => const Color(0xFFFBFCFF);
+  @override
+  Color get switchCircleDisabled => const Color(0xFFFBFCFF);
+
+  // step indicator background
+  @override
+  Color get stepIndicatorBGCheck => const Color(0xFFCDD9FF);
+  @override
+  Color get stepIndicatorBGNumber => const Color(0xFFCDD9FF);
+  @override
+  Color get stepIndicatorBGInactive => const Color(0xFFA6C7D1);
+  @override
+  Color get stepIndicatorBGLines => const Color(0xFF90B8DC);
+  @override
+  Color get stepIndicatorBGLinesInactive => const Color(0xFFBCD4EA);
+  @override
+  Color get stepIndicatorIconText => const Color(0xFF005BAF);
+  @override
+  Color get stepIndicatorIconNumber => const Color(0xFF005BAF);
+  @override
+  Color get stepIndicatorIconInactive => const Color(0xFFD4DFFF);
+
+  // checkbox
+  @override
+  Color get checkboxBGChecked => const Color(0xFF056EC6);
+  @override
+  Color get checkboxBorderEmpty => const Color(0xFF8C8F90);
+  @override
+  Color get checkboxBGDisabled => const Color(0xFFB0C9ED);
+  @override
+  Color get checkboxIconChecked => const Color(0xFFFFFFFF);
+  @override
+  Color get checkboxIconDisabled => const Color(0xFFFFFFFF);
+  @override
+  Color get checkboxTextLabel => const Color(0xFF232323);
+
+  // snack bar
+  @override
+  Color get snackBarBackSuccess => const Color(0xFFADD6D2);
+  @override
+  Color get snackBarBackError => const Color(0xFFF6C7C3);
+  @override
+  Color get snackBarBackInfo => const Color(0xFFCCD7FF);
+  @override
+  Color get snackBarTextSuccess => const Color(0xFF075547);
+  @override
+  Color get snackBarTextError => const Color(0xFF8D0006);
+  @override
+  Color get snackBarTextInfo => const Color(0xFF002569);
+
+  // icons
+  @override
+  Color get bottomNavIconBack => const Color(0xFFA7C7CF);
+  @override
+  Color get bottomNavIconIcon => const Color(0xFF227386);
+
+  @override
+  Color get topNavIconPrimary => const Color(0xFF227386);
+  @override
+  Color get topNavIconGreen => const Color(0xFF00A591);
+  @override
+  Color get topNavIconYellow => const Color(0xFFFDD33A);
+  @override
+  Color get topNavIconRed => const Color(0xFFEA4649);
+
+  @override
+  Color get settingsIconBack => const Color(0xFFE0E3E3);
+  @override
+  Color get settingsIconIcon => const Color(0xFF232323);
+  @override
+  Color get settingsIconBack2 => const Color(0xFF80D2C8);
+  @override
+  Color get settingsIconElement => const Color(0xFF00A591);
+
+  // text field
+  @override
+  Color get textFieldActiveBG => const Color(0xFFD3E3E7);
+  @override
+  Color get textFieldDefaultBG => const Color(0xFFD8E7EB);
+  @override
+  Color get textFieldErrorBG => const Color(0xFFF6C7C3);
+  @override
+  Color get textFieldSuccessBG => const Color(0xFFADD6D2);
+
+  @override
+  Color get textFieldActiveSearchIconLeft => const Color(0xFF86898C);
+  @override
+  Color get textFieldDefaultSearchIconLeft => const Color(0xFF86898C);
+  @override
+  Color get textFieldErrorSearchIconLeft => const Color(0xFF8D0006);
+  @override
+  Color get textFieldSuccessSearchIconLeft => const Color(0xFF006C4D);
+
+  @override
+  Color get textFieldActiveText => const Color(0xFF232323);
+  @override
+  Color get textFieldDefaultText => const Color(0xFF86898C);
+  @override
+  Color get textFieldErrorText => const Color(0xFF000000);
+  @override
+  Color get textFieldSuccessText => const Color(0xFF000000);
+
+  @override
+  Color get textFieldActiveLabel => const Color(0xFF86898C);
+  @override
+  Color get textFieldErrorLabel => const Color(0xFF8D0006);
+  @override
+  Color get textFieldSuccessLabel => const Color(0xFF077C6E);
+
+  @override
+  Color get textFieldActiveSearchIconRight => const Color(0xFF388192);
+  @override
+  Color get textFieldDefaultSearchIconRight => const Color(0xFF388192);
+  @override
+  Color get textFieldErrorSearchIconRight => const Color(0xFF8D0006);
+  @override
+  Color get textFieldSuccessSearchIconRight => const Color(0xFF077C6E);
+
+  // settings item level2
+  @override
+  Color get settingsItem2ActiveBG => const Color(0xFFFFFFFF);
+  @override
+  Color get settingsItem2ActiveText => const Color(0xFF232323);
+  @override
+  Color get settingsItem2ActiveSub => const Color(0xFF8C8F90);
+
+  // radio buttons
+  @override
+  Color get radioButtonIconBorder => const Color(0xFF056EC6);
+  @override
+  Color get radioButtonIconBorderDisabled => const Color(0xFF8C8D97);
+  @override
+  Color get radioButtonBorderEnabled => const Color(0xFF056EC6);
+  @override
+  Color get radioButtonBorderDisabled => const Color(0xFF8C8D97);
+  @override
+  Color get radioButtonIconCircle => const Color(0xFF056EC6);
+  @override
+  Color get radioButtonIconEnabled => const Color(0xFF056EC6);
+  @override
+  Color get radioButtonTextEnabled => const Color(0xFF42444B);
+  @override
+  Color get radioButtonTextDisabled => const Color(0xFF42444B);
+  @override
+  Color get radioButtonLabelEnabled => const Color(0xFF8C8F90);
+  @override
+  Color get radioButtonLabelDisabled => const Color(0xFF8C8F90);
+
+  // info text
+  @override
+  Color get infoItemBG => const Color(0xFFFFFFFF);
+  @override
+  Color get infoItemLabel => const Color(0xFF838788);
+  @override
+  Color get infoItemText => const Color(0xFF232323);
+  @override
+  Color get infoItemIcons => const Color(0xFF056EC6);
+
+  // popup
+  @override
+  Color get popupBG => const Color(0xFFFFFFFF);
+
+  // currency list
+  @override
+  Color get currencyListItemBG => const Color(0xFFF0F5F7);
+
+  // bottom nav
+  @override
+  Color get stackWalletBG => const Color(0xFFFFFFFF);
+  @override
+  Color get stackWalletMid => const Color(0xFFFFFFFF);
+  @override
+  Color get stackWalletBottom => const Color(0xFF232323);
+  @override
+  Color get bottomNavShadow => const Color(0xFF388192);
+
+  @override
+  Color get favoriteStarActive => const Color(0xFFF4C517);
+  @override
+  Color get favoriteStarInactive => const Color(0xFFB0B2B2);
+
+  @override
+  Color get splash => const Color(0xFF8E9192);
+  @override
+  Color get highlight => const Color(0xFFA9ACAC);
+  @override
+  Color get warningForeground => const Color(0xFF232323);
+  @override
+  Color get warningBackground => const Color(0xFFF6C7C3);
+  @override
+  Color get loadingOverlayTextColor => const Color(0xFFF7F7F7);
+  @override
+  Color get myStackContactIconBG => const Color(0xFFD8E7EB);
+  @override
+  Color get textConfirmTotalAmount => const Color(0xFF232323);
+  @override
+  Color get textSelectedWordTableItem => const Color(0xFF232323);
+}