If that's your goal, you probably shouldn't call the class bg-blue? It should be bg-blue-but-purple-on-mobile. But then it's definitely so specific it's the wrong way to select a style. If you want the page background to be blue but purple on mobile, write that in your CSS with a selector of "body" instead of ".bg-blue-but-purple-on-mobile"

The point being you can't do this with inline styles: "bg-purple md:bg-blue"

Yes but you should not use inline style for that (nor Tailwind).

w-full md:max-w-[100px] bg-purple dark:bg-red hover:underline

Good luck writing that as inline style.

The whole point of Tailwind is that it lets you do that. You can debate if Tailwind itself is a good idea but thats not relevant to comparing it to inline styles.