Skip to content

Instantly share code, notes, and snippets.

@cheesits456
Last active November 24, 2025 23:33
Show Gist options
  • Select an option

  • Save cheesits456/41d659f932b5a574b5dfb9b391a4506e to your computer and use it in GitHub Desktop.

Select an option

Save cheesits456/41d659f932b5a574b5dfb9b391a4506e to your computer and use it in GitHub Desktop.
Custom CSS for Discord to remove the GIF picker and Nitro Gift buttons from the message bar
/**
* @name Remove Buttons
* @version 1.1.1
* @author cheesits456
* @authorId 306018440639152128
* @description Remove the nitro gift, GIF picker, and sticker picker buttons from the message box. Also remove the sticker suggestion popup
* @source https://gist.github.com/cheesits456/41d659f932b5a574b5dfb9b391a4506e
* @invite 7QH4YeD
* @donate https://donate.haileybot.com
* @website https://cheesits456.dev
*/
/* Hide Nitro gift button */
button[aria-label="Send a gift"] {
display: none;
}
/* Hide GIF picker button */
button[aria-label="Open GIF picker"] {
display: none;
}
/* Hide sticker picker button */
button[aria-label="Open sticker picker"] {
display: none;
}
/* Hide annoying sticker popup window that appears when you type */
.channelTextArea-1FufC0 > .container-1ZA19X {
display: none;
}
@FlurryShy
Copy link

FlurryShy commented Oct 21, 2025

Any way to remove the Quests tab above DMs?

here's how I removed it on my end:

/* remove quest button in DMs */
a[href="/quest-home"]{
    display:none;
}

@eishiya
Copy link

eishiya commented Oct 21, 2025

This is my current list of tweaks, removing multiple annoyances. These are just selectors, grab the ones you want, put them in a single rule, and use display: none !important as the rule body (the !important isn't required for most, but doesn't hurt and I think some do need it).

A few of these rely on element order. This makes them language-agnostic (unlike the aria-label method many others use), but it means they will break if Discord changes the order. That happens infrequently enough that I prefer this method.

All the buttons in the message field except the emoji button (and the + button, that's in a different container):

[class^=channelTextArea] [class^=buttons]>div:not(:nth-child(4))

All the buttons and their container, in case you don't even want the emoji button:

[class^=channelTextArea] [class^=buttons]

The "send longer messages with Nitro!" nag box:

[class*=upsell]

(This one might also affect other upselling pop-ups. Good riddance.)

Buttons that show up on messages on hover:

div[class^=buttons][role=group]

Events, shop, Nitro, Quests in DMs list:

a[href="/activities"], a[href="/shop"], a[href="/store"], a[href="/quest-home"]

App launcher (games in voice channels):

[class^=channelAppLauncher]

Edit image with apps hover button:

div[class^=imageContainer] > *[class^=hoverButtonGroup] > *:first-child

Server tags that show up on user names:

[class*="chipletContainer"]

And this one I usually don't bother with, but this removes the custom backgrounds in server member lists, because for some reason Discord doesn't have an option to disable/hide them:

[class^=member] img[class^=img] {
    display: none;
}
[class^=member] [class^=container] {
    background: none !important;
}

@jartf
Copy link

jartf commented Nov 23, 2025

I use Vencord, so I want to leave the plugin buttons on. Here's my list of tweaks, thanks to everyone above:

/* Hide unnecessary stuff */
[class^="buttons"] .expression-picker-chat-input-button:not(div[class*="vc-chatbar-button"]), /* Emoji, GIF and sticker buttons */
[class^="buttons"] *[aria-label="Send a gift"], /* Gift Nitro button */
[class^="buttons"] .buttonContainer_e6e74f.app-launcher-entrypoint, /* App launcher button */
[class^="channelAppLauncher"], /* Apps in VCs */
[class*="chipletContainer"], /* Server tags */
[class*="upsell"], /* Nitro upsell box */
[href="/activities"], /* Activities */
[href="/library"], /* Big library button */
[href="/store"], /* Big store button */
[href="/shop"], /* Big shop button */
[href="/quest-home"], /* Big quest/mission button */
.tutorialContainer__650eb+div, /* Discovery button in server list */
div[class^="containerDefault_"]:has(div[data-list-item-id^="channels___upcoming-events"]) /* Events list in server */
{
	display: none;
}

@murderpigs
Copy link

class stuff. thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment