You can get more details on it here.
You can use the pMessage parameter to define a custom warning message. But as stated, not all browser will support this.
In fact, most browser (Chrome, Edge, Firefox, Opera and Safari) removed support for custom message.
Regarding the visual of the dialog, you can't change it since it's handled by the browser itself (just like the alert, confirm and prompt dialogs).
So unfortunately, you can't do much about it.
I've been trying to do this also and Max is right. The one that pops up by default isn't customizable, but I think going with a modal page pop up might work with a DA.
Unfortunately a custom modal dialog wouldn't be the same as the warn on unsaved dialog.
The warn on unsaved dialog is able to block/lock the browser.
E.g. you change something and you close the browser. The warning message will prevent the browser from closing and display the warning dialog.
A custom dialog wouldn't be able to prevent the browser from closing.
A user can still close the browser with a warning message displayed. It is not advisable but still very possible..
Los Alamos, NM
Since it's a browser feature, each could behave in a different way.
Most browsers will prevent you from closing the browser when the warning message is display (using the Warn on Unsaved feature).
From what I was able to test only Firefox allows closing the browser with the warning displayed.
It will display the warning and prevent the browser from closing. Then if the user tries to close the browser again it will close itself.
They will at least be warned beforehand.
So what I meant to say was that a custom solution (with a custom modal) that is not based on the onbeforeunload event wouldn't be able to prevent a browser from closing.
It could work perfectly fine with links within the application
But it wouldn't work with actions like the previous page button, closing the browser and such.