E-Core

Theming

Theme system and colors for E-Core

Theming

The Theming package provides a comprehensive theme system with dark mode support.

Overview

e_core_theming offers:

  • Theme Data - Pre-configured light and dark themes
  • Color System - Semantic color tokens
  • Typography - Consistent text styles
  • Spacing - Standardized spacing scale

Installation

dependencies:
  e_core_theming: ^1.0.0

Key Features

Theme Configuration

MaterialApp(
  theme: ETheme.light,
  darkTheme: ETheme.dark,
  themeMode: ThemeMode.system,
  // ...
)

Custom Themes

final customTheme = ETheme.light.copyWith(
  colorScheme: ETheme.light.colorScheme.copyWith(
    primary: Colors.purple,
  ),
);

Accessing Theme

// Get current theme
final theme = Theme.of(context);

// Get E-Core extensions
final colors = context.eColors;
final typography = context.eTypography;
final spacing = context.eSpacing;

Dark Mode Toggle

// Using a provider
final themeModeProvider = StateProvider<ThemeMode>((ref) {
  return ThemeMode.system;
});

// Toggle
ref.read(themeModeProvider.notifier).state =
    isDark ? ThemeMode.dark : ThemeMode.light;

Learn More

On this page