CSS Naked Day

2025-04-07 16:50 • 286 words • ~2 min read ⏲

On the 9th of April, the CSS Naked Day takes place, its intention is to promote good web development standards, like proper use of HTML, semantic markup, a good hierarchy structure, and of course, a good old play on words. The participating sites will remove all styling for a whole international day (meaning: as long as somewhere on the world it is already or still the 9th of April). One of the event organizers, Jens Meiert, has some further explanations in CSS Naked Day and the Missing Wikipedia Page:

The purpose of the event is to advocate for improved maintainability through separation of concerns. Generally speaking, this is possible only if document structure is handled by HTML, and styling and design by CSS. Removing or commenting CSS code and references, as done during CSS Naked Day, leads to displaying only the document structure as governed by user agent styling of the respective HTML code, demonstrating said separation and maintainability, and appearing “naked.” (A website or app that mixes concerns by using presentational markup would still look at least partially styled.)

In order to practice what I generally preach, I will participate as well. I've implemented the following little script for it (which should have me covered for the following years as well).

function isNakedCssDay() {
    let year  = new Date().getFullYear();
    let begin = new Date(`${year}-04-09 00:00 UTC+14:00`);
    let end   = new Date(`${year}-04-10 00:00 UTC-12:00`);
    let now   = new Date();
    return now >= begin && now <= end;
}

function removeStyling() {
    document.querySelector("link[rel=stylesheet]").remove();
    document.querySelectorAll("style").forEach(style => style.remove());
    document.querySelectorAll("*").forEach(el => el.style.cssText = "");
}

setTimeout(() => {
    if (isNakedCssDay()) {
        removeStyling();
    } 
});

For a preview outside of the event, or on other websites, you can use the removeStyling() function also as a bookmarklet.