1. ColorSchemeの作成

ColorSchemeの作成：ColorSchemeクラスを利用し、アプリ全体で使う色の基盤を作成する。
fromSeedでの自動生成：シードカラーを基に、一貫したカラースキームを自動で生成する。
```
ColorScheme colorScheme = ColorScheme.fromSeed(
  seedColor: Colors.blue,
);
```

2. テーマデータのカスタマイズ

ThemeDataでのテーマ作成：作成したカラースキームをThemeDataに組み込み、アプリのテーマとしてカスタマイズする。
```
ThemeData themeData = ThemeData(
  colorScheme: ColorScheme.fromSeed(seedColor: Colors.blue),
);
```

3. MaterialAppへのテーマ適用

テーマの統合：MaterialAppのthemeプロパティを使用して、カスタマイズしたテーマデータをアプリ全体に適用する。
```
MaterialApp(
  theme: themeData,
  home: MyHomePage(),
);
```

4. コンポーネントへの実装

テーマから色の取り出し：Theme.of(context)を通じて、テーマデータから色を取り出し、UIコンポーネントに適用する。

Container(
  color: Theme.of(context).colorScheme.primary,
  child: Text(
    'Hello, World!',
    style: TextStyle(color: Theme.of(context).colorScheme.onPrimary),
  ),
);

`ColorScheme`のプロパティ

プロパティ	説明
`primary`	アプリケーションの主色。重要な要素に使用。
`onPrimary`	`primary`色の上のテキストやアイコンの色。
`primaryContainer`	`primary`のコンテナバリエーション。
`onPrimaryContainer`	`primaryContainer`上のテキストやアイコンの色。
`secondary`	アプリケーションの補助色。アクセントや強調に用いられる。
`onSecondary`	`secondary`色の上のテキストやアイコンの色。
`secondaryContainer`	`secondary`のコンテナバリエーション。
`onSecondaryContainer`	`secondaryContainer`上のテキストやアイコンの色。
`background`	アプリケーションの背景色。
`onBackground`	`background`色の上のテキストやアイコンの色。
`surface`	UI要素の背景色、例えばカードやメニュー。
`onSurface`	`surface`色の上のテキストやアイコンの色。
`error`	エラーを示す要素に使用される色。
`onError`	`error`色の上のテキストやアイコンの色。
`brightness`	全体の明るさ。`Brightness.light`または`Brightness.dark`。