Edit Error Page style

The _default_wp_die_handler function is responsible for outputing the CSS you’re seeing, and whilst the callback function is hookable(see wp_die_handler), meaning you could use your own callback in it’s place, it seems a bit much to be copying and modifying the whole handler just to tweak some CSS.

There are barely any hooks in this function and it also doesn’t run the usual head actions, like wp_head. There is however one function that runs in the head part of the page when that function runs, which is hookable.

This is somewhat hacky and places the output before the existing style tag in the page, but using CSS specificity or the !important property where an ID is isn’t available for precedence, we can override later styling.

add_filter( 'wp_robots', 'wpse_question_411792' );
function wpse_question_411792( $r ) {
    global $pagenow;
    if( 'wp-comments-post.php' !== $pagenow )
        return $r;
    ?>
    <style type="text/css">
    html { background-color: #000!important; }
    body#error-page { background-color: #ccc; }
    </style>
    <?php
    return $r;
}

It’s definitely a bit hacky, but it’s cleaner than writing out a whole new die handler with modifications.

You could just as easily link a stylesheet in place of doing the styling inline, eg.

<link rel="stylesheet" href="mystyle.css">

And then do appropriate CSS overrides in the stylesheet.