Hide all Nitro & Boost upsells in Discord!

DisblockOrigin.theme.css

/**
 * @name Adblock for Discord
 * @author TheSunCat and contributors
 * @version 1.0.0
 * @description Hide all Nitro & Boost upsells on Discord!
 * @source https://gist.github.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906
 */

/* ------------------ */
/* Hide Nitro upsells */
/* ------------------ */

/* Chatbox buttons */
div[aria-label="Start an Activity"] { display: none; }
button[aria-label="Send a gift"] { display: none; }

/* Hide Nitro button in Home */
a[href="/store"] { display: none; }

/* Hide shop button in Home */
a[href="/shop"] { display: none; }

/* TODO: join more than 100 servers upsell */

/* Hide Nitro tabs in Settings */
div[aria-label="User Settings"] > div[aria-label="Nitro"] { display: none; }
div[aria-label="User Settings"] > div[aria-label="Nitro"] + div { display: none; }
div[aria-label="User Settings"] > div[aria-label="Subscriptions"] { display: none; }
div[aria-label="User Settings"] > div[aria-label="Gift Inventory"] + div[class^="item_"] { display: none; }

/* Nitro separator in settings */
/*div[aria-label="User Settings"] > div[aria-label="Gift Inventory"] { display: none; }*/
/* Gift Inventory tab entirely */
/*div[aria-label="User Settings"] > div[aria-label="Gift Inventory"] + div[class^="item_"] + div[class^="separator"] { display: none; }*/

/* Hide Billing header and separator */
div[aria-label="User Settings"] > div[aria-label="Clips"] + div[class^="item_"] + div[class^="separator_"] + div[class^="header_"] { display: none; }
div[aria-label="User Settings"] > div[aria-label="Clips"] + div[class^="item_"] + div[class^="separator_"] + div[class^="header_"] ~ div[class^="header_"] { display: block; }

/* Server Profiles: Make unique profiles for each server box */
div[class*="upsellOverlayContainer_"] { display: none; }

/* Profiles: Choose a GIF avatar */
div[class^="optionBox"]:has(div[class^="text-sm-semibold"] > div[class^="optionBoxText"] > div[class^="optionBoxDescription"] > div[class^="nitroWheelFlairContainer"]) { display: none; }

/* Profiles: Change decorations exclusive to Nitro */
div[class*="decorationGridItem"]:has(div[class*="iconBadge"]) { display: none; } /* Decorations */
div[class*="effectGridItem"]:has(div[class*="iconBadge"]) { display: none; } /* Effects */

/* Profiles: Try out Nitro! box */
div[class^="premiumFeatureBorder"] { display: none; }

/* Profiles: New style ad */
#profile-customization-tab > div[class^="container"]:has(button[class*="colorBrand"]) { display: none; }

/* Profiles: Per server avatar */
div[class^="imageUploaderInner"] + div[class^="imageUploaderHint"] { display: none; }
div[class^="imageUploaderInner"] + div[class^="imageUploaderHint"] + div[class^="imageUploaderIcon"]{ display: none; }

/* Profiles: Hide profile customization ad in banners */
div[class^="bannerNitroUpsell"] { display: none;}

/* Voice & Video: Soundboard section */
div[class^="container"]:has(div[class^="children"] > div[class^="soundboardRow"]) { display: none; }

/* Appearance: Hide app icon upsell */
div[class^="selectionGroup"]:has(div[role="radiogroup"] > div > div[class^="presets"] > [class*="appIconSelectionContainer"]) { display: none; }

/* Appearance: Theme upsells */
section[class*="basicThemeSelectors_"] + section { display: none; }

/* Hide message size upsells */
div[class^="characterCount"] > div[class*=" upsell_"] { display: none; }

/* Hide Go Live quality upsells */
button[class*=" selectorButtonPremiumRequired"] { display: none; }

/* Hide ad in profile banners */
div[class^="premiumIconWrapper"] { display: none; }

/* Hide "Level up your look" ad in account profile popout */
div[class*="hasCollectiblesUpsell"] > div[class ^="userPopoutInner"] > div[class*="animation_"] { display: none; }

/* Hide "Gift Nitro" button in DM User Profile sidebar */
button[class*=" giftButton"] { display: none; }

/* Emoji popout: "Get nitro" button */
button[class^=shinyButton]:has(div[class*=premiumSubscribeButton]) { display: none; }

/* Emoji popout: "Powered by nitro" text */
div[class^=nitroTextAndBadge] { display: none; }

/* Hide "Custom emojis" Nitro text from hover tooltip */
div[class^=tooltipPremiumContent] { display: none; }

/* Emoji autocomplete upsell (wowww this stoops low, even for them) */
div[class^="nitroTopDividerContainer"], div[class^="nitroTopDividerContainer"] ~ div { display: none; }

