XF 1.4 Styling the error popup

Mr Lucky

Well-known member
Can someone please tell me how I change the style of the error popup message? I want to change the font colour and red background and possibly the dark grey of the box itself. Thankserror.png


XenForo moderator
Staff member
You need to use the .xenOverlay .errorOverlay .heading classes in EXTRA.css.

Mr Lucky

Well-known member
I am trying that to no avail, my css is obviously inadequate.

Can you (or anyone else) please explain what I need to put there to change

(a) the dark grey

If I change the background of .errorOverlay nothing happens.

If I change the background of .xenOverlay , then the background changes, but has square corners which extend outside the rounded border radius

(b) the text colour

I cannot get this to change at all.

(EDIT) Fine, got the text colour to change thanks

(2nd EDIT: all sorted now, thanks again)


Well-known member
.xenOverlay .errorOverlay .heading {
    color: #FFFFFF !important
    background-color: #000000 !important;

.xenOverlay .errorOverlay {
    background-color: #FFFFFF !important;
Change the colors to suit.