Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
transparent betterdiscord theme with a nice megumin background
#app-mount {
/* Shinobu */
/* background-image: url("https://www.walldevil.com/wallpapers/a91/shinobu-oshino-bakemonogatari.jpg"); */
/* Megumin */
background-image: url('https://images3.alphacoders.com/704/704387.png');
background-size: cover;
}
/* transparent */
div[class^="layer"], /* Needs to be transparent */
.da-activity > .da-body, /* Currently Playing text*/
.da-category, /* Emoji selector category aka server emojis*/
/*.da-channels, Where the channels are listed */
.da-channels .da-scrollerThemed, /* Discord channels */
.container-2Thooq,.container-2lgZY8, .container-PNkimc,/* Needs to be transparent */
.da-content, /* Messages and member list */
.da-chat, /* Chat and everything to it's right */
.da-flex div[class^="chat"],
.da-headerBar,
.da-markup:not(.da-isMention), /* Message contents */
.da-scroller, /* All Scrollables */
.da-scrollerFade div[class^="scroller-"], /* All Scrollables */
.da-searchBarLight, /* Emoji searchbar */
.da-recentMentionsPopout .da-header, /* Header inside the recent mentions popup */
.da-themedPopout > .da-header, /* Header inside the pinned messages popup, could have sideeffects. Blame discord */
.da-unread, /* Tell you in which direction you can find new, unread messages */
.stop-animation,
.da-wrapper .da-flexChild,
.da-typing,
div[class^="typing"],
#friends
{
background-color: transparent !important;
}
/* Everthing else */
div[class^="contentHoveredText"], /* Channel entry hovered*/
.da-activityFeed,
.applicationStore-1pNvnv, /*.da-applicationStore, */
.gameLibrary-TTDw4Y, /*.da-library, */
.channels-Ie2l6A,
.da-content form, /* Message Textfield */
.da-divider span, /* Divider between days */
.da-gameLibrary,
.guildsWrapper-5TJh6A, /* .da-guildsWrapper, Sidebar where the discord servers are displayed */
.da-members, /* Memberlist */
.da-membersWrap,
.da-messagesWrapper, /* Contains the messages */
.da-noChannel,
.da-recentMentionsPopout .da-messageGroupWrapper, /* Message inside recent mentions */
.da-privateChannels .search-bar,
.da-themedPopout .da-messageGroupWrapper,
.friends-table
{
background-color: RGBA(0, 0, 0, 0.6) !important;
}
/* Appbar */
.da-chat .da-title, /* App bar */
.da-titleWrapper .da-title,
.da-flexChild .da-container,
#friends .da-headerBar {
background-color: RGBA(0, 0, 0, 0.9) !important;
}
/* 0.6 (Popups) */
.da-menu, /* online status popup*/
.da-embedInner, /* Embeds */
.da-emojiPicker, /* Emoji picker */
.da-popout section, /* Popup when modifying roles */
.da-themedPopout /* Mentions popup */
{
background-color: RGBA(0, 0, 0, 0.6) !important;
}
/* 0.7 Darker popups*/
.da-headerNormal, /* User info Popup header*/
.da-headerPlaying, /* User info Popup content*/
.da-userPopout .da-body:not(.da-bodyNormal), /* User info Popup content*/
.da-footer, /* User info Popup footer*/
.da-markup pre, /* Markup */
.da-markup pre code /* Markup */
{
background-color: RGBA(0, 0, 0, 0.7) !important;
}
/* 0.8 (Popup hover, focus, etc.) */
.da-menu .da-item:hover /* online status popup*/
{
background-color: RGBA(0, 0, 0, 0.8) !important;
}
/* Make things brighter */
/* 0.2 */
form .da-innerNoAutocomplete, /* main Textfield */
.da-privateChannels .search-bar .da-searchBarInner,
.da-member .da-content:hover /* Hover over a member inside the memberslist */
{
background-color: RGBA(255, 255, 255, 0.2) !important;
}
/* 0.4 */
.da-footer .da-quickMessage /* Popup Textfield*/
{
background-color: RGBA(255, 255, 255, 0.4) !important;
}
/* Mention fix */
.da-isMentioned /* The whole markup that contains the message */
{
background-color: RGBA(100, 100, 50, 0.7) !important;
}
.da-isMentioned .da-markup .da-mention /* The text that mentioned you. E.g. @You */
{
background-color: RGBA(40, 40, 80, 0.5) !important;
}
/* Fix indent*/
.da-popout header h3 /* Fixes indentation for the textfield where you can search for roles to assign */
{
margin-left: 4.5em;
}
.da-popout .da-scroller /* indents the roles inside the popup where you can assign roles */
{
margin-left: 1em;
}
.friends-table {
margin-top: 0 !important;
padding-top: 8px;
}
/* main textfield container fix*/
.da-content form {
margin: 0 !important;
padding: 0 20px;
}
/* Emoji select buttons */
#bda-qem, /* The container for the emoji tabs */
#bda-qem-emojis, /* pure discord emojis tab/button */
#bda-qem-favourite, /* ... */
#bda-qem-twitch, /* You can already guess it */
#bda-qem-twitch-container, /* Where the twitch emojis are displayed. Might have broken it */
#bda-qem-favourite-container /* Where the favourites are displayed */
{
background-color: RGBA(0, 0, 0, 0.5) !important;
}
/* Emoji select buttons */
#bda-qem > .active /* Active category when selecting an emoji */
{
background-color: black !important;
}
/* Scrollbar */
.theme-dark .messagesWrapper-3lZDfY .scroller-wrap ::-webkit-scrollbar-track-piece,
.bda-dark .emojiPicker-3m1S-j .scroller-3vODG7::-webkit-scrollbar-track-piece
{
border-color: transparent;
background-color: RGBA(50, 50, 50, 0.7);
}
/* Undo border radius */
.da-guildsWrapper,
.da-base {
border-radius: 0;
}
/* Scrollbar tracker*/
.theme-dark .messagesWrapper-3lZDfY .scroller-wrap ::-webkit-scrollbar-thumb {
border-color: RGBA(255, 255, 255, 0.0);
background-color: RGBA(20, 20, 20, 0.7);
}
.stickyHeader-1pqx0j, /* .da-stickyHeader, Sticky header that tells you the current servers for the emojis */
.da-messageGroupBlocked
{
display: none !important;
}
div[class*="innerNoAutocomplete-"] {
background-color: rgba(114,118,125,.15) !important;
}
.guilds {
background: red !important;
}
/* Custom app headers */
/* Spotify */
.headerSpotify-zpWxgT {
background-color: RGBA(29, 185, 84, 0.8) !important;
}
/* Xbox */
.headerXbox-3G-4PF {
background-color: rgba(16, 124, 16, 0.8);
}
.headerXbox-3G-4PF .da-activity .da-body {
background-color: transparent !important;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.