# material-theming

> Claude/Codex skill by [@verygoodopensource](https://omgskills.com/library/verygoodopensource/index.md) · 173 stars · Updated 2026-10-20

Best practices for Flutter theming with Material 3, treating ThemeData as the single source of truth for colors, typography, component styles, and spacing. Use when creating, modifying, or reviewing ThemeData, ColorScheme, TextTheme, component themes, spacing systems, or light/dark mode support, and whenever widget code carries its own styling: a hardcoded Color, an inline TextStyle, raw padding or gap numbers, the same decoration repeated across widget instances, or a brightness/dark-mode conditional inside build, even when the request only says "review this widget", "cut the duplication", "stop repeating this", or "tidy this up".

Tags: a11y, ai, best-practices, bloc, claude-code, dart, flutter, i18n, l10n, plugin, skills, state-management, testing, very-good-analysis, very-good-cli

## Install

```sh
git clone https://github.com/VeryGoodOpenSource/vgv-ai-flutter-plugin /tmp/vgv-ai-flutter-plugin && ln -s /tmp/vgv-ai-flutter-plugin/skills/material-theming ~/.claude/skills/material-theming
```

## From README

Material 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. fontSize and fontWeight never appear inside a build method 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.

## Links

- HTML page: https://omgskills.com/library/verygoodopensource/vgv-ai-flutter-plugin/skills/material-theming/
- GitHub: https://github.com/VeryGoodOpenSource/vgv-ai-flutter-plugin
- Author: [@verygoodopensource](https://omgskills.com/library/verygoodopensource/index.md)

## More from this repo

- [accessibility](https://omgskills.com/library/verygoodopensource/vgv-ai-flutter-plugin/skills/accessibility/index.md) — Audits or remediates Flutter widgets against WCAG 2.2 conformance levels A, AA, or AAA across iOS, Android, Web, macOS,...
   - [@verygoodopensource](https://omgskills.com/library/verygoodopensource/index.md) · 173 stars
- [animations](https://omgskills.com/library/verygoodopensource/vgv-ai-flutter-plugin/skills/animations/index.md) — Best practices for Flutter animations using the built-in animation framework, covering implicit animations, explicit...
   - [@verygoodopensource](https://omgskills.com/library/verygoodopensource/index.md) · 173 stars
- [bloc](https://omgskills.com/library/verygoodopensource/vgv-ai-flutter-plugin/skills/bloc/index.md) — Best practices for Bloc state management in Flutter/Dart, covering Cubit versus Bloc, event and state naming, sealed...
   - [@verygoodopensource](https://omgskills.com/library/verygoodopensource/index.md) · 173 stars