🎨-theme-development

[green vine]

oh, still going?

good luck with that

[half crystal]

😭

[pure cairn]

I was thinking
"what's wrong?"
then I looked at the icons

[chilly knoll]

whats the best way to theme switches?
rn i use this from cookie

/* switches background */
    div[class^="control_"] > div[class^="container_"] {
      background-color: #696779 !important;
    }
    div[class^="control_"] > div[class^="container_"][class*="checked_"] {
      background-color: #C2A775 !important;
    }
    div[class^="vc-addon-card"] > div div[class^="container_"] {
      background-color: #696779;
    }
    div[class^="vc-addon-card"] > div div[class^="container_"][class*="checked_"] {
      background-color: #C2A775;
    }
    /* switches checkmark */
    [class*="checked_"] > svg > svg > path { 
      fill: #C2A775; }
    /* switches white bit */
    div[class^=control_]>div[class^=container_][class*=checked_]>svg>rect {
      fill: var(--ec-bg2); }
    div[class^=vc-addon-card]>div div[class^=container_][class*=checked_]>svg>rect { 
      fill: var(--ec-bg2); }

but now its fucking up stuff in other plcaes (like some search bars)

[brazen quartz]

use their classes instead

[chilly knoll]

for the switch or places that are fucked

[brazen quartz]

for the switch, it gets fucked because there are tons of classes named "container"

[pure cairn]

Real

[chilly knoll]

theming desktop is more cancer than mobile now

[crimson skiff]

always has been

[brazen quartz]

I don't know about mobile, but theming discord is pretty good

[half crystal]

can i have your drugs

[brazen quartz]

try theming steam and you'll say the same

[echo frost]

I use this

[class^=control__]>[data-toggleable-component=switch].checked__6f89e {
  background-color: var(--blurple-50) !important;
  path {
    fill: var(--blurple-50) !important;
  }
}
[class^=control__]>[data-toggleable-component=switch]:not(.checked__6f89e) {
  background-color: var(--interactive-muted) !important;
  transition: background-color 0.1s ease;
}

also yours messes with search boxes

(mine did too until i finally found it was the cause a few days ago)

[chilly knoll]

me too

[chilly knoll]

thanks

[chilly knoll]

:harold:

they changed these buttons again

[onyx mesa]

so instead of adding padding to the icons they added it to the name itself

[pure cairn]

Random question
Can you theme the overlay?

(doubt but it's worth a shot)

[spring pewter]

How will u even find the classes for the overlay tho

[pure cairn]

That is a secondary question

[spring pewter]

I have an idea

Get high and guess the class name

Since thats prob how discord even makes em

[half crystal]

padk discord

[chilly knoll]

i always thought the same cuz these classes always have random lett3rs and nunb3r and I have no idea how they could possibly make sense of them all

[spring pewter]

wtf

[spring pewter]

ermmmm

class 30485048575494756

[plain kelp]

Discord obviously writes them without the hashes, those are added by whatever css modules tool they use

[chilly knoll]

or container_29373928rjjf83

[spring pewter]

awesome sauce

[spring pewter]

i love to imagine they write the hashes themselves

[half crystal]

oh im going straight to hell

[crimson skiff]

oh we know what happened the [last time we sent you there](#🎨-css-snippets message), hell is not enough for you

[half crystal]

so the horizontal channel list doesnt count as hell?

[crimson skiff]

i mean you considered the snippet as hell, but didnt mention horizontal channel list as hell

but i guess we have to send you to the third circle of hell now?

[pure cairn]

Hey, I also did a sort of horizontal channel list

But mine was still vertical in the end, so less cursed

[chilly knoll]

not good at making themes but someone rate (and test)
https://vencord.mudaranrhiod.xyz/eyecandyamoled.css

mostly looking for any light shades of greys that arent dark af

[chilly knoll]

i mean its safe

[onyx mesa]

https://cdn.discordapp.com/emojis/957963012629733376.webp?size=48&name=pepesuspicious

[chilly knoll]

https://github.com/mudrhiod/VencordThemes/blob/main/eyecandyamoled.css

¯_(ツ)_/¯

use raw github URL ig

[pure cairn]

I think I have officially killed god with this one

@half crystal I only used 2 :has()

https://github.com/Krammeth/css-snippets/blob/main/ImprovedButtons.css

[spring pewter]

Whats this

[echo frost]

is it intentional that it doesn't work if there's onl channels & roles

also doesn't work with members

for some reason it's in a div

<div><li><div class="containerDefault_c69b6d wrapper__2ea32"><div class="focusTarget__54e4b" role="button" data-list-item-id="channels___members-1020742260683448450" tabindex="-1" id="members-1020742260683448450" aria-label="Members"></div><div class="link__2ea32 basicChannelRowLink__2ea32"><div class="content__65844"><div class="iconContainer__2ea32"><svg class="icon__2ea32" aria-hidden="true" role="img" xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24"><path fill="currentColor" d="M14.5 8a3 3 0 1 0-2.7-4.3c-.2.4.06.86.44 1.12a5 5 0 0 1 2.14 3.08c.01.06.06.1.12.1ZM18.44 17.27c.15.43.54.73 1 .73h1.06c.83 0 1.5-.67 1.5-1.5a7.5 7.5 0 0 0-6.5-7.43c-.55-.08-.99.38-1.1.92-.06.3-.15.6-.26.87-.23.58-.05 1.3.47 1.63a9.53 9.53 0 0 1 3.83 4.78ZM12.5 9a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM2 20.5a7.5 7.5 0 0 1 15 0c0 .83-.67 1.5-1.5 1.5a.2.2 0 0 1-.2-.16c-.2-.96-.56-1.87-.88-2.54-.1-.23-.42-.15-.42.1v2.1a.5.5 0 0 1-.5.5h-8a.5.5 0 0 1-.5-.5v-2.1c0-.25-.31-.33-.42-.1-.32.67-.67 1.58-.88 2.54a.2.2 0 0 1-.2.16A1.5 1.5 0 0 1 2 20.5Z" class=""></path></svg></div><div class="name__2ea32" aria-hidden="true">Members</div></div></div></div></li></div>```

wtf why no syntax highlighting smh

[pure cairn]

Yeah, because it was honestly ugly to just have a small button there

[pure cairn]

Will fix later

[pure cairn]

should be fixed, I edited the file on the github mobile app so I have no idea if I missed brackets or something

[crimson skiff]

use termux

[pure cairn]

If you tell me what to do with it, sure I'll use it

[chilly knoll]

or just find any a code editor (there are some for android)

[pure cairn]

I do have one but I was already on the github app so I cba to switch

[half crystal]

hey @echo frost i figured out a fix for the small top icons: just make them all do it

[oak plover]

[pure cairn]

Surprisingly, I don't hate it

I feel like I could add it to the top buttons like Channels & Roles etc

It wouldn't even be too difficult to do tbh

[half crystal]

yeah just 2 small problems

1. i broke the scroller
2. threads

[pure cairn]

Threads hmmm

You might as well just hide them tbh

They're accessible in the channel button and popover anyway

[half crystal]

last time i hid somehing available elsewhere i got banned from css-snippets so

[pure cairn]

Lmao why

[half crystal]

""no shitpost snippets""

[pure cairn]

But this is allowed
#🎨-css-snippets message

[half crystal]

like sure, i mkae a fucking horizontal channel list, but NOOOO, the minimal snippet gets me banned

[pure cairn]

I still remember the watermark snippets people were posting last year

[half crystal]

what the fuck

[pure cairn]

[half crystal]

mad cursed

[pure cairn]

Replace them with a • atp

[half crystal]

uh @pure cairn you know how sto stop channel lazyrendering?

[pure cairn]

Nope

[half crystal]

fuck

[pure cairn]

Indeed

I think it's js side or something

[half crystal]

fun fact! deleting these 2 divs and scrolling crashes discord!

[pure cairn]

Because I tried once setting the max-height to the scroller to fit-content and it still didn't help with it, it made it worse

[half crystal]

and setting their height to 0 create the epilepsynator!

[pure cairn]

Oh, that's what is causing the jiggle?

Good to know, I set the 2nd one height to 0 in my snippet

Will have to fix that later then

[tender hedge]

cant figure out how to move inbox and other titlebar items except the close min and max buttons back to the right after making mac os like buttons

[echo frost]

what's wrong with the tooltip

[pure cairn]

Turns out it's not only that, but even just hiding elements and making the scroller shorter than what it should be causes it to flicker like crazy because of the lazyloading

A solution might be to set max-height to fit-content, but it'll break the unread messages popup

And most likely other things

[half crystal]

I'm simultaneously hovering over the channel and the icon at the same time

[oak plover]

I might be misremembering, but does the aria label for a channel contain both the channel name and the channel type in it

[half crystal]

Yes, I think

[pure cairn]

I'm going crazy

cool

[iron smelt]

Can you go something, you already are?
-# /joke

[pure cairn]

this must not see the light of day or my css posting privileges will be revoked

[half crystal]

live up to the name

[pure cairn]

absolutely

[pure cairn]

oh god, I made it so much worse

[pure cairn]

[half crystal]

what the fuck are you doing

[pure cairn]

nesting from #app-mount

[half crystal]

why

[pure cairn]

good question, I don't know

but it's funny so I'll keep going

[echo frost]

can i see it :)

[echo frost]

are you doing like julien does?

#🎨-theme-development message

[pure cairn]

Nope

[pure cairn]

Maybe tomorrow

[crimson skiff]

that's just someone being mentally ill

[tranquil whale]

should I make another theme

but make it over complex

I need some recomendations on what css snipets I should use

Im open to all Ideas

[tranquil whale]

does anyone know how to make the watermark thats in chillax and clearvision and many others

[pure cairn]

Look at the code (?)

[tranquil whale]

not started

building the base now

what do you mean Im not very good at css

but where do I put it and how

and Im trying to fix a theme

since that would be easier

https://arch-linux.pro/sid.css

but how do I find the themes section componenet

should I just try in bits?

[pure cairn]

Inspect element

ctrl + shift + i

[tranquil whale]

found it manually

thats the main bit

[tranquil whale]

I need a spotify player snippet

[errant zenith]

what kind of

[tranquil whale]

just a nice cozy overcomplex cool one

[errant zenith]

i made one

[errant zenith]

#🎨-css-snippets message

[tranquil whale]

in use already its in most of my themes

[errant zenith]

oh lmao 😭

[errant zenith]

nice

[errant zenith]

i can probably help with some stuff in your theme if you want me to

[tranquil whale]

that would be amazing

very early beta

can take whatever working code from https://arch-linux.pro/sid.css as possible

extra files https://github.com/ZapGaming/Flashcord

[errant zenith]

alr ill try doing something with it whenever i have time

[tranquil whale]

thanks if u got any questions just dm me

[errant zenith]

alr alr

[tranquil whale]

this good

or not

[errant zenith]

i personally prefer when its rounded but

whatever works for you

[tranquil whale]

how do I round it

Im stupid

what do u think

gonna have to combine 3 themes

[errant zenith]

border-radius: [any number]px;

[tranquil whale]

thanks

way better

but how do I do it curved with background photo

how do I fix

[burnt lake]

Can anyone help solve this problem?
Because the red button labeled “new” covers the DMs I made so that they would not disappear but always be visible.

css full in file 1287 line

The quality is so poor, I know because I'm not very good at it.

[short lynx]

hey, I don't really know where to post that but a friend of mine tried to do a transparent theme but it didn't work
transparency settings in the app did not work
* { background: transparent} worked but opacity: 0.5 put everything in grayscale
they use sway on linux if that can help
do you have any idea of what could be done?

[halcyon crypt]

Discord did something, again, and I don't like it, I can only see one person typing
they "shrunk" the bar above the text area
can anyone fix it please?
-# it's better visible themed, the second image. the first image is without Vencord

[burnt lake]

I want the red NEW button (the one for unread messages) to appear directly below the list of private messages (DMs) in Discord.
I also want this button to always be right below the DM list—regardless of how many private messages I have—so that it adjusts and doesn't cover the DMs or end up somewhere else.

When scrolling, I made it so that the DMs always stay in place, but I can't see it in the CSS.

[twin cairn]

Slowmode fix:

#🎨-theme-development message

Use this guy's code to fix the problem.

[twin cairn]

No one made a fix for it so I did it myself

[echo frost]

nvm. this shows behind the member list if that's not collapsed
~~```css
.cooldownWrapper_b21699 {
position: fixed;
right: 0;
}

[echo frost]

that's not yourself

ai's don't know the classes. it completely hallucinated them

and it doesn't even work right?

[twin cairn]

And I am not taking any credit for it, if it was mine, I would've gladly said it's mine. But since it's ai, I can't take credit.

[atomic plank]

does someone have a css snippet for the open dyslexic font?

[twin cairn]

The css for me works, I tried it and it is right where it is as I said up there

[echo frost]

it does this if you have the member list collapsed

[twin cairn]

Yeah, that's the issue

Can't fix it, but oh well, it works for me to say the least

[echo frost]

Here's a proper fix

.typing_b88801 {
  width: 100% !important;

  >.cooldownWrapper_b21699 {
    margin-right: 16px;
  }
}

@twin cairn ^

[twin cairn]

[echo frost]

probably a theme conflict?

[twin cairn]

Not using any

[echo frost]

yes you are

unless maybe it's an experiment/plugin

[twin cairn]

Nada

[echo frost]

it's something

[echo frost]

so you're not using ANY other css than this?

oh wait

[twin cairn]

Without vencord it does the same thing btw

So it doesn't matter whether it is vencord or not

[echo frost]

nvm. the image rounding made it look like there's css

[echo frost]

oh oops found the problem

.typing_b88801 {
  width: 100% !important;

  >.cooldownWrapper_b21699 {
    margin-right: 16px;
  }
}

[twin cairn]

Yeah, not making stuff up. Still tho, my bad for not knowing how to code, but nobody made it

[echo frost]

i didn't even notice it

when did it happen

[twin cairn]

Today

Discord decided "we should roll a new update that nobody asked for"

And just put it right next to "is typing"

[twin cairn]

Also credited you here @echo frost in any case somebody searches the word slowmode

Thanks for having the better knowledge unlike many who don't know how to code

[echo frost]

If you have it downloaded, you can just do ```css

• {
  font-family: "opendyslexic" !important;
  }

[atomic plank]

oh

I do not have it downloaded but that looks a lot easier

[iron smelt]

https://github.com/KingKusuo/discord-dyslexia-refurbished

It should still work

Just use the theme

[atomic plank]

can I overlay that with my clear vision?

Ah that indeed works

[tranquil whale]

what is the code to make the background transperent including the server list member list channel list and borders

[crimson skiff]

.visual-refresh #app-mount * { background: transparent !important }

[livid horizon]

is there any way to change those buttons back into circles?

[chilly knoll]

does anyone know how to theme this (white part of the switch)

i think i did it

[marble monolith]

zamn new update broke the css snippet I was using for more compact context menus

[burnt sky]

.menu_c1e9c4:has(.scroller_c1e9c4) {
  min-width: 0;
  width: 171px !important;
  &::after,.scroller_c1e9c4 {
      /* border margin */
      margin: -4px;
  }
  &::after,.separator_c1e9c4 {
      /* separator margin */
      margin: 1px 8px !important;
  }
  &::after,.wrapper_f563df {
      /* reactions margin */
      padding: 0px !important;
      margin: 1px;
  }
  &::after,.item_c1e9c4 {
      /* min-height is 32px as default, change value for desired look */
      min-height: 0;
      /* padding is 4px 8px as default, change value for desired look */
      padding: 4px 8px;
  }
  &::after,.icon_f563df {
      /* reactions size */
      width: 18px;
  }
  &::after,.button_f563df {
      /* reactions border size */
      width: 36px;
      height: 36px;
      border-radius: 4px;
  }
  &::after,.icon_c1e9c4 {
      /* icons size */
      width: 18px;
      height: 18px;
  }
  &::after,.iconContainer_c1e9c4 {
      display: flex;
      justify-content: center;
      align-items: center;
  }
}```

[echo frost]

you should just be able to do fill:
you might need a !important

[echo frost]

you can use a higher border-radius

[chilly knoll]

yeh, was shocked that I managed to figure it out based on what I already had

[burnt lake]

Does anyone have time to help? https://cdn.discordapp.com/emojis/1116510275185688660.gif?size=512&animated=true&name=peepoPls
#🎨-theme-development message
#🎨-theme-development message

[jovial arrow]

any way to line these up again? </3

nevermind i found a very busted solution 🫶

[echo frost]

there's an experiment for it that i'm pretty sure is default enabled

dev://experiment/2025-05_align_chat_input

[late lichen]

i want to have blurred stuff behind the "user area" but then the scroll bar does this, anyone knows a fix?

maybe its the way im doing it

.scroller__99e7c,
.align-chat-input .scroller__629e4 {
    margin-bottom: 0px;
    padding-bottom: calc(var(--custom-app-panels-height)*2);
}

.scroller__629e4 .content__99f8c {
   padding-bottom: var(--custom-app-panels-height); 
}

.align-chat-input .container__2637a {
    padding-bottom: 0px;
}

[green vine]

?

you might as well do * {
background: transparent;}

[crimson skiff]

does what he asked for, with a higher specifity

[green vine]

monkeys paw moment

"I want my discord stuff to be transparent"
"so it will be"

[green vine]

it might be an issue with your theme

[tender hedge]

how does one move this button back to the right

css i use to move the win title bar buttons to the left if it helps

[burnt lake]

I don't know if anyone else has done this yet, but I did it too. It's a transparent setting without blur.

.standardSidebarView__23e6b {
    opacity: 0.9;
    top: -22px;
}

.standardSidebarView__23e6b .sidebar__23e6b,
.standardSidebarView__23e6b .contentRegion__23e6b {
    opacity: 100%;
    top: -22px;
}

.sidebarRegionScroller__23e6b {
    top: -22px !important;
    background: black !important;
}

[lunar bough]

only for those who use BetterSettings plugin, I disabled it and use my old code just as usual with transparent settings modal

[late lichen]

should i keep the " | Vencord" text? or just " - Discord"

nah, im taking it out

[upper juniper]

Has anyone's themes broken?

oh oops maybe wrong channel

[echo frost]

no this is the right channel

can you be more specific

[upper juniper]

specifically the SettingsModal by DevilBro wasn't overlaying Discord, but it wasn't any different to the normal settings. It looks like it's related to BetterSettings plugin, because when I disabled the 'Disable Fade' setting it resolved itself for me

[burnt sky]

that one on the bd website hasn't been updated since 2023

[upper juniper]

oh oops

info

wait

[burnt sky]

your trying to get this?

[upper juniper]

Ya I did end up fixing it after unchecking the 'Disable Fade' setting in BetterSettings

[burnt sky]

the one im using is working fine with that enabled

[upper juniper]

weird

[burnt sky]

because its not by devilbro

[upper juniper]

where should I get the theme?

Ya weird, it always breaks when I toggle that setting

[burnt sky]

https://github.com/nvhhr/discordcss/blob/main/snippets/modalsettings.theme.css
this here is where i got mine

[upper juniper]

That one doesn't even work with that setting disabled

weird

[clear siren]

hmm

[green vine]

#1420116386306588672 message

[echo frost]

it doesn't even bother me that much

[green vine]

I honestly expected to hate it more myself

I'm surprised with how well it turned out, it actually kind of works

with what I have right now everything works like native, except top to bottom

the only issue is that scrolling is reversed and to fix would be to require a js snippet too

I actually got used to it after some time

I'm going to pretend it's still the worst thing ever made because it's funny

[half crystal]

oh fuck ive gotten such a fucking bad idea
such a fucking bad idea

[half crystal]

server list in the channel list, anyone?

[crimson skiff]

why (do not answer 'why not' i need a definite answer)

[half crystal]

msn/aerochat

[tardy sage]

where did they move the theme development testing tool to? cant find it in the new menu

[red mirage]

It doesn't work

[half crystal]

very silly color debugging

[half crystal]

you dont wanna see the mess behind this

[iron smelt]

They removed it

[red mirage]

Why?

[iron smelt]

I dont work for Discord, why would I know

[polar wasp]

im pretty sure its just enabled now for everyone

[iron smelt]

That’s usually what happens when experiments get removed

The idea is either scrapped or it’s given to everyone

In this case, it’s the second option

[polar wasp]

broke my css that made the bar smaller instead to make it line up ill have to fix it later lol

[echo frost]

you can enable it right from the embed

[austere cloak]

Anyone can help me removing the grey circle ugly around avatars / status ?

[cosmic vault]

back when they initially rolled this out i wrote a preemptive fix to chatbar size, but has anyone figured out how to remove that dumbass space that discord didn't think about with the new "person is typing" location? because this is annoying as hell

[green vine]

/*Move the discord header to its rightful place*/
[class^="leading_"]+div[class*="title_"]
{ right: unset; margin-left: 10px;}

[brazen quartz]

rather .bar_c38106 .title_c38106, there are many classes with "title"

[green vine]

yeah i should publish my snippet for it

[prisma lynx]

discord's now enforcing the aligned chat box for my client, did they push the experiment to main? is there any way/completed snippets to revert just the user area? padding and spacing is super out of wack for the input box as well, but i can probably adjust it myself

[green vine]

here

[green vine]

/* Chat gradient */
.chatGradientBase__36d07 { display: none; }

/* Temporary probably, fixes discord bottom aligned chat experiment */
.align-chat-input .scrollerSpacer__36d07 {
    height: 30px;
}

/* Make typing dots have text shadow */
.typingDots_b88801 {
    /* For performance and unique name reasons */ --catmeowshadow: 0 0 30px black, 0 0 10px black, 0 0 10px black;
    overflow: visible !important;
    /* The people text*/
    .text_b88801 {
        overflow: visible !important;
        text-shadow: var(--catmeowshadow), var(--catmeowshadow);
    }

    /* the Actual typing dots */
    .dots__5ad89 {
        background: rgba(0, 0, 0, 0.65);
        box-shadow: var(--catmeowshadow);
        border-radius: 100%;
        overflow: visible;
    }
}

[green vine]

hmm

[prisma lynx]

ah

[green vine]

maybe

[prisma lynx]

didnt think that was referencing what i meant

[green vine]

yeah it has been uh- manditory for a while i think

at least i had it for a while

[prisma lynx]

not until i booted my client just now

[cosmic vault]

this doesn't change anything about the gap

i already have the rest fixed

this dumbass gap

[green vine]

sure does, scrollerspacer should be the component you're looking for

its fixed on my end at elast

[cosmic vault]

applying the css didnt change anything for me unfortunately

it just changes what the background of the typing indicator looks like

[green vine]

let me try this myself

sorry its not working for you

[prisma lynx]

this is gross. not asking for a fix yet im just complaining lol

[cosmic vault]

looks like minecrafts glowing text to me

[prisma lynx]

i can mess w it myself

[green vine]

hmm what's gross

also here's how it looks on my end

[prisma lynx]

spacing between the dots and the name

[green vine]

oh- i didnt do that i didnt think

yeah thats not my fault

[prisma lynx]

i figured

nor blamed you

[green vine]

you're right my bad lmao

[brazen quartz]

use full class names, .title_c38106 would be enough

[cosmic vault]

odd

[green vine]

i fixed it

[green vine]

do you think that's good enough? i dont want to use full class names for stability reasons

[green vine]

sorry i assumed

i can try to fix it for you

can you type in chat?

thank you ive got it

[prisma lynx]

i have also generated worlds longest password

[green vine]

.align-chat-input .inTextChannel_b88801 .text_b88801 
{margin-left: 10px;}

i use the one from uh

https://syndishanx.github.io/Website/Update_Classes.html

[brazen quartz]

if you looked at the code, it automates this website

[cosmic vault]

well uh

[prisma lynx]

doesnt seem to have taken effect for me

[cosmic vault]

thats something

lemme try

[prisma lynx]

keep typing im gonna try smth

[cosmic vault]

to be clear that's not your snippet thats me fucking around

[green vine]

alright thank you

[green vine]

isnt the website itself already automated?

[cosmic vault]

this looks right

[green vine]

i made something similar myself in c#

[cosmic vault]

/* Fix for the bottom aligned chatbar experiment. */ 
.attachButton__0923f.attachButton__74017.button__24af7 {
    height: 10px;
    width: 10px;
    margin-top: 7.5px;
}
.scrollerSpacer__36d07 {
    height: 25px !important;
}

[green vine]

that seems like a lot of css for that

[cosmic vault]

just my fix for my own theme

[green vine]

i see

deci, how much longer?

[prisma lynx]

i dont know

i guess now

the class isnt taking effect

[green vine]

can i try again?

[prisma lynx]

sure

[green vine]

also you dont need to type for so long lol i can just use f8

[brazen quartz]

I mean between multiple files

[green vine]

mine looks just fine

[half crystal]

its nearly done....
my wonderful child....

[green vine]

i think the creator did the same then

[prisma lynx]

how do i enable f8 real quick

for breakpoint

[green vine]

its a vencord plugin

[prisma lynx]

cool

[cosmic vault]

when the fuck did vsc start ai auto completing

[green vine]

hmm..

[cosmic vault]

this is annoying

[green vine]

not everyone should have css privileges

[cosmic vault]

prob just a forced enable setting

[brazen quartz]

@green vine then use the website, I forgot about it, but again, I didn't have to update classes for a year or so

[cosmic vault]

someone type for a sec 🙏

double checking i did this right

close enough

adjustments need to be made

but idea is there

[brazen quartz]

also attribute selectors cause insane lag on discord, 1 more reason to not do it

[green vine]

https://github.com/SyndiShanX/Update-Classes/blob/main/Update-Classes.py

[cosmic vault]

actually what if i just make it go back to the bottom

genius idea

[half crystal]

wait
did some classes jsut update

[green vine]

some classes are always updating

oh actually that reminds me

[prisma lynx]

aHA

[half crystal]

content__99f8c my beloved just bacame content_d125d2

[green vine]

has anybody had issues with the settings menu recently?

[cosmic vault]

nop

not me at least

[green vine]

oh that explains, you never had aligned chatbar experiment

[prisma lynx]

    padding-left: 0;
}
.inTextChannel_b88801 .text_b88801 {
    margin-left: 10px;
}```

[jovial arrow]

has anyone figured out if it’s possible to make the new typing indicator disappear when you scroll up? i feel like it’s impossible but just curious

[prisma lynx]

huh?? it's on right now

it got pushed to main

[green vine]

combine the properties into a single selector

[prisma lynx]

ok i'm not THAT good with css

[green vine]

its not in your selector though?

[cosmic vault]

yum

[prisma lynx]

weird one sec

[green vine]

mm.. thats weird

[cosmic vault]

working on it

[prisma lynx]

ok, well, i dunno what happened, but it was pushed to main after i forced the experiment off for a while

[brazen quartz]

needs input + 1 css file only + I don't like python

[green vine]

??

you're high

[brazen quartz]

im just lazy

[cosmic vault]

is there any way to like

simulate someone is typing

[half crystal]

one sec BD insiders has a js snippet for that

[cosmic vault]

🙏

[green vine]

vencord also has a snippet for that

by ven

[half crystal]

ah nope fuck it req's the BD api

[green vine]

#📜-js-snippets message

you bd?

[cosmic vault]

thakn you

[half crystal]

no, im just friends 👍

[green vine]

hm

[cosmic vault]

what in the everliving fuck is happening

lmao

[green vine]

bd should be a slur in the vencord server

[prisma lynx]

Freaked it

[green vine]

you're becoming schitzofrench

[half crystal]

this is vencord, not CS2, other competitors are allowed here

[cosmic vault]

rate?

[green vine]

hmm i dont think

[cosmic vault]

act ill move it down a little

[green vine]

its not-

[cosmic vault]

hi fres that is totally not my schizophrenia

[green vine]

what are you even doing

😭

[cosmic vault]

im just making it tiny

and under

[prisma lynx]

this is also being annoying and vencord wont overwrite font-size

[green vine]

i think a beter idea would be to make space for it on the chat bar maybe

[cosmic vault]

i like my old chatbar

[green vine]

set font-size to be !important

{{SELECTOR}} {
font-size: {{VALUE}} !important;
}

[prisma lynx]

didnt work either

[green vine]

or- improve the selector

sometimes you have to do both

[prisma lynx]

im gonna be real

i have no idea what a selector is

[green vine]

what are you trying to do?

[green vine]

oh brand new to css are you?

[prisma lynx]

not really no

[green vine]

its pretty self explanitory, a selector like-

a thing that specifies what element you're targeting

[prisma lynx]

reduce the display name in the user area to 14px

[green vine]

okay let me guide you through this

[prisma lynx]

yes, and i'm targeting class text-md\/medium_cf4812 specifically

[green vine]

the element is class title_b6c092

just do

[brazen quartz]

for example: .title[data-name="test"], div[class*="container_"] (don't do this)

[cosmic vault]

i think i cooked somethinbg but this becomes problematic the second that i start typing

so its

something alright

[green vine]

.title_b6c092  
{font-size:8px;}

and if that doesnt work just make it important

[prisma lynx]

ah, i understand now- i want to target the top class that the element uses

[green vine]

but in this instance it very much does

[green vine]

dont select those types of generic elements, you're going to end up changing stuff you dont wanna change

[green vine]

well no its highly context dependant

sometimes what i do is i look at the existing css rules for that element and see which one is element specific exactly

[prisma lynx]

yeah i was trying to be aware of this mostly

[green vine]

and maybe sometimes use discord's selector to make sure to get priority

i dont like using !important for some reason

[prisma lynx]

this is what i was doing i believe
.text-md\/medium_cf4812 holds the text-size property i was looking to change

[green vine]

yeah take more factors into consideration tho

the name itself is highly generic on its own

the channel text also uses it

but i swear ive seen other elements

[cosmic vault]

good enough for me

[austere cloak]

Can someone help me plz 🙏 ?

[green vine]

not sure if thats'a good idea

but alright

[austere cloak]

I have something working few times ago but rn its nor working 🙁 they seem to remove the element where the circle was 🙁

[prisma lynx]

for some reason changing .panelTitleContainer__37e49 with Any element fixed it even though that element doesnt have the text properties

[austere cloak]

Yeah with my passt thing I have some avatar getting rdmly dissapear so I understand :c

Yeah its looking weird with it but its removing the grey ugly part :/

[prisma lynx]

i have my own website completely written from scratch in static and i thought flexbox was hard, but react is, something else, wtf

[brazen quartz]

try this:```foreignObject[mask^="url(#svg-mask-avatar-"] {
mask: none;

img {
border-radius: var(--radius-round);
}
}

[austere cloak]

Ty perfect :3

Just a little messy with phone for some person 🤔

[prisma lynx]

i can't see this no

[austere cloak]

But for default discord icon its nice !

[prisma lynx]

i copied the whole thing and it's only touching the display name in user area

desktop app uis should be small anyways. it's not a touchscreen

OH i see now

[brazen quartz]

settings > appearance > ui density

[austere cloak]

Oh its a discord avatar thing might be why all g

[prisma lynx]

the "compact" mode is uncomfortably small. some padding to look nice is ok but dont make it like a mobile app just to fill in space

google's MD3 is a good example of what i dont like

[brazen quartz]

G**gle always makes everything spacious for no reason, so it'd be an extreme example

[prisma lynx]

this is horrible

[green vine]

also does anybody know where this css from?

ive had it for as long as i remember but my friend's newer vencord installs dont have it

[half crystal]

god i know this
its a very distant vencord snippet

[austere cloak]

#🎨-css-snippets message

[green vine]

oh- jesus 2 years ago

when did i even get this?

[prisma lynx]

2 years ago

[green vine]

🙄

https://cdn.discordapp.com/emojis/1197292459781271603.gif?size=48&animated=true&name=plinKsplosion

[prisma lynx]

Ouch

[half crystal]

yeah, that's a good name for this

[green vine]

great name for this

[austere cloak]

What was it for ? 🤔

[green vine]

replaces warning text

[austere cloak]

Oh yea

[prisma lynx]

alright now my css for .buttons__37e49 isnt working even though it just was

.buttons__37e49 { gap: var(--space-4); }

fixes the uncomfortably wide padding in the user area

[brazen quartz]

try using .container__37e49 .buttons__37e49 instead or append !important to var(--space-4)

[austere cloak]

Is it possible to add a Quest buttons somewhere ? that redirect to : https://discord.com/discovery/quests
Next to inbox for example ?

I cannot just replace familycenter for exampl ?

[half crystal]

nope, injection needed

[prisma lynx]

nothin

[brazen quartz]

do you know how to use devtools ?

much easier to DIY than someone telling you what to do

[prisma lynx]

yeah

i do, and it's not really working

i dont know why but half of the properties don't work

[brazen quartz]

may be because the element is not a grid or flexbox, etc.

I don't like troubleshooting others' shit because I never know what's wrong, but on default discord it will work

[prisma lynx]

this is suddenly working now too btw

OKAY im gonna lose my shit

its depending on whether the class above it is closed or not?

[brazen quartz]

what lol

[prisma lynx]

???? this was fine before ill check this out

[brazen quartz]

a missed } ?

[prisma lynx]

prob

one sec

https://discord.com/channels/1015060230222131221/1366397397298839553

ill see if there was any updates

yeah i'd messed up the snippet somehow with a change that didnt work

well that's solved lol

time to fix the user area while in vc

it's caused by calltimer making it feel cramped cuz of how it's positioned

wtf

this is caused by a snippet i think but i have no idea which

fixed. didnt work pre update

    margin-bottom: 0;
}```

[red mirage]

how?

[half crystal]

@green vine step 1 done

[green vine]

this is too good

what's step 2

[late lichen]

thats one place to put the "top"bar

[half crystal]

this

[green vine]

XD

okay

[austere cloak]

What is ur button next to ?

[half crystal]

vencordtoolbox

[green vine]

the button to disable rabbits

[half crystal]

rabbits, but yes

wait i forgot a piece

[green vine]

this is great

can i take a shot?

[half crystal]

perfect

[green vine]

yes wonderful

there's still room for improvement in my books though

give me a second

this is going to be bad

[half crystal]

managed to patch Shine for newchatbar fixes within the span of like 5 mins from me knowing about the bug

[half crystal]

you can do moooore

[green vine]

was going off the assumption this includes everything you've done

[half crystal]

what the fuck am i doing

[green vine]

oh yeah as you continue it gets a lot harder

i can send you what i have rn

[half crystal]

fuck grids

[green vine]

here you go

.content_c48ade {
    display: flex;
    flex-direction: row-reverse;
}
.sidebar_c48ade 
{ display: flex; }
.sidebarList_c48ade 
{position:absolute; right: 0 !important;}
.content_f75fb0 
{flex-direction: row-reverse;}

i also have no idea how to work with grids so i just made everything a flex box

this is only a showcase thing because for some reason mouse doesnt work

oh i broke the scroller

[green vine]

lovely

[half crystal]

so i had a bit of fun with the chatbar and subtitle

[green vine]

appears you have

[half crystal]

i think we've created the dumbest css snippet

[green vine]

the smartest actually

the generations to come will be using us as a case study

[half crystal]

@green vine here's my full

[green vine]

maybe- of what not to do but that doesnt matter

[half crystal]

powerpoint presentations on css crimes in the 21st century

[green vine]

hmm not sure if the chatbar is- that good nessesarily

i liked the buttons on the other side

i love the-

woah what

this is actually cool

[half crystal]

yes to toolbars

[spring pewter]

cursed

[green vine]

you dont get it

uwu

im gonna go do something else

[spring pewter]

i wouldve husked

if nin0 didnt take away my reaction privileges

cant have shit in detroit

[green vine]

deserved

no husking role

[spring pewter]

all cuz i asked for a skibid plugin in #🧩-plugin-development

[half crystal]

does it make sence that i code to this music
https://www.youtube.com/watch?v=HlhIUlEhY7U

[green vine]

sense

and yeah

[echo frost]

oh it looks like it's already out of being an experiment
so you have it already

[sterile rain]

how would i make the chatbox look roughly like this again

i was previously using this to make it smaller but the top part seems to have been broken by the update in some way

should also note i know nothing about css

[sterile rain]

currently this makes the chatbox look like this, where from what i can tell only

:root {
  --custom-channel-textarea-text-area-height: 42px;
}```
seems to work

[burnt sky]

gotta love when they make chatbars worse

if someone makes a good snippet for the chatbar make sure to ping me

[late lichen]

good in what way?

[burnt sky]

that it doesn't look like shit

[wary sand]

can someone teach me to get a theme

[tranquil whale]

looks like discord shitted on us again

but now some themes are compatible for mashups

[tranquil whale]

might be region sensitive and I have canary enabled

[burnt sky]

fixed it myself that took a good annoying hour

[shadow lava]

same

[errant zenith]

theres a snippet to make it look okayish

@import url('https://abbie.github.io/discord-css/import.css');

:root {
    --\\--compact-title-bar: false;
    --\\--compact-input-box: true;
    --\\--compact-context-menu: true;
    --\\--compact-user-area: false;
    --\\--compact-channel-categories: false;
    --\\--compact-server-list: true;

    --\\--hide-nameplates: false;
    --\\--hide-guild-tags: false;
    --\\--hide-profile-effects: false;
    --\\--hide-avatar-decorations: false;
    --\\--hide-gradient-glow-usernames: false;
    --\\--hide-server-boost-goal: false;
    --\\--hide-server-activity: true;
    --\\--hide-user-activity: false;
    --\\--hide-context-menu-quick-reactions: true;
    --\\--hide-hover-quick-reactions: false;
    --\\--hide-image-edit-button: true;
    --\\--hide-gif-button: false;
    --\\--hide-sticker-button: false;
    --\\--hide-emoji-button: false;
    --\\--hide-apps-button: true;
    --\\--hide-gift-button: false;
    --\\--hide-help-button: false;
    --\\--hide-shop-button: false;
    --\\--hide-nitro-button: false;
    --\\--hide-active-now: false;
    --\\--hide-nitro-upsells: false;
    --\\--hide-vencord-desktop-platform-indicator: true;
    --\\--hide-cluttery-badges: false;
    /* ^ hides quest, hypesquad, active dev, and discriminator badges */

    --\\--darker-scrollbar: true;
    --\\--darker-hovered-message: true;
    --\\--prevent-sidebar-resizing: false;
    --\\--fix-minor-icon-misalignments: true;
} ```

[tender hedge]

this does not work with the css i provided under the message

or you misinterpreted my question

as im trying to move "leading" back to the right after making another element not display so my modified win buttons are clickable

[tender hedge]

nvm it was the "trailing" element i was reffering to but with only the discord buttons not the winbuttons

[half crystal]

presenting most likely the least cursed idea i have ever made

[echo frost]

i'm not sure if that's worthy or not

[half crystal]

wait no fuck where do i put the voice panel

[brazen quartz]

titlebar

[half crystal]

ive done that before, see kotten

[barren jewel]

anyone have the css snip or have mad a css snip to revert the "typing..." back below the chat box

they removed the experiment to revert it manually

[half crystal]

#🏥-vencord-support-🏥 pins

[barren jewel]

tysm

[smoky belfry]

dam going so hard
personally i just fixed my https://discord.com/channels/1015060230222131221/1271232889081565317

also wait they removed the line between the attachments and the message area
it looks so bad

why do they put so much spacing everywhere

[smoky belfry]

WHY TF is discord loading 28 there, it fucking looks like shit

is there any way for me to change this with CSS dynamically ?

[smoky belfry]

like look at the diff between 28 and 32...

one is blurry AF

[half crystal]

they say im wanted in 7 states for the things ive done

i love devtools

[brazen quartz]

do NOT use firefox devtools for discord

[half crystal]

im not lmao chrome is just locking up my system within 15 mins of opening devtools every time

[brazen quartz]

I'm saying it's worse there

[half crystal]

ok? that's completely irrelevant

[brazen quartz]

ok man

[half crystal]

oh i hate this

[smoky belfry]

the bro is cooking

tho you are also hurt by the blurred pfp

looks so ass, why do discord do that

[half crystal]

not my snippets' fault

[smoky belfry]

yep ik

[smoky belfry]

it's the fault of discord

[smoky belfry]

btw maybe you know, so i'm gonna ask you, but with themeattributes, other URLs for sizes are available, but when i try to replace it with content it kinda just doesn't work ?

[half crystal]

<img>'s (and others) are "drop-in-elements": they cant have pseudoelems

[smoky belfry]

yet it has a before and it works

[half crystal]

hwhat

[smoky belfry]

if the image fail to load the before show

[half crystal]

set content to any string

[smoky belfry]

doesn't seem to do anything

[brazen quartz]

you set "content" on the element, not ::before

[smoky belfry]

oh

thanks

finally

[half crystal]

i think you can only see img pseudoelems if the img doesnt have a source
idk, images, and svgs are weird

[smoky belfry]

lesgo no more weird blurry avatar

[half crystal]

i am deeply concerned by your use of stacking

[smoky belfry]

my dev css is written to follow the DOM
don't worry about it
when i actually go back to the normal stuff i actually extract parts

[half crystal]

that is simultaneously cool as shit and terrifying

[smoky belfry]

it honestly just make stuff easier to find

because i can directly see the mapping top and down

now i should be able to finally update my #1271232889081565317 snippet

thanks discord for making my life pain

i think it just looks nicer

dammit discord
they broke #1372568155716587571

[half crystal]

seems working

oh the gap lol

[smoky belfry]

yep

also dammit they only create the typing class in the form when someone is typing or the chat is in slow mode...

so i can't easily do a nice thing

this UI kinda just sucks

[half crystal]

:has my beloved

[smoky belfry]

wait please type for me 2s

[half crystal]

rewrite the entirety of discord's css i dare you

[smoky belfry]

basically i wanted to do this

[smoky belfry]

you mean rewrite discord

[half crystal]

no, its css
i tried once before. its fun until you remember everything is an edge case

[smoky belfry]

alright Rustcord is coming

[smoky belfry]

does discord really think that having a fucking 20px gap looks nice ?

[late lichen]

i was going to use this to when hover over the player but then cant see the buttons, what was i thinking

i can just click the image, buh. im just taking the opacity thing away then

[burnt lake]

Do you have a code for custom SVG?
For statuses user?

[pure cairn]

am I cooking?

[half crystal]

Yes bar banner color. That's a colpicker, not a stock button
My inner design-system designer is screaming at you, krammeth

[pure cairn]

https://tenor.com/view/oh-no-top-gear-jeremy-clarkson-no-one-cares-gif-18925814

it still works fine

and it's like the other buttons, so my ocd is satisfied

[half crystal]

BUT ITS NOT A BUTTON!!!!!!! ITS A COLOR PICKER, A COMPLETELY DIFFERENT ELEMENT
IT DESERVES UNIQUENESS TO SYMBOLISE IT INTERACTS WITH YOUR SYSTEM COLPICKER TO GET A COLOR

[pure cairn]

Good point

However

I won't be changing it back

[half crystal]

If you post this to css-snippets making a revert to the color picker will be the first thing I do

[pure cairn]

I might post part of this snippet there

Definitely not all of it

It's too unstable

[late lichen]

was the old mic the left or right image?(the red line)

[green vine]

left

[sterile rain]

anyone know how to do this

[pure cairn]

[half crystal]

mmmmmmmmmmmmmmm

[pure cairn]

Kill that

[half crystal]

so here's the concept....

[pure cairn]

I actually don't hate that, I would not have it animated on the closed folder though

[half crystal]

mixing yaoi and tabv2 is an interesting mix
yaoi mostly takes over

[upper shoal]

honestly, looks shit

cuz wtf are those folder icons

[half crystal]

we appreciate constructive feedback only

[half crystal]

discord's ones, lol
also this is a merge between 2 incompatible snippets so

[upper shoal]

its looks nice but those folder icons look awfully shit but ngl, i'd use this if i had a potato laptop

[half crystal]

once again, those are discord's icons, i did nothing to them

[pure cairn]

[half crystal]

atp make a fucking discord character creator

[pure cairn]

the code behind this is so ugly

(Discord's part, I mean)

they could've implemented it in a much better and simpler way instead of using Chinese boxes

but the snippet is serving its purpose

I just gotta keep refining it

[clear siren]

@upper juniper btw I updated my modalsettings (the one @burnt sky was also using) the other day, discord had changed things, might work for you now

https://github.com/nvhhr/discordcss/blob/main/snippets/modalsettings.theme.css turned out even simpler than it used to be

[pure cairn]

I had to tweak things around (1 line change) in ABB's code to fix the settings page overlapping with the regular client

[clear siren]

oh?

[pure cairn]

.layers__160d8:has(> .standardSidebarView__23e6b) > .container_c48ade {
  display: none;
}```

basically when the settings page is open, don't show the client page

otherwise they were overlapping

[clear siren]

no overlap on my end

[pure cairn]

might be an old version of the theme then

have you updated it recently?

[clear siren]

idk I did test the settingsmodal with other css disabled

and worked just fine (as well as with my other css enabled)

[pure cairn]

oh I wasn't talking about SettingsModal

[clear siren]

ah

[brazen quartz]

.container_c48ade:not(:only-child)

[clear siren]

yeah idk my css might be different in too many places

[pure cairn]

genius

why did I not think of that

[half crystal]

@pure cairn i made the profile in the profiles menu sticky, you do not wanna see how much shit i did for this

[pure cairn]

It's useful since the original menu has you scroll down a lot

Not as much on my end though

[oak plover]

i've been concepting this recently

[pure cairn]

Holy cooking

That's an actual character creator menu right there

[spring pewter]

peak

[late lichen]

how laggy is "backdrop-filter: blur()"?

[half crystal]

not that much, as long as its not hyper-overused or over-blurred.

[burnt lake]

Do you have a code for custom SVG?
For statuses user?

[late lichen]

what do you count as “over”, like, the entire ui(every element) at 64px(or higher, idk)?

[half crystal]

yes, something like that

[smoky belfry]

i do

[half crystal]

i would but my damn quickcss wont open

[smoky belfry]

so it's that bad dam

[half crystal]

no this is just vencord being vencord

[spring pewter]

So i just got an idea

From this shit discord css

@green vine add reactions on top

[green vine]

oh i actually already did that

[half crystal]

i can be pinged too for these types of crimes

[green vine]

let me make a small snippet

[spring pewter]

I didnt know which one of u to ping

[green vine]

done!

[half crystal]

@css criminals role when

[spring pewter]

Hell yeah

Yk might as well put the username below the message too

[green vine]

.container_b7e1cb {
    display: flex;
    flex-flow: column-reverse;
}

oh i actually already did that

[spring pewter]

Did u do everything

[green vine]

i did

see this snippet

#🎨-css-snippets message

and if i didnt do something blade did everything else

like reversing the order of the panels

[spring pewter]

Horror

[green vine]

@half crystal was that publishible?

[green vine]

actually i got an even better idea just now

[spring pewter]

Can u make entire discord upside down atp

[green vine]

yeah

[half crystal]

what

[late lichen]

change the class to “*”

[green vine]

:root { rotate: 180deg; }

[spring pewter]

[green vine]

the stuff you did that reverses a bunch of stuff

was that publishible?

sharable

[half crystal]

yes, all my code is free for everyone unless i say otherwise

[green vine]

position: sticky;

[half crystal]

** no **

.profileCustomizationSection__44061>.baseLayout__44061>div:not(.sectionsContainer_def11f):has(>.preview__44061) {
    position: sticky !important;
    display: flex;
    flex-direction: column;
align-items: end;
    top: 0px !important;
    order: -1;
   right: 0px!important;
   width: calc(100% + 300px + var(--space-xxl));
   height: 0px;

   .preview__44061 {
    width: 300px;
   }
}

.tryItOutSection__9d295,
.upsellContainer__0b69f,
.container__8279f {
    display: none;
}

.baseLayout__44061,
.profileCustomizationSection__44061 {
    display: contents;
}
div:has(>.tabBar_d6f9e9)>div:not([style]):has(>.profileCustomizationSection__44061),
div:has(>div:not([style])>.profileCustomizationSection__44061) {
    display: contents;
}


#profile-customization-tab .settingsPage_f131e9 {
    padding-right: calc(300px + var(--space-xxl));
}

.contentColumn__23e6b {
    max-width: unset;
}

[green vine]

look its right there

i was right

uwu

also- what the hell is with your indenting

[half crystal]

why does everyone i know have -0 humor

[green vine]

this is horror on its own

[half crystal]

i havent pressed ctrlshifti in a while

[green vine]

is that how you reindent?

[half crystal]

yes, in the qcss window at least

[green vine]

mk

[burnt lake]

dev://experiment/2025-09-halloween-app-icons

set 1

you will receive 2 Halloween icons

[green vine]

cool

there's a vencord snippet that gives you any icon you want though

[half crystal]

how very on-discord

[green vine]

suspiciously so

[burnt lake]

Are you asking or stating?

[green vine]

stating

[burnt lake]

I know that, but I like the northern one anyway.

[green vine]

https://tenor.com/view/girls-last-tour-rule-1206-rule-1206-yuuri-gif-11998916135701201924

shame to csskind

[green vine]

its not loading

[pure cairn]

I fear no man, but the one who nests starting from #app-mount

[green vine]

ew

[half crystal]

one sec where's that one guy that's doing that

[green vine]

why so many lines

[half crystal]

#🎨-theme-development message

[pure cairn]

that's nothing

[burnt lake]

https://cdn.discordapp.com/emojis/889032126622728192.webp?size=512&name=Hmm~2

[half crystal]

look at the code map
look at the co- fuck i still cant type capitals on discord ifvigwr8jewfindegytru0wofovbgeut3ru8wefjivbheguyr89xdwmebguyrf

[green vine]

that has to be horrible for performance

i mean- you'll never have issues with getting priority

[half crystal]

no, i say what's horiible for performance

[green vine]

no

[pure cairn]

uh not really

[half crystal]

(gord- FUCK I--
I BROKE IT... i broke it! i can- fuck its back
WHAT THE D=FUCK
IOWIEFHUGIWEFHiweohfhfiIOhfwoihwoeihfwo
its like its deciding when to be capital on its own time

[green vine]

* * * { filter: blur(30px) }

[pure cairn]

2 :has() have more impact than all of this

at least on my system

[green vine]

this would be funny

*:has(*:has(*)), * * *, *{ filter: blur(30px); }

@pure cairn

[pure cairn]

?

[half crystal]

i present the unscroller

div {
    &::after {
        content: "div!";
        padding: 20px;
        background: rgba(255, 0, 0, 0.01);
        filter: blur(1000px);
        position: absolute;
    }
}

only effect is you can no longer scroll

[green vine]

hm

thats weird

why would it do that

and what were you trying to do

[half crystal]

lag machine

[green vine]

ohhhhh i should give everything a pseudoelement

[burnt lake]

What do you think of this CSS? Is it good?

.standardSidebarView__23e6b {
    opacity: 0.9;
    top: -22px;
}

.standardSidebarView__23e6b .sidebar__23e6b,
.standardSidebarView__23e6b .contentRegion__23e6b {
    opacity: 100%;
    top: -22px;
}

.sidebarRegionScroller__23e6b {
    top: -22px !important;
    background: black !important;
}

[half crystal]

discord decided that "scrolling redraws every pixel of the scroller every frame it is being scrolled

[green vine]

seems semi sane

i would personally nest

[half crystal]

yeah, you should

[burnt lake]

I just don't have control over color uniformity because the right side is a little lighter than the left.

[green vine]

?

what

[half crystal]

😭

[green vine]

yeah i should

i got an idea

[half crystal]

mmmmm

[late lichen]

• { rotate: 135deg }?

[green vine]

lmao what the hell

[half crystal]

just 3deg

[green vine]

that looks kind of cool

you could see exactly how deep a given element is

well- estimate i guess

[half crystal]

woah color gambling

[green vine]

* {
    font-size: 0px !important;
    &::before {
        position: relative;
        content: "yeah i should";
        font-size:initial;
    }
}

this is my fav color

[half crystal]

oh hell yes

[late lichen]

i think my discord did not like it, it just froze(inputs werent working, only the bg was moving)

[pure cairn]

[echo frost]

i don't get why they moved this button here instead of the top right

it's so annoying

my muscle memory

ig this works

.profileButtons__9c3be {
  position: fixed;
  top: 60px;
  right: 520px;
}

i kinda like this

.profileButtons__9c3be {
  position: fixed;
  top: 60px;
  right: 520px;

  >button.hasText_a22cb0 {
    min-width: 32px;
    min-height: 32px;
    background: var(--button-secondary-background);
    border-color: var(--border-faint);
    color: var(--button-secondary-text);
    >.buttonChildrenWrapper_a22cb0 {
      padding: 0;
      .lineClamp1__4bd52 {
        display: none;
      }
    }
  }
}

mightve gone a bit heavy on the nesting

Just made this. might be useful

/* Hide members list while devtools is open */
@media (max-width: 1000px) {
  main.chatContent_f75fb0+.container_c8ffbb {
    display: none;
  }
}

the width will probably need to be adjusted based on your monitor size

idk if there's a better way of doing it

1000px works well for me though

enjoy silksong soundtrack because i forgot to pause it

[echo frost]

actually, this needs a bit of work on the background color
that looks good on mine, but not for people with a lighter banner

[pure cairn]

https://tenor.com/view/riddler-paul-dano-new-rockstars-thumbnail-does-he-know-he-doesnt-know-gif-27552850

[rose crane]

Since they seemingly removed the experiment for the Bottom Aligned message bar... is there a way to make it smaller? Yes, Profile and message bar may be aligned, but I wish both would take less space... (padding top / bottom). THANKS in Advance!

[red mirage]

Can I make my display image and username bigger?, I don't like it at all.

[smoky belfry]

Change the font-size and use themeattributes and the CSS content
You'll also need to rescale the status indicator cause they way they do the pfp is horrendous

[burnt lake]

What is the name of the website where various CSS things like this are collected/posted?

[pure cairn]

depends on what you mean by "things like this"

[burnt lake]

generally, ready-made things for CSS, various

[smoky belfry]

#🎨-css-snippets

[burnt lake]

No, there used to be a website like that.

[smoky belfry]

no idea what you mean

[burnt lake]

a website that was a collection of CSS and HTML for small features such as frames and other elements

[smoky belfry]

i mean MDN

[pure cairn]

Something like https://html-css-js.com/?

?

[green vine]

you could also just pop devtools out in another window

thats what i do

[echo frost]

I do that when I need the width, but usually i don't, and i like having them in the same window

[green vine]

ram_shrug

fair enough

hmm

i need a css idea

[green vine]

you should add a bigger border radius on this

[green vine]

seems like a skill issue

[full rover]

holy f--k thats nice as hell

you can also turn on things too, which is nice too

[burnt sky]

Already fixed it

[green vine]

MenheraPray

[green vine]

lmao they messed up

[green vine]

.wrapper__1405b {gap: 0px;} /* Remove button section gaps*/
.buttonSection__1405b {background: transparent; border: none;} /* Remove button sections */
.attachedCaretButtonContainer_f1ceac:not(:has(.disconnect_f1ceac)) { /* make the button circular */
    transform: scale(1.4);
    margin: 0px 14px;
    overflow: hidden;
    border-radius: 100px;
    background: #252525;
}
.disconnect_f1ceac { /* Special treatment for disconnect button */
    border-radius: 100px;
    width: 55px; height: 55px;
    margin-left: 4px;
}

[green vine]

" no low effort snippets "

[river igloo]

Is there a working snippet to move the chat up when the typing/slowmode blob is visible

[late lichen]

ooo, i want that

[green vine]

hm

can do

[late lichen]

keep typing

[green vine]

isn't it already high enough? or would you want it to be smaller when it doesn't apply

[late lichen]

im going to make mine rise when someone is typing or theres the slow mode thing

(the message bar)

[late lichen]

heres mine

.inTextChannel_b88801.base_b88801 {
    bottom: 1px;
    top: unset;
    padding-left: 0;
    left: var(--space-16);
    right: 16px;
    width: unset;
}

.cooldownWrapper_b21699 {
    gap: unset;
    padding: 0;
}

.cooldownText_b21699 {
    border-top-left-radius: unset;
    border-top-right-radius: unset;
}

.scroller__36d07::-webkit-scrollbar-track {
    margin-bottom: 8px;
}

.form_f75fb0 {
    margin-top: -4px;
}

.scrollerSpacer__36d07,
.scrollerSpacer__36d07.empty__36d07 {
    height: 16px
}

.scrollerSpacer__36d07.emptyForum__36d07 {
    height: 8px
}

.wrapper__44df5 {
    margin: var(--space-8);
    margin-top: 0;
    padding: 16px 0;
}

.container__01ae2 {
    border-right: unset;
}

.floating__01ae2 {
    border-right: unset;
    border-top: unset;
}

.channelTextAreaWithTypingIndicator_fb64c9 {
    margin: 0 var(--space-8) var(--space-24);
}

.inTextChannel_b88801 .text_b88801 {
    margin-left: 4px;
}

.chatGradientBase__36d07, .chatTypingGradientAtBottom__36d07, .chatTypingGradientNotAtBottom__36d07 {
    display: none;
}

/* comment/uncomment the ":has" to change behavior */
.container_c48ade:has(.typing_b88801) {
    --custom-chat-input-margin-bottom: 24px !important;
}

.channelTextArea_f75fb0 {
    transition: margin 0.5s !important;
}```

theres probably crimes on that css but, idk

[green vine]

might be good to write comments to both remember what you're doing and help others catch up

[late lichen]

true..

[clear siren]

no obvious crimes but when you use :has() you should try to include combinators like :has(> .typing_b88801) for performance

probably negligible impact here but in some cases it can be bigger impact and builds up

idk if that works in this case or if you need other elements in there I'm on phone

but you get the idea

[half crystal]

Shitposts ≠ low effort

[clear siren]

I only do high effort shitposting

[pure cairn]

Real

[green vine]

exactly

[solid crown]

is there any way to disable the gradient role animation without disabling the hover message highlight?

[green vine]

isn't it just animation none

[half crystal]

i only upload high quality snippets of discord css code

[onyx mesa]

pretty sure it's just

.username_c19a55 { animation: none !important; }

[solid crown]

yoooo, you're amazing

tyyy

[spring pewter]

how do i obliterate these arrows

they stink

[spring pewter]

why

[half crystal]

in the immortal words of weird al yankovic:
"stick your head in the microwave and get yourself a tan"

[pure cairn]

did I miss a Vencord update somewhere by any chance?

[iron smelt]

Discord experiment

[pure cairn]

ew

[iron smelt]

dev://2025-08_voice_channel_duration