PWA アプリを作成する際、アプリの上部（ブラウザのアドレスバーやタスクバー）の色を変更するには theme_color を設定します。
最近のブラウザでは prefers-color-scheme に対応しており、ライトモード／ダークモードごとに異なる色を定義できます。

next.jsのapp routerの場合、layout.tsxなどでexportしているviewportにあるtheme-colorを以下のようにすると変更ができました。

 theme-color: [
 { media: "(prefers-color-scheme: light)", color: "ライトモードの色指定" },
 { media: "(prefers-color-scheme: dark)", color: "ダークモードの色指定" },
]