Skip to content

Instantly share code, notes, and snippets.

@BBoldt
Created May 9, 2016 21:22
Show Gist options
  • Select an option

  • Save BBoldt/67438fb40301144235272bdb01e1336b to your computer and use it in GitHub Desktop.

Select an option

Save BBoldt/67438fb40301144235272bdb01e1336b to your computer and use it in GitHub Desktop.
Font changing css for Better Discord
.message-content {font-size: 120%}
.message-content {color: black;}
.message-content {font-family: "Segoe UI", Georgia, Serif;}
.message-content {line-height: 1.5;}
.user-name {font: bold 16px/30px Georgia, serif;}
@T-H-MaSTeR
Copy link
Copy Markdown

Hi
How to change it for a specific language?

@Haxorzz
Copy link
Copy Markdown

Haxorzz commented Apr 26, 2022

Anyone know how to change the emoji font?

@Timtaran
Copy link
Copy Markdown

Anyone know how to change the emoji font?

No, emoji is not font

@Haxorzz
Copy link
Copy Markdown

Haxorzz commented Apr 27, 2022

how do iPhones change the emoji font on iOS discord?

@niskala5570
Copy link
Copy Markdown

niskala5570 commented May 17, 2022

@hai2145

This works well, but is it possible to change the font of a different language? Currently the Arabic font is irritating, and I'm wondering if there is a way to change it. Much thanks

image

Use unicode-range to make change only for Arabic Script.

This is what I use.

@font-face {
  font-family: "Helvetica";
  src: url("https://cdn.jsdelivr.net/gh/niskala5570/pasuanjawi@2.872/v2.727(usang)/Bahij%20Nassim/NKL-BahijNassim.woff2") format('woff2');
  unicode-range: U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF,U+10E60-10E7F,U+1EC70-1ECBF,U+1ED00-1ED4F,U+1EE00-1EEFF;
}

Change the url into any linked font you want, or change url(" ") to local("ur installed font name"); if you have the font installed.

Update 1/6/2023 : https://gist.github.com/niskala5570/520e689d4d30fc1381c0caae8e0dadcd

@PohTayTho
Copy link
Copy Markdown

Hey, so I'm a complete newbie to coding, and I dont know anything about it coding but I'm using betterdiscord's custom css thing and this code appears to be working

https://github.com/import url(https://nfld99.github.io/Better-Discord/Source_Code/Use_Fonts/Yes.css);
:root {
--Chat-Font-Used: 'Magic Cards', normal ;
--Chat-Font-Size: 15.5px;
}
:not([class="hljs"]):not(code){
font-family: var(--Chat-Font-Used)!important;
}

.markup:not(code) {
font-size: var(--Chat-Font-Size)!important;
}

It's from one of the person above, but I'm wondering on how to get a code import url like that, is that possible for a complete newbie like me?

@SonyEntertainmentNetwork
Copy link
Copy Markdown

2022?

@sky-is-winning
Copy link
Copy Markdown

2022? @SonyEntertainmentNetwork

Simply put this into the Custom CSS section in BetterDiscord

::placeholder, body, button, input, select, textarea {
    font-family: "YOUR FONT HERE";
    text-rendering: optimizeLegibility;
}

@pussysommelier
Copy link
Copy Markdown

I want to change the font, but when I do, only English letters look the way I want them to. The font doesn’t look the same for all letters. min Cyrillic. Can anyone help?
font name i founded: BlenderPro-Bold
/**

@import url('https://fonts.googleapis.com/css2?family=Rajdhani');
@import url('https://patrykbielanin.github.io/discord-cyberpunk2077-theme/base.css');

:root {
--background-primary: linear-gradient(180deg, rgba(23,0,5,1) 10%, rgba(0,0,0,1) 65%); /* Background gradient /
--background-secondary: linear-gradient(180deg, rgba(23,0,5,1) 10%, rgba(0,0,0,1) 65%); /
Background gradient /
--font-primary: 'Rajdhani'; /
Font /
--primary-text-color: lightgray; /
Font color */

--primary: 23, 13, 22;  /* Background color mainly used for popups */
--red: 255, 0, 60; /* Use RGB values */
--blue: 114, 234, 248; /* Use RGB values */
--yellow: 243, 230, 0; /* Use RGB values */
--green: 71, 213, 139; /* Use RGB values */
--dark-green: 56, 171, 111; /* Use RGB values */

}

@Alexectic
Copy link
Copy Markdown

I can't seem to figure out how to make the font work. I'm trying to use DotGothic16, a Japanese pixel font. It doesn't seem to work.
,

@panyann
Copy link
Copy Markdown

panyann commented Jan 10, 2023

2022? @SonyEntertainmentNetwork

Simply put this into the Custom CSS section in BetterDiscord

::placeholder, body, button, input, select, textarea {
    font-family: "YOUR FONT HERE";
    text-rendering: optimizeLegibility;
}

This is better, will change also a server name font and literally everything else, which your code will not do:

* {
    font-family: "Chakra Petch"!important;
}

@EliceNyne
Copy link
Copy Markdown

Hey, I'd like to know how one could change the font for codeblocks to a different font than normal text?

@mi6i
Copy link
Copy Markdown

