The order and color is less important than consistency. There are those that argue primary to the left, there are others that argue primary to the right.
The bigger concerns, IMHO, are proximity and contrast.
When one of the actions is relatively destructive, I would argue that it shouldn't even look like the primary action. If the primary action is a button, the secondary, destructive one should:
- Not look like a button
- Not be in close proximity to the primary action.
Do build off of Charle's recommendation, which handles contrast well, I'd also add increased distance:
| Cancel | X Delete User
The distance adds a bit of cognitive effort, but that's a good thing in this case. You don't want the user flying through the form, clicking the first button they see, and then realize they took a wrong turn.
Today, the distance also protects accidental taps on a touch device, which is a nice bonus as well.
In your particular example, however, it appears DELETING user is the primary action. So in that case, I think it's less of a concern that they are both buttons and close to each other. That said, you could still use the same visual model and just flip them:
| Delete User | X Cancel