/* Hide the 'Unlock these emoji with Nitro' in emoji picker */
div[class^=upsellContainer] { display: none; }

/* Remove the purple background in the emoji picker and autocomplete */
div[class*=categorySectionNitroLocked] { background-color: unset !important; }

/* Remove the purple divider at the bottom of the emoji picker*/
div[class^=nitroBottomDivider] { display: none; }

/* Hide the lock icon on servers icon in the emoji picker */
div[class^=categoryItemLockIconContainer] { display: none; }

/* Hide the lock icon on emoji in the emoji picker */
div[class^=emojiLockIconContainer] { display: none; }

/* Restore old grayscale filter on Nitro emojis so you don't accidentally click them and get an ad */
div[class*=categorySectionNitroLocked] > ul > li > button > img[class^="lockedEmoji"] { filter: grayscale(); }

/* Grayscale for emoji that are simply locked and not in the Nitro section */
button:has(div[class^=emojiLockIconContainer]) { filter: grayscale(); }

/* Avatar decorations upsell */
div[class*="userProfileInner_"] > div:has(div[aria-label="Go to Shop"]) { display: none; }

/* ------------- */
/* Server boosts */
/* ------------- */

/* Server Boost button in top left dropdown */
div[id="guild-header-popout-premium-subscribe"] { display: none; }
div[role="group"]:has(div[id="guild-header-popout-premium-subscribe"]) + div[role="separator"] { display: none; }

/* Server settings: Boost tab */
div[class^="serverBoostTabItem"] { display: none; }
div[class^="serverBoostTabItem"] + div[class^="separator"] { display: none; }

/* Server settings: Overview */
div[class^="divider"]:has(div > div > div > div[class^="upsell"]) { display: none; }

/* TODO: Hide role icon in Roles tab when we don't have boost lvl 2 */

/* Server settings: Stickers tab */
/* NOTE: risky, but seems ok for now */
div[class^="children_"] > div[class^="upsellContainer"] { display: none; }
div[class*="tierHeaderUnlocked"] + div { display: none; }
div[class*="tier_"]:has(div[class^="tierHeaderLocked"]) { display: none; }
div[class^="tierInProgress"] { display: none; }

/* Server settings: Custom Invite Link tab */
button[class^="shinyButton"]:has(div[class*="upsellButton"]) { display: none; }

/* Boost progress bar */
/* NOTE: risky, but seems ok for now */
ul[aria-label="Channels"] > div[role="button"][class^="container"] { display: none; }

/* TODO: would be nice to hide disabled soundboard sounds & emojis
 * However, looks like it needs to be done on the JS level. This is too buggy
div[class*="premiumDisabled_"] {display:none;}*/

/* --------------- */
/* Super reactions */
/* --------------- */

/* Super reactions button */
button[id="super-reaction-picker-tab"] { display: none; }

/* Super reaction animation */
div[class*="shakeReaction"] { animation: none !important; }
div[class^="reactionInner"] > div > div[class^="effectsWrapper"] { display: none; }
img[class*="hideEmoji"] { animation: blink-emoji 1s linear infinite; opacity: 255; }
@keyframes blink-emoji {  
  50% { opacity: 0; }
}

/* Add Super Reaction menu item */
#message-add-reaction-1 { display: none; }
#message-actions-add-reaction-1 { display: none; }
div[aria-label="Add Super Reaction"] { display: none; }

/* Upsell when hovering a Super Reaction */
div[class^="burstReactionTooltipPrompt"] { display: none; }

/* --------------------------------- */
/* Quests (straight up paid ads lol) */
/* --------------------------------- */

/* Hide quests from the gift inventory */
div[class^="questsContainer"] > * { display: none; }

/* Completed quest profile badge (doesn't provide any use so...) */
div[aria-label^="Completed a Quest"] { display: none; }

/* ------------------ */
/* General annoyances */
/* ------------------ */

/* Chatbox buttons */
button[aria-label="Open GIF picker"] { display: none; }
button[aria-label="Open sticker picker"] { display: none; }

/* Stickers tab in emoji/GIF picker (can always be opened if needed with Ctrl+S) */
button[id="sticker-picker-tab"] { display: none; }

/* Avatar decorations */
svg[class*="avatarDecoration_"] { display: none; }
img[class^="avatarDecoration_"] { display: none; }

/* Profile effects */
div[class^="profileEffects"] { display: none; }

/* Animated "Activities" hover effect in calls */
/* NOTE: would be nice to disable the white hover effect,
 * but that'd break when you're actually in an activity */ 
div[aria-labelledby^="vc-activities"] { display: none; }

/* Bugfix laggy server scroll */
div[data-dnd-name] > div[class^="wrapper"] svg { overflow: hidden; }

/* Hide Help button */
div[aria-label="Help"] { display: none; }