mi6i commented Aug 24, 2023

@import url('https://fonts.googleapis.com/css2?family=Vazirmatn&display=swap');
a, abbr, acronym, address, applet, big, blockquote, body, caption, cite, code, dd, del, dfn, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, html, iframe, img, ins, kbd, label, legend, li, object, ol, p, pre, q, s, samp, small, span, strike, strong, table, tbody, td, tfoot, th, thead, tr, tt, ul, var{
font-family: 'Vazirmatn', sans-serif;
}

Simply use above css in better discord custom css place holder to change all fonts into vazirmatn (persian & arabic ) font.
And If you had problem on unicode some character change font url and name .

@eepcheep
Copy link
Copy Markdown

eepcheep commented Jan 23, 2024

i've used like like every single one of these and none of them change the font size for messages/channels/servers. any help?

@KiloTheNeko
Copy link
Copy Markdown

2022? @SonyEntertainmentNetwork

Simply put this into the Custom CSS section in BetterDiscord

::placeholder, body, button, input, select, textarea {
    font-family: "YOUR FONT HERE";
    text-rendering: optimizeLegibility;
}

This is better, will change also a server name font and literally everything else, which your code will not do:

* {
    font-family: "Chakra Petch"!important;
}

This one is the best solution

@KiloTheNeko
Copy link
Copy Markdown

i've used like like every single one of these and none of them change the font size for messages/channels/servers. any help?

are you sure your BD/Vencord is working correctly and that no other CSS is overwriting your change ?

@jatubio
Copy link
Copy Markdown

jatubio commented Mar 18, 2024

I'm using Better Discord.

I'm using a light theme and will want message text in black instead of gray.

I tried to put these on Custom CSS Editor and neither of them worked: (I used green, blue and red for testing so I will see if they're working)

* {
text-rendering: optimizeLegibility;
    --primary-text-color: green; 
}

.message-content {color: red;}
.da-messageContent {color: green;}

:root {
    --primary-text-color: green; 
}

::placeholder, body, button, input, select, textarea {
    color:blue;
}

.messageContent-2t3eCI{ color:blue !important; }

Any help, please?

@Andor-py
Copy link
Copy Markdown

@Wizerdz

@import url(https://nfld99.github.io/Better-Discord/Source_Code/Use_Fonts/Yes.css);
:root {
--Chat-Font-Used: 'Magic Cards', normal ;
--Chat-Font-Size: 15.5px;
}
:not([class="hljs"]):not(code){
font-family: var(--Chat-Font-Used)!important;
}
.markup:not(code) {
font-size: var(--Chat-Font-Size)!important;
}
Replace the url with a url of your font choice, and replace "Magic cards" and "normal" with your font name and type.

THANK YOU SO MUCH BRO! YOUR CODE HELPED ME!

THANK YOU SO MUCH BRO! YOUR CODE HELPED ME TO!

@hunabku94
Copy link
Copy Markdown

hunabku94 commented Apr 6, 2024

I'm using Better Discord.

I'm using a light theme and will want message text in black instead of gray.

I tried to put these on Custom CSS Editor and neither of them worked: (I used green, blue and red for testing so I will see if they're working)

* {
text-rendering: optimizeLegibility;
    --primary-text-color: green; 
}

.message-content {color: red;}
.da-messageContent {color: green;}

:root {
    --primary-text-color: green; 
}

::placeholder, body, button, input, select, textarea {
    color:blue;
}

.messageContent-2t3eCI{ color:blue !important; }

Any help, please?

Hey, i personally use this :

* {
font-family: "Droid Sans"!important;
color:black;
}

where Droid Sans is my font name.

@asowa12344
Copy link
Copy Markdown

im completely clueless, can someone just give me exactly what i need if i wanna use the fonts either "hylia serif" or "the wild breath of zelda"
both can be found here https://zeldauniverse.net/media/fonts/

@hunabku94
Copy link
Copy Markdown

im completely clueless, can someone just give me exactly what i need if i wanna use the fonts either "hylia serif" or "the wild breath of zelda" both can be found here https://zeldauniverse.net/media/fonts/

* {
    font-family: "Hylia Serif Beta"!important;
}

@asowa12344
Copy link
Copy Markdown

im completely clueless, can someone just give me exactly what i need if i wanna use the fonts either "hylia serif" or "the wild breath of zelda" both can be found here https://zeldauniverse.net/media/fonts/

* {
    font-family: "Hylia Serif Beta"!important;
}

thank you so much, that worked!

@ringda-18434
Copy link
Copy Markdown

how do i use segoe ui font?

@hunabku94
Copy link
Copy Markdown

go in your Windows settings and search "font", Then search "segoe" and found the show name of your choice and replace "Hylia Serif Beta" in previous comment code with it.

@ringda-18434
Copy link
Copy Markdown

i dont have windows i have macos

@hunabku94
Copy link
Copy Markdown

Ok on system settings, search for "text font", on the new window, on the line with the same name, clic on the right field to see the font list

@ahahahaha5163
Copy link
Copy Markdown

How can I change to the Mojangles font?

@hunabku94
Copy link
Copy Markdown

hunabku94 commented Feb 15, 2025

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