How do I change the background color of the body?

The simplest solution is a bit hacky, but you can use raw javascript to modify the body style:

document.body.style="background: red;";
// Or with CSS
document.body.classList.add('background-red');

A cleaner solution could be to use a head manager like react-helmet or next.js Head component.

import React from 'react';
import {Helmet} from 'react-helmet';

class Application extends React.Component {
  render () {
    return (
        <div className="application">
            <Helmet>
                <style>{'body { background-color: red; }'}</style>
            </Helmet>
            ...
        </div>
    );
  }
};

Some css-in-js also offers tools to manage global level styles; like styled-components injectGlobal.

In the end, there’s a lot of tools providing cleaner ways to handle this. But if you don’t want to rely on third party, the raw JS option might be good enough if you don’t make it too interactive.

Leave a Comment

Hata!: SQLSTATE[HY000] [1045] Access denied for user 'divattrend_liink'@'localhost' (using password: YES)