/* Hide explore servers button */
div[aria-label="Servers"] + div + div { display: none; }

/* Hide download button in web version */
div[aria-label="Servers"] + div[class^="tutorialContainer"] + div + div { display: none; } /* separator */
div[aria-label="Servers"] + div[class^="tutorialContainer"] + div + div + div { display: none; } /* button & click target */

/* Hide Library button in Home */
a[data-list-item-id*="___library"] { display: none; }

/* Nitro profile badges */
/*div[aria-label^="Subscriber since"], a[aria-label^="Early Supporter"] { display: none; }*/

/* Server booster profile badge */
/* div[aria-label^="Server boosting since"] { display: none; } */

/* Server booster member list badge */
/* svg[aria-label^="Server boosting since"] { display: none; } */

/* Hide all super reactions entirely */
/* div[id*="message-reactions"] div:has(div div[aria-label*="super reaction"]) { display: none; } */

/* Hide "Active Now" sidebar in friends list */
/* div[class^="nowPlayingColumn"] { display: none; } */

Yeah why not

any way to put this in stylus, so that i dont have to update it manually? i tried it like this but didnt work.

@import url('https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/3c81548d365da4a453112ddafbae4d434b8c6e91/DisblockOrigin.theme.css')

any way to put this in stylus, so that i dont have to update it manually? i tried it like this but didnt work.

@import url('https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/3c81548d365da4a453112ddafbae4d434b8c6e91/DisblockOrigin.theme.css')

You can try it like that:
https://gist.githubusercontent.com/TheSunCat/58fedaa19d6154ef3e4b2b676c286906/raw/DisblockOrigin.theme.css
This way it should auto update

Discord new profile popout changed some tags:

• Quest badge here:

-a[aria-label^="Completed a Quest"] { display: none; }
+div[aria-label^="Completed a Quest"] { display: none; }

• Nitro badges here:

-a[aria-label^="Subscriber since"], a[aria-label^="Early Supporter"] { display: none; }
+div[aria-label^="Subscriber since"], div[aria-label^="Early Supporter"] { display: none; }
-a[aria-label^="Server boosting since"] { display: none; }
+div[aria-label^="Server boosting since"] { display: none; }

Thanks! Applied.

Did you mean to revert line 152? I think it needs the li there to hide the progress bar, at least on my client.

Not sure whether or not you want to block this thing:

Here's the style:

/* Emoji picker "Enable Super Reactions" button */
div:has(> div[aria-label="Enable Super Reactions"]) { display: none; }

Also, would it be possible to have this be a UserCSS (.user.css) file, or have some sort of mirror in that format? And even with Stylus' CSP patching, @importing the raw URL doesn't work for me.

Any reason why sticker tab is hidden?

Stickers can be used fine via Vesktop plugins.

Stickers are hidden by default because it shows an ad. If you are using a client mod you can comment out the line responsible for hiding the stickers tab.

Indeed. You can also always bring up the stickers input box by hitting Ctrl+S.

Can we do something about this? For me, it only randomly appears underneath the Mutual Servers/Friends Panel in the user side panel.

My best selector would be: div[class*="overlayBackground_"]:has(div[class*="premiumSubscribeButton_"])

Not sure whether or not you want to block this thing

@gBasil It is blocked on my end, unless you are seeing it elsewhere than the emoji picker popup?

Can we do something about this? For me, it only randomly appears.

@floriegl Hrm, it looks different on my end, so your CSS doesn't block it. Do you think we should wait for the ad to become consistent or find a way to block both now? With some quick poking I haven't found a way to consistently target my version of that upsell.

Also, would it be possible to have this be a UserCSS (.user.css) file, or have some sort of mirror in that format? And even with Stylus' CSP patching, @importing the raw URL doesn't work for me.

I've long wanted to move this to a proper repo on my own forge (https://git.allpurposem.at ) where I can have more/proper control over its distribution and do stuff like that. However I don't want this project to become less accessible because of it (I'd have to enable public sign-ups I guess). Another option would be to host a proper repo on an existing public free forge such as Codeberg or Sourcehut.
I am open to any ideas to get this out of GitHub in a way that is most accessible for everyone, please feel free to suggest things.

It is blocked on my end, unless you are seeing it elsewhere than the emoji picker popup?

I re-pasted the script and it seems to work now. Thanks!

feel free to suggest things

I'll vote for Codeberg. Sourcehut is quite obtuse to use for those who aren't familiar with it.

Do you think we should wait for the ad to become consistent or find a way to block both now? With some quick poking I haven't found a way to consistently target my version of that upsell.

Yeah, a friend of mine now also got a similar one:

div[class*="overlayBackground_"]:has(div[class*="contentText_"] > a[role="button"]) would be my best guess for that. But yeah, they got really annoying with that.