// Here you have to set your styles
// ` allows you to use multiline styles
const darkTheme = `body {background-color: black}
muliLine::allowed {use: this};
`;
const grayTheme = `body {background-color: gray}`;
const lightTheme = `body {background-color: white}`;

// Array of [theme, hourOfChanging]
// e.g. now in 7-19 appends lightTheme, 19-23 — grayTheme, 23 till 7am — darkTheme
const themes = [[lightTheme, 7], [grayTheme, 19], [darkTheme, 23]];

// Black magic. Do not touch
themes.first = 0;
themes.last = themes.length-1;
themes.time = n => themes[n][1];
themes.text = n => themes[n][0];

const setStyle = style => document.head.appendChild(document.createElement('style')).textContent = style;
const currentHour = new Date().getHours();
if (currentHour < themes.time(themes.first))
    setStyle(themes.text(themes.last));
else {
    let style = themes.text(themes.first);
    for (let i=0; i<themes.length; i++)
        if (currentHour >= themes.time(i))
            style = themes.text(i);
    setStyle(style);
}