Blur Sidebar - ChatGPT and Gemini

Blur Sidebar - ChatGPT and Gemini.md

Blur Sidebar

Last Updated: 2024-02-10

NOTE: Since these websites are subject to change, these stylesheets may fail to work someday. I'll put in a fix if this happens as long as I'm still using ChatGPT or Gemini in the future.

Use these stylesheets with Stylus to blur the titles of your ChatGPT / Gemini sidebar.

Blurring is nice since it prevents onlookers from seeing your history, whether you're sharing your screen on a call or when in public.

chatgpt.css

/* ==UserStyle==
@name           ChatGPT - Blur Sidebar
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    Blurs the sidebar in ChatGPT.
@author         jerieljan
==/UserStyle== */
@-moz-document domain("chat.openai.com") {
    nav li {
        filter: blur(5px);
        transform: scale(0.85);
        transition: filter 0.3s ease, transform 0.3s ease;
    }

    nav li:hover {
        filter: blur(0);
        transform: scale(1);
    }
}

gemini.css

/* ==UserStyle==
@name           Gemini - Blur Sidebar
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    Blurs the sidebar in Gemini
@author         jerieljan
==/UserStyle== */
@-moz-document domain("gemini.google.com") {

    .conversation {
        filter: blur(5px);
        transform: scale(0.85);
        transition: filter 0.3s ease, transform 0.3s ease;
    }

    .conversation:hover {
        filter: blur(0);
        transform: scale(1);
    }
}