From 1cf6c29309d1d0ecae9481b7328b034fc2a210c8 Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 16:23:19 +0900 Subject: [PATCH 1/7] feat: add AppColors class for centralized color management --- .../shared/constants/app_colors.dart | 250 ++++++++++++++++++ 1 file changed, 250 insertions(+) create mode 100644 lib/presentation/shared/constants/app_colors.dart diff --git a/lib/presentation/shared/constants/app_colors.dart b/lib/presentation/shared/constants/app_colors.dart new file mode 100644 index 00000000..b9d26003 --- /dev/null +++ b/lib/presentation/shared/constants/app_colors.dart @@ -0,0 +1,250 @@ +import 'package:flutter/material.dart'; + +abstract final class AppColors { + static const Color white = Color(0xFFFFFFFF); + + /// White with 90% opacity. + /// + /// This is a color commonly used for headings in dark themes. + /// + /// See also: + /// + /// * [Typography.white], which uses this color for its text styles. + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white80], [white70], [white60], [white50], [white40], + /// [white30], which are variants on this color but with different + /// opacities. + static final Color white90 = white.withValues(alpha: 0.9); + + /// White with 80% opacity. + /// + /// See also: + /// + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white70], [white60], [white50], [white40], [white30], which + /// are variants on this color but with different opacities. + static final Color white80 = white.withValues(alpha: 0.8); + + /// White with 70% opacity. + /// + /// See also: + /// + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white60], [white50], [white40], [white30], [white20], which + /// are variants on this color but with different opacities. + static final Color white70 = white.withValues(alpha: 0.7); + + /// White with 60% opacity. + /// + /// See also: + /// + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white50], [white40], [white30], [white20], + /// [white10], which are variants on this color but with different + /// opacities. + static final Color white60 = white.withValues(alpha: 0.6); + + /// White with 50% opacity. + /// + /// See also: + /// + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white40], [white30], [white20], [white10], + /// which are variants on this color but with different + /// opacities. + static final Color white50 = white.withValues(alpha: 0.5); + + /// White with 40% opacity. + /// + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white30], [white20], [white10], which are variants on this + /// color but with different opacities. + static final Color white40 = white.withValues(alpha: 0.4); + + /// White with 30% opacity. + /// + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white20], [white10], which are variants on this color but + /// with different opacities. + static final Color white30 = white.withValues(alpha: 0.3); + + /// White with 20% opacity. + /// + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], [white10], which are variants on this color but with different + /// opacities. + + static final Color white20 = white.withValues(alpha: 0.2); + + /// White with 10% opacity. + /// + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + /// * [white], which is a variant on this color but with a different opacity. + static final Color white10 = white.withValues(alpha: 0.1); + + /// The blue primary color and swatch. + /// {@tool snippet} + /// + /// ```dart + /// Icon( + /// Icons.widgets, + /// color: AppColors.blue[40], + /// ) + /// ``` + /// {@end-tool} + /// + /// See also: + /// + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + static const MaterialColor indigo = MaterialColor( + _bluePrimaryValue, + { + 0: Color(0xFF212F6F), + 10: Color(0xFF2D3F92), + 20: Color(0xFF3D54BC), + 30: Color(0xFF4F69DF), + 40: Color(_bluePrimaryValue), + 50: Color(0xFF8399FF), + 60: Color(0xFFB4C2FF), + 70: Color(0xFFDCE2FF), + 80: Color(0xFFF2F4FF), + }, + ); + static const int _bluePrimaryValue = 0xFF5C79FB; + + /// The green primary color and swatch. + /// {@tool snippet} + /// ```dart + /// Icon( + /// Icons.widgets, + /// color: AppColors.green[40], + /// ) + /// ``` + /// {@end-tool} + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + static const MaterialColor green = MaterialColor( + _greenPrimaryValue, + { + 0: Color(0xFF006614), + 10: Color(0xFF007A28), + 20: Color(0xFF0A9846), + 30: Color(0xFF00B15F), + 40: Color(_greenPrimaryValue), + 50: Color(0xFF2DE399), + 60: Color(0xFF50F6B3), + 70: Color(0xFF7DFFCB), + 80: Color(0xFFC5FFE8), + }, + ); + static const int _greenPrimaryValue = 0xFF00CA78; + + /// The yellow primary color and swatch. + /// {@tool snippet} + /// ```dart + /// Icon( + /// Icons.widgets, + /// color: AppColors.yellow[40], + /// ) + /// ``` + /// {@end-tool} + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + + static const MaterialColor yellow = MaterialColor( + _yellowPrimaryValue, + { + 0: Color(0xFF826D24), + 10: Color(0xFFA98E31), + 20: Color(0xFFCCAD43), + 30: Color(0xFFE8C54A), + 40: Color(_yellowPrimaryValue), + 50: Color(0xFFFFE383), + 60: Color(0xFFFFECAD), + 70: Color(0xFFFFF2C8), + 80: Color(0xFFFFF6DA), + }, + ); + static const int _yellowPrimaryValue = 0xFFFFD956; + + /// The red primary color and swatch. + /// + /// {@tool snippet} + /// ```dart + /// Icon( + /// Icons.widgets, + /// color: AppColors.red[40], + /// ) + /// ``` + /// {@end-tool} + /// + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + + static const MaterialColor red = MaterialColor( + _redPrimaryValue, + { + 0: Color(0xFFBF2E22), + 10: Color(0xFFD83B2B), + 20: Color(0xFFE6412F), + 30: Color(0xFFF54834), + 40: Color(0xFFFF4E39), + 50: Color(_redPrimaryValue), + 60: Color(0xFFFE8671), + 70: Color(0xFFFEA899), + 80: Color(0xFFFECBC0), + 90: Color(0xFFFFEAE7), + }, + ); + static const int _redPrimaryValue = 0xFFFF6A53; + + /// The grey primary color and swatch. + /// {@tool snippet} + /// ```dart + /// Icon( + /// Icons.widgets, + /// color: AppColors.grey[40], + /// ) + /// ``` + /// {@end-tool} + /// See also: + /// * [Theme.of], which allows you to select colors from the current theme + /// rather than hard-coding colors in your build methods. + + static const MaterialColor grey = MaterialColor( + _greyPrimaryValue, + { + 0: Color(0xFF000000), + 10: Color(0xFF111111), + 20: Color(0xFF2A2A2A), + 30: Color(0xFF383838), + 40: Color(_greyPrimaryValue), + 50: Color(0xFF777777), + 60: Color(0xFF949494), + 70: Color(0xFFB7B7B7), + 80: Color(0xFFC8C8C8), + 90: Color(0xFFDFDFDF), + 100: Color(0xFFE8E8E8), + 110: Color(0xFFEFEFEF), + 120: Color(0xFFF6F6F6), + }, + ); + static const int _greyPrimaryValue = 0xFF555555; +} From 0f97efce1d6537ad350f19dd952ca3e1a2aa9962 Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 16:27:31 +0900 Subject: [PATCH 2/7] fix: rename indigo color to blue in AppColors for clarity --- lib/presentation/shared/constants/app_colors.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/presentation/shared/constants/app_colors.dart b/lib/presentation/shared/constants/app_colors.dart index b9d26003..e380662b 100644 --- a/lib/presentation/shared/constants/app_colors.dart +++ b/lib/presentation/shared/constants/app_colors.dart @@ -110,7 +110,7 @@ abstract final class AppColors { /// /// * [Theme.of], which allows you to select colors from the current theme /// rather than hard-coding colors in your build methods. - static const MaterialColor indigo = MaterialColor( + static const MaterialColor blue = MaterialColor( _bluePrimaryValue, { 0: Color(0xFF212F6F), From 9d57c0043197a78aeeeb8697819202d238d9ba2c Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 16:31:52 +0900 Subject: [PATCH 3/7] refactor: reorder color shades in AppColors for consistency --- .../shared/constants/app_colors.dart | 100 +++++++++--------- 1 file changed, 50 insertions(+), 50 deletions(-) diff --git a/lib/presentation/shared/constants/app_colors.dart b/lib/presentation/shared/constants/app_colors.dart index e380662b..6658a350 100644 --- a/lib/presentation/shared/constants/app_colors.dart +++ b/lib/presentation/shared/constants/app_colors.dart @@ -113,15 +113,15 @@ abstract final class AppColors { static const MaterialColor blue = MaterialColor( _bluePrimaryValue, { - 0: Color(0xFF212F6F), - 10: Color(0xFF2D3F92), - 20: Color(0xFF3D54BC), - 30: Color(0xFF4F69DF), - 40: Color(_bluePrimaryValue), - 50: Color(0xFF8399FF), - 60: Color(0xFFB4C2FF), - 70: Color(0xFFDCE2FF), - 80: Color(0xFFF2F4FF), + 50: Color(0xFF212F6F), + 100: Color(0xFF2D3F92), + 200: Color(0xFF3D54BC), + 300: Color(0xFF4F69DF), + 400: Color(_bluePrimaryValue), + 500: Color(0xFF8399FF), + 600: Color(0xFFB4C2FF), + 700: Color(0xFFDCE2FF), + 800: Color(0xFFF2F4FF), }, ); static const int _bluePrimaryValue = 0xFF5C79FB; @@ -141,15 +141,15 @@ abstract final class AppColors { static const MaterialColor green = MaterialColor( _greenPrimaryValue, { - 0: Color(0xFF006614), - 10: Color(0xFF007A28), - 20: Color(0xFF0A9846), - 30: Color(0xFF00B15F), - 40: Color(_greenPrimaryValue), - 50: Color(0xFF2DE399), - 60: Color(0xFF50F6B3), - 70: Color(0xFF7DFFCB), - 80: Color(0xFFC5FFE8), + 50: Color(0xFF006614), + 100: Color(0xFF007A28), + 200: Color(0xFF0A9846), + 300: Color(0xFF00B15F), + 400: Color(_greenPrimaryValue), + 500: Color(0xFF2DE399), + 600: Color(0xFF50F6B3), + 700: Color(0xFF7DFFCB), + 800: Color(0xFFC5FFE8), }, ); static const int _greenPrimaryValue = 0xFF00CA78; @@ -170,15 +170,15 @@ abstract final class AppColors { static const MaterialColor yellow = MaterialColor( _yellowPrimaryValue, { - 0: Color(0xFF826D24), - 10: Color(0xFFA98E31), - 20: Color(0xFFCCAD43), - 30: Color(0xFFE8C54A), - 40: Color(_yellowPrimaryValue), - 50: Color(0xFFFFE383), - 60: Color(0xFFFFECAD), - 70: Color(0xFFFFF2C8), - 80: Color(0xFFFFF6DA), + 50: Color(0xFF826D24), + 100: Color(0xFFA98E31), + 200: Color(0xFFCCAD43), + 300: Color(0xFFE8C54A), + 400: Color(_yellowPrimaryValue), + 500: Color(0xFFFFE383), + 600: Color(0xFFFFECAD), + 700: Color(0xFFFFF2C8), + 800: Color(0xFFFFF6DA), }, ); static const int _yellowPrimaryValue = 0xFFFFD956; @@ -201,16 +201,16 @@ abstract final class AppColors { static const MaterialColor red = MaterialColor( _redPrimaryValue, { - 0: Color(0xFFBF2E22), - 10: Color(0xFFD83B2B), - 20: Color(0xFFE6412F), - 30: Color(0xFFF54834), - 40: Color(0xFFFF4E39), - 50: Color(_redPrimaryValue), - 60: Color(0xFFFE8671), - 70: Color(0xFFFEA899), - 80: Color(0xFFFECBC0), - 90: Color(0xFFFFEAE7), + 50: Color(0xFFBF2E22), + 100: Color(0xFFD83B2B), + 200: Color(0xFFE6412F), + 300: Color(0xFFF54834), + 400: Color(0xFFFF4E39), + 500: Color(_redPrimaryValue), + 600: Color(0xFFFE8671), + 700: Color(0xFFFEA899), + 800: Color(0xFFFECBC0), + 900: Color(0xFFFFEAE7), }, ); static const int _redPrimaryValue = 0xFFFF6A53; @@ -231,19 +231,19 @@ abstract final class AppColors { static const MaterialColor grey = MaterialColor( _greyPrimaryValue, { - 0: Color(0xFF000000), - 10: Color(0xFF111111), - 20: Color(0xFF2A2A2A), - 30: Color(0xFF383838), - 40: Color(_greyPrimaryValue), - 50: Color(0xFF777777), - 60: Color(0xFF949494), - 70: Color(0xFFB7B7B7), - 80: Color(0xFFC8C8C8), - 90: Color(0xFFDFDFDF), - 100: Color(0xFFE8E8E8), - 110: Color(0xFFEFEFEF), - 120: Color(0xFFF6F6F6), + 50: Color(0xFF000000), + 100: Color(0xFF111111), + 200: Color(0xFF2A2A2A), + 300: Color(0xFF383838), + 400: Color(_greyPrimaryValue), + 500: Color(0xFF777777), + 600: Color(0xFF949494), + 700: Color(0xFFB7B7B7), + 800: Color(0xFFC8C8C8), + 900: Color(0xFFDFDFDF), + 1000: Color(0xFFE8E8E8), + 1100: Color(0xFFEFEFEF), + 1200: Color(0xFFF6F6F6), }, ); static const int _greyPrimaryValue = 0xFF555555; From 5b2988931c784a55cebe7f572d0e8be4900fe09b Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 16:40:24 +0900 Subject: [PATCH 4/7] refactor: update color scheme to use AppColors for consistency --- lib/presentation/shared/theme/theme.dart | 60 ++++++++++++------------ 1 file changed, 31 insertions(+), 29 deletions(-) diff --git a/lib/presentation/shared/theme/theme.dart b/lib/presentation/shared/theme/theme.dart index 2f78b9b6..a552e8cc 100644 --- a/lib/presentation/shared/theme/theme.dart +++ b/lib/presentation/shared/theme/theme.dart @@ -1,36 +1,38 @@ import 'package:flutter/material.dart'; import 'package:on_time_front/presentation/home/components/week_calendar.dart'; +import 'package:on_time_front/presentation/shared/constants/app_colors.dart'; import 'package:on_time_front/presentation/shared/theme/tile_style.dart'; -ColorScheme colorScheme = const ColorScheme( - brightness: Brightness.light, - primary: Color(0xFF5C79FB), - onPrimary: Colors.white, - primaryContainer: Color(0xFFDCE3FF), - onPrimaryContainer: Color(0xFF212F6F), - secondary: Color(0xFF00C575), - onSecondary: Colors.white, - secondaryContainer: Color(0xFFE2FFF4), - onSecondaryContainer: Color(0xFF00480E), - tertiary: Color(0xFFFFD956), - onTertiary: Colors.white, - tertiaryContainer: Color(0xFFFFFAEC), - onTertiaryContainer: Color(0xFF604E10), - error: Color(0xFFFF6953), - onError: Colors.white, - errorContainer: Color(0xFFFFEAE7), - onErrorContainer: Color(0xFF691E14), - surfaceDim: Color(0xFFAFB1B9), - surface: Colors.white, - surfaceBright: Colors.white, - surfaceContainerLowest: Colors.white, - surfaceContainerLow: Color(0xFFF0F0F0), - surfaceContainer: Color(0xFFE8E8E8), - surfaceContainerHigh: Color(0xFFC8C8C8), - surfaceContainerHighest: Color(0xFFB7B7B7), - onSurface: Color(0xFF111111), - outline: Color(0xFF777777), - outlineVariant: Color(0xFFB7B7B7)); +ColorScheme colorScheme = ColorScheme( + brightness: Brightness.light, + primary: AppColors.blue, + onPrimary: AppColors.white, + primaryContainer: AppColors.blue.shade700, + onPrimaryContainer: AppColors.blue.shade50, + secondary: AppColors.green, + onSecondary: AppColors.white, + secondaryContainer: const Color(0xFFE2FFF4), + onSecondaryContainer: const Color(0xFF00480E), + tertiary: AppColors.yellow, + onTertiary: AppColors.white, + tertiaryContainer: AppColors.yellow.shade800, + onTertiaryContainer: const Color(0xFF604E10), + error: const Color(0xFFFF6953), + onError: Colors.white, + errorContainer: const Color(0xFFFFEAE7), + onErrorContainer: const Color(0xFF691E14), + surfaceDim: const Color(0xFFAFB1B9), + surface: AppColors.white, + surfaceBright: AppColors.white, + surfaceContainerLowest: AppColors.grey[1200]!, + surfaceContainerLow: AppColors.grey[1100]!, + surfaceContainer: AppColors.grey[1000]!, + surfaceContainerHigh: AppColors.grey.shade800, + surfaceContainerHighest: AppColors.grey.shade700, + onSurface: AppColors.grey.shade100, + outline: AppColors.grey.shade500, + outlineVariant: AppColors.grey.shade700, +); TextTheme textTheme = TextTheme( displaySmall: TextStyle( From a6640069be282496a1cc2f75018d3b880093203e Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 17:12:45 +0900 Subject: [PATCH 5/7] fix: adjust grey primary value for improved color accuracy --- lib/presentation/shared/constants/app_colors.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/presentation/shared/constants/app_colors.dart b/lib/presentation/shared/constants/app_colors.dart index 6658a350..501b6fe2 100644 --- a/lib/presentation/shared/constants/app_colors.dart +++ b/lib/presentation/shared/constants/app_colors.dart @@ -246,5 +246,5 @@ abstract final class AppColors { 1200: Color(0xFFF6F6F6), }, ); - static const int _greyPrimaryValue = 0xFF555555; + static const int _greyPrimaryValue = 0x545454; } From 3e9555cf38fb919c288f98000f26f5913f1bf302 Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 23:04:22 +0900 Subject: [PATCH 6/7] refactor: update color shades in AppColors and theme for improved consistency --- .../shared/constants/app_colors.dart | 103 +++++++++--------- lib/presentation/shared/theme/theme.dart | 36 +++--- 2 files changed, 69 insertions(+), 70 deletions(-) diff --git a/lib/presentation/shared/constants/app_colors.dart b/lib/presentation/shared/constants/app_colors.dart index 501b6fe2..433ecf7c 100644 --- a/lib/presentation/shared/constants/app_colors.dart +++ b/lib/presentation/shared/constants/app_colors.dart @@ -113,15 +113,15 @@ abstract final class AppColors { static const MaterialColor blue = MaterialColor( _bluePrimaryValue, { - 50: Color(0xFF212F6F), - 100: Color(0xFF2D3F92), - 200: Color(0xFF3D54BC), - 300: Color(0xFF4F69DF), - 400: Color(_bluePrimaryValue), - 500: Color(0xFF8399FF), - 600: Color(0xFFB4C2FF), - 700: Color(0xFFDCE2FF), - 800: Color(0xFFF2F4FF), + 100: Color(0xFFF3F5FF), + 200: Color(0xFFDCE3FF), + 300: Color(0xFFB5C2FF), + 400: Color(0xFF839AFF), + 500: Color(_bluePrimaryValue), + 600: Color(0xFF4F69DF), + 700: Color(0xFF3D54BC), + 800: Color(0xFF2E4092), + 900: Color(0xFF212F6F), }, ); static const int _bluePrimaryValue = 0xFF5C79FB; @@ -141,15 +141,15 @@ abstract final class AppColors { static const MaterialColor green = MaterialColor( _greenPrimaryValue, { - 50: Color(0xFF006614), - 100: Color(0xFF007A28), - 200: Color(0xFF0A9846), - 300: Color(0xFF00B15F), - 400: Color(_greenPrimaryValue), - 500: Color(0xFF2DE399), - 600: Color(0xFF50F6B3), - 700: Color(0xFF7DFFCB), - 800: Color(0xFFC5FFE8), + 100: Color(0xFFE2FFF4), + 200: Color(0xFF7EFFCC), + 300: Color(0xFF50F6B4), + 400: Color(0xFF2EE49A), + 500: Color(_greenPrimaryValue), + 600: Color(0xFF00B15F), + 700: Color(0xFF0A9846), + 800: Color(0xFF007A28), + 900: Color(0xFF006614), }, ); static const int _greenPrimaryValue = 0xFF00CA78; @@ -170,15 +170,15 @@ abstract final class AppColors { static const MaterialColor yellow = MaterialColor( _yellowPrimaryValue, { - 50: Color(0xFF826D24), - 100: Color(0xFFA98E31), - 200: Color(0xFFCCAD43), - 300: Color(0xFFE8C54A), - 400: Color(_yellowPrimaryValue), - 500: Color(0xFFFFE383), - 600: Color(0xFFFFECAD), - 700: Color(0xFFFFF2C8), - 800: Color(0xFFFFF6DA), + 100: Color(0xFFFFF6DB), + 200: Color(0xFFFFF2C8), + 300: Color(0xFFFFEDAD), + 400: Color(0xFFFFE384), + 500: Color(_yellowPrimaryValue), + 600: Color(0xFFE9C54B), + 700: Color(0xFFCDAE44), + 800: Color(0xFFAA8F31), + 900: Color(0xFF826D24), }, ); static const int _yellowPrimaryValue = 0xFFFFD956; @@ -201,19 +201,19 @@ abstract final class AppColors { static const MaterialColor red = MaterialColor( _redPrimaryValue, { - 50: Color(0xFFBF2E22), - 100: Color(0xFFD83B2B), - 200: Color(0xFFE6412F), - 300: Color(0xFFF54834), - 400: Color(0xFFFF4E39), - 500: Color(_redPrimaryValue), - 600: Color(0xFFFE8671), - 700: Color(0xFFFEA899), - 800: Color(0xFFFECBC0), - 900: Color(0xFFFFEAE7), + 50: Color(0xFFFFEAE7), + 100: Color(0xFFFECBC0), + 200: Color(0xFFFEA899), + 300: Color(0xFFFE8671), + 400: Color(_redPrimaryValue), + 500: Color(0xFFFF4E39), + 600: Color(0xFFF54834), + 700: Color(0xFFE6412F), + 800: Color(0xFFD83B2B), + 900: Color(0xFFBF2E22), }, ); - static const int _redPrimaryValue = 0xFFFF6A53; + static const int _redPrimaryValue = 0xFFFF6953; /// The grey primary color and swatch. /// {@tool snippet} @@ -231,20 +231,19 @@ abstract final class AppColors { static const MaterialColor grey = MaterialColor( _greyPrimaryValue, { - 50: Color(0xFF000000), - 100: Color(0xFF111111), - 200: Color(0xFF2A2A2A), - 300: Color(0xFF383838), - 400: Color(_greyPrimaryValue), - 500: Color(0xFF777777), - 600: Color(0xFF949494), - 700: Color(0xFFB7B7B7), - 800: Color(0xFFC8C8C8), - 900: Color(0xFFDFDFDF), - 1000: Color(0xFFE8E8E8), - 1100: Color(0xFFEFEFEF), - 1200: Color(0xFFF6F6F6), + 50: Color(0xFFF6F6F6), + 100: Color(0xFFF0F0F0), + 200: Color(0xFFE8E8E8), + 250: Color(0xFFDFDFDF), + 300: Color(0xFFC8C8C8), + 400: Color(0xFFB7B7B7), + 500: Color(_greyPrimaryValue), + 600: Color(0xFF777777), + 700: Color(0xFF545454), + 800: Color(0xFF383838), + 900: Color(0xFF2A2A2A), + 950: Color(0xFF111111), }, ); - static const int _greyPrimaryValue = 0x545454; + static const int _greyPrimaryValue = 0xFF949494; } diff --git a/lib/presentation/shared/theme/theme.dart b/lib/presentation/shared/theme/theme.dart index a552e8cc..2fc30b4e 100644 --- a/lib/presentation/shared/theme/theme.dart +++ b/lib/presentation/shared/theme/theme.dart @@ -7,31 +7,31 @@ ColorScheme colorScheme = ColorScheme( brightness: Brightness.light, primary: AppColors.blue, onPrimary: AppColors.white, - primaryContainer: AppColors.blue.shade700, - onPrimaryContainer: AppColors.blue.shade50, + primaryContainer: AppColors.blue.shade200, + onPrimaryContainer: AppColors.blue.shade900, secondary: AppColors.green, onSecondary: AppColors.white, - secondaryContainer: const Color(0xFFE2FFF4), - onSecondaryContainer: const Color(0xFF00480E), + secondaryContainer: AppColors.green.shade100, + onSecondaryContainer: AppColors.green.shade900, tertiary: AppColors.yellow, onTertiary: AppColors.white, - tertiaryContainer: AppColors.yellow.shade800, - onTertiaryContainer: const Color(0xFF604E10), - error: const Color(0xFFFF6953), + tertiaryContainer: AppColors.yellow.shade100, + onTertiaryContainer: AppColors.yellow.shade900, + error: AppColors.red, onError: Colors.white, - errorContainer: const Color(0xFFFFEAE7), - onErrorContainer: const Color(0xFF691E14), - surfaceDim: const Color(0xFFAFB1B9), + errorContainer: AppColors.red.shade50, + onErrorContainer: AppColors.red.shade900, + surfaceDim: AppColors.grey.shade400, surface: AppColors.white, surfaceBright: AppColors.white, - surfaceContainerLowest: AppColors.grey[1200]!, - surfaceContainerLow: AppColors.grey[1100]!, - surfaceContainer: AppColors.grey[1000]!, - surfaceContainerHigh: AppColors.grey.shade800, - surfaceContainerHighest: AppColors.grey.shade700, - onSurface: AppColors.grey.shade100, - outline: AppColors.grey.shade500, - outlineVariant: AppColors.grey.shade700, + surfaceContainerLowest: AppColors.grey.shade50, + surfaceContainerLow: AppColors.grey.shade100, + surfaceContainer: AppColors.grey.shade200, + surfaceContainerHigh: AppColors.grey.shade300, + surfaceContainerHighest: AppColors.grey.shade400, + onSurface: AppColors.grey.shade50, + outline: AppColors.grey.shade600, + outlineVariant: AppColors.grey.shade400, ); TextTheme textTheme = TextTheme( From c10f60702a44aefe0919a973ffa17c4b61a45179 Mon Sep 17 00:00:00 2001 From: jjoonleo Date: Sat, 1 Mar 2025 23:23:05 +0900 Subject: [PATCH 7/7] refactor: update onSurface color in ColorScheme for improved contrast --- lib/presentation/shared/theme/theme.dart | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/lib/presentation/shared/theme/theme.dart b/lib/presentation/shared/theme/theme.dart index 5e9b65c2..8d3461f5 100644 --- a/lib/presentation/shared/theme/theme.dart +++ b/lib/presentation/shared/theme/theme.dart @@ -30,7 +30,7 @@ ColorScheme colorScheme = ColorScheme( surfaceContainer: AppColors.grey.shade200, surfaceContainerHigh: AppColors.grey.shade300, surfaceContainerHighest: AppColors.grey.shade400, - onSurface: AppColors.grey.shade50, + onSurface: AppColors.grey[950]!, outline: AppColors.grey.shade600, outlineVariant: AppColors.grey.shade400, );