light static method
Returns a light theme.
Implementation
static ThemeData light() {
final Palette colors = Palette(
primary: const Color(0xFF63B4FF),
primaryHighlight: const Color(0xFF2196F3),
primaryHighlightShiny: const Color(0xFF58A6EF),
primaryHighlightShiniest: const Color(0xFFD2E3F9),
primaryHighlightLightest: const Color(0xFFB9D9FA),
primaryLight: const Color(0xFFD2E9FE),
primaryLightest: const Color(0xFFD5EDFE),
primaryDark: const Color(0xFF1F3C5D),
primaryAuxiliary: const Color(0xFF0A2E4F),
onPrimary: const Color(0xFFFFFFFF),
onPrimaryLight: const Color(0xFFF5F5F5),
secondary: const Color(0xFF888888),
secondaryLight: const Color(0xFFCCCCCC),
secondaryHighlight: const Color(0xFFEFEFEF),
secondaryHighlightDark: const Color(0xFFDEDEDE),
secondaryHighlightDarkest: const Color(0xFFC4C4C4),
secondaryBackground: const Color(0xFF222222),
secondaryBackgroundLight: const Color(0xFF444444),
secondaryBackgroundLightest: const Color(0xFF666666),
onSecondary: const Color(0xFF4E5A78),
background: const Color(0xFFF2F5F8),
backgroundAuxiliary: const Color(0xFF0A1724),
backgroundAuxiliaryLight: const Color(0xFF132131),
backgroundAuxiliaryLighter: const Color(0xFFE6F1FE),
backgroundAuxiliaryLightest: const Color(0xFFF4F9FF),
onBackground: const Color(0xFF000000),
transparent: const Color(0x00000000),
almostTransparent: const Color(0x01000000),
accept: const Color(0x7F34B139),
acceptAuxiliary: const Color(0xFF4CAF50),
acceptLight: const Color(0xFFBFE3B9),
acceptLighter: const Color(0xFFD9FDD3),
acceptLightest: const Color(0xFFF2FDED),
decline: const Color(0xFFFF0000),
danger: const Color(0xFFF44336),
warning: const Color(0xFFFF9800),
userColors: const [
Color(0xFFD2B334),
Color(0xFF2192FF),
Color(0xFF9C27B0),
Color(0xFFFF9800),
Color(0xFF0094A7),
Color(0xFF7F81FF),
Color(0xFFFF5722),
Color(0xFFC70100),
Color(0xFF8BC34A),
Color(0xFF16712D),
Color(0xFFFF5B89),
Color(0xFF332FD0),
Color(0xFFB96215),
Color(0xFF00BF79),
Color(0xFF00ACCF),
Color(0xFFED36FF),
Color(0xFF00CC25),
Color(0xFFFF1008),
Color(0xFFCB9F7A),
],
);
final TextStyle textStyle = TextStyle(
fontFamily: 'Roboto',
color: colors.onBackground,
fontSize: 17,
fontWeight: FontWeight.w400,
height: 1.3,
letterSpacing: 0,
wordSpacing: 0,
);
final Fonts fonts = Fonts(
style: textStyle,
primary: colors.primary,
primaryHighlightLightest: colors.primaryHighlightLightest,
onBackground: colors.onBackground,
secondary: colors.secondary,
secondaryHighlight: colors.secondaryHighlight,
secondaryHighlightDarkest: colors.secondaryHighlightDarkest,
onPrimary: colors.onPrimary,
danger: colors.danger,
bold: FontWeight.w700,
regular: FontWeight.w400,
largest: 27,
larger: 24,
large: 21,
big: 18,
medium: 17,
normal: 15,
small: 13,
smaller: 11,
smallest: 9,
);
SystemChrome.setSystemUIOverlayStyle(
SystemUiOverlayStyle(
systemNavigationBarColor: colors.transparent,
statusBarColor: colors.transparent,
statusBarBrightness: Brightness.light,
statusBarIconBrightness: Brightness.dark,
),
);
final ThemeData theme = ThemeData.light();
return theme.copyWith(
extensions: [
Style(
colors: colors,
fonts: fonts,
barrierColor: colors.onBackgroundOpacity50,
cardBlur: 5,
cardBorder: Border.all(
color: colors.secondaryHighlightDark,
width: 0.5,
),
cardColor: colors.onPrimaryOpacity95,
cardHoveredColor: colors.backgroundAuxiliaryLightest,
cardHoveredBorder: Border.all(
color: colors.primaryHighlightShiniest,
width: 0.5,
),
cardRadius: BorderRadius.circular(14),
cardSelectedBorder: Border.all(
color: colors.primaryHighlightShiny,
width: 0.5,
),
contextMenuBackgroundColor: colors.onPrimary,
contextMenuHoveredColor: colors.backgroundAuxiliaryLightest,
contextMenuRadius: BorderRadius.circular(11),
linkStyle: textStyle.copyWith(color: colors.primary),
messageColor: colors.onPrimary,
primaryBorder: Border.all(
color: colors.secondaryHighlightDark,
width: 0.5,
),
readMessageColor: colors.primaryLight,
secondaryBorder: Border.all(color: colors.acceptLight, width: 0.5),
sidebarColor: colors.onPrimaryOpacity50,
systemMessageBorder: Border.all(
color: colors.secondaryHighlightDark,
width: 0.5,
),
systemMessageColor: colors.secondaryHighlight,
systemMessageStyle: fonts.small.regular.secondary,
systemMessagePrimary: fonts.small.regular.primary,
unreadMessageColor: colors.primaryLightest,
),
],
scaffoldBackgroundColor: colors.transparent,
appBarTheme: theme.appBarTheme.copyWith(
backgroundColor: colors.onPrimaryOpacity25,
foregroundColor: colors.secondary,
iconTheme: theme.appBarTheme.iconTheme?.copyWith(
color: colors.secondary,
),
actionsIconTheme: theme.appBarTheme.iconTheme?.copyWith(
color: colors.secondary,
),
elevation: 0,
centerTitle: true,
titleTextStyle: fonts.big.regular.onBackground,
),
tabBarTheme: theme.tabBarTheme.copyWith(
labelColor: colors.primary,
unselectedLabelColor: colors.secondary,
),
primaryIconTheme: const IconThemeData.fallback().copyWith(
color: colors.secondary,
),
splashColor: colors.transparent,
iconTheme: theme.iconTheme.copyWith(color: colors.onBackground),
textTheme: Typography.blackCupertino.copyWith(
displayLarge: fonts.largest.regular.onBackground,
displayMedium: fonts.larger.regular.onBackground,
displaySmall: fonts.large.regular.onBackground,
headlineLarge: fonts.big.regular.onBackground,
headlineMedium: fonts.big.regular.onBackground,
headlineSmall: fonts.small.regular.onBackground,
titleLarge: fonts.medium.regular.onBackground,
titleMedium: fonts.normal.regular.onBackground,
titleSmall: fonts.normal.bold.onBackground,
labelLarge: fonts.normal.regular.onBackground,
labelMedium: fonts.small.regular.onBackground,
labelSmall: fonts.smaller.regular.onBackground,
bodyLarge: fonts.medium.regular.onBackground,
bodyMedium: fonts.normal.regular.onBackground,
bodySmall: fonts.small.regular.onBackground,
),
inputDecorationTheme: theme.inputDecorationTheme.copyWith(
focusColor: colors.primary,
hoverColor: colors.transparent,
fillColor: colors.primary,
hintStyle: fonts.normal.regular.secondaryHighlightDarkest,
labelStyle: fonts.normal.regular.secondaryHighlightDarkest,
errorStyle: fonts.small.regular.danger,
helperStyle: fonts.normal.regular.secondaryHighlightDarkest,
prefixStyle: fonts.normal.regular.secondaryHighlightDarkest,
suffixStyle: fonts.normal.regular.secondaryHighlightDarkest,
counterStyle: fonts.small.regular.secondaryHighlightDarkest,
floatingLabelStyle: fonts.big.regular.secondary,
errorMaxLines: 5,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.primary),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.secondaryHighlightDarkest),
),
disabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.secondaryHighlightDarkest),
),
border: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.secondaryHighlightDarkest),
),
errorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.danger),
),
focusedErrorBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(12),
borderSide: BorderSide(color: colors.danger),
),
),
textSelectionTheme: theme.textSelectionTheme.copyWith(
cursorColor: colors.primary,
selectionHandleColor: colors.primary,
),
floatingActionButtonTheme: theme.floatingActionButtonTheme.copyWith(
backgroundColor: colors.primary,
foregroundColor: colors.onPrimary,
),
bottomNavigationBarTheme: theme.bottomNavigationBarTheme.copyWith(
backgroundColor: colors.primaryHighlightShiniest,
selectedItemColor: colors.primary,
unselectedItemColor: colors.secondary,
),
progressIndicatorTheme: theme.progressIndicatorTheme.copyWith(
color: colors.primary,
),
textButtonTheme: TextButtonThemeData(
style: TextButton.styleFrom(
foregroundColor: colors.secondary,
textStyle: fonts.medium.regular.secondary,
),
),
outlinedButtonTheme: OutlinedButtonThemeData(
style: OutlinedButton.styleFrom(
backgroundColor: colors.transparent,
foregroundColor: colors.secondary,
minimumSize: const Size(100, 60),
maximumSize: const Size(250, 60),
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30),
),
side: BorderSide(width: 1, color: colors.secondary),
textStyle: fonts.medium.regular.secondary,
),
),
elevatedButtonTheme: ElevatedButtonThemeData(
style: ElevatedButton.styleFrom(
backgroundColor: colors.primary,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30),
),
padding: const EdgeInsets.all(12),
textStyle: fonts.normal.regular.secondary,
),
),
scrollbarTheme: theme.scrollbarTheme.copyWith(
interactive: true,
thickness: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.dragged) ||
states.contains(WidgetState.hovered)) {
return 6;
}
return 4;
}),
),
radioTheme: theme.radioTheme.copyWith(
fillColor: WidgetStateProperty.resolveWith((states) {
if (states.contains(WidgetState.selected)) {
return Colors.white;
}
return colors.primary;
}),
),
pageTransitionsTheme: const PageTransitionsTheme(
builders: {
TargetPlatform.android: FadeUpwardsPageTransitionsBuilder(),
TargetPlatform.iOS: CustomCupertinoPageTransitionsBuilder(),
TargetPlatform.macOS: CustomCupertinoPageTransitionsBuilder(),
TargetPlatform.windows: CustomCupertinoPageTransitionsBuilder(),
TargetPlatform.linux: CustomCupertinoPageTransitionsBuilder(),
TargetPlatform.fuchsia: FadeUpwardsPageTransitionsBuilder(),
},
),
);
}