Variables.scss seems to be ignored after upgrading from ionic 6 to 7 to 8

Starting in Ionic 8 the colors are part of Ionic itself, my guess is that they are being loaded after your colors hence overriding them.

Try changing the order:

"styles": ["src/global.scss", "src/theme/variables.scss"],

This is the order in the starter project - starters/angular/base/angular.json at e036e1f277d2d7b6ed5d512c66de399c93ebcc43 · ionic-team/starters · GitHub

The order was changed in this PR - fix(angular): variables gets loaded after global by liamdebeasi · Pull Request #1834 · ionic-team/starters · GitHub.