ChartTheme.light constructor

ChartTheme.light()

Create light theme with enhanced colors.

Returns a professionally designed light theme with:

• White background
• Dark text for contrast
• Subtle grid and axis colors
• Vibrant gradient color palette
• Modern rounded corners

Example

final theme = ChartTheme.light();

Implementation

factory ChartTheme.light() {
  return const ChartTheme(
    backgroundColor: Color(0xFFFFFFFF),
    textColor: Color(0xFF1F2937), // Gray 900
    gridColor: Color(0xFFE5E7EB), // Gray 200
    axisColor: Color(0xFF9CA3AF), // Gray 400
    cardBorderColor: Color(0x1A111827), // ~Gray 900 @ 10%
    overlayColor: Color(0x0F111827),
    crosshairColor: Color(0x66111827),
    tooltipBackgroundColor: Color(0xFF0B1220),
    tooltipBorderColor: Color(0x14111827),
    tooltipShadow: [
      BoxShadow(
        color: Color(0x14000000),
        blurRadius: 20,
        offset: Offset(0, 10),
        spreadRadius: -8,
      ),
      BoxShadow(
        color: Color(0x0A000000),
        blurRadius: 10,
        offset: Offset(0, 4),
        spreadRadius: -8,
      ),
    ],
    gradientColors: [
      Color(0xFF6366F1), // Indigo 500
      Color(0xFF8B5CF6), // Violet 500
      Color(0xFFEC4899), // Pink 500
      Color(0xFF10B981), // Emerald 500
      Color(0xFFF59E0B), // Amber 500
    ],
    axisLabelStyle: TextStyle(
      fontSize: 11,
      fontWeight: FontWeight.w500,
      color: Color(0xFF6B7280), // Gray 500
    ),
    tooltipStyle: TextStyle(
      fontSize: 12,
      fontWeight: FontWeight.w600,
      color: Color(0xFFF9FAFB),
      letterSpacing: -0.1,
    ),
  );
}