vgv-material-theming

Installation
SKILL.md

Theming

Material 3 theming best practices for Flutter applications using ThemeData as the single source of truth for colors, typography, component styles, and spacing.

Core Standards

Apply these standards to ALL theming work:

  • Use ThemeData as the single source of truth — never inline colors or text styles in widgets
  • Reference colors via Theme.of(context).colorScheme — never Colors.blue, Colors.red, or any hardcoded Color values
  • Reference text styles via Theme.of(context).textTheme — never inline TextStyle(...) in widget code
  • Use ColorScheme for all color definitions — Material 3's structured color system
  • Centralize component themes in ThemeData — define FilledButtonThemeData, InputDecorationTheme, etc. in the theme, not per-widget
  • Define a spacing system with a base unit — no arbitrary pixel values for padding, margins, or gaps
  • Support light and dark themes from the start — use ThemeData so theme switching requires zero conditional logic in widgets
  • Avoid conditional logic for theming in UI — never check brightness in widget code; let ThemeData handle it
  • Prefer EdgeInsets.only and EdgeInsets.symmetric — never EdgeInsets.fromLTRB (positional arguments are error-prone)

Color System

Related skills
Installs
2
GitHub Stars
110
First Seen
Apr 18, 2026