How to change the font to Arial

I was having issues with my obs chat always resetting to the default. I went through each line of the CSS and it saved on everything except for the my change of the font to arial

here is the broken CSS:

::-webkit-scrollbar {
visibility: hidden;
}
body {
color: transparent;
margin: 0px auto;
}
.chat_line {
font-size: 22px;
line-height: 25px;
opacity: 0.80 !important;
}
.chat_line .nick {
font-weight: bold;
text-transform: capitalize;
color: #000;
}
.chat_line .message {
color: #00c2ff;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
word-break: break-word !important;
font-family: “arial” !important;
}
#chat_box {
-webkit-mask-image: -webkit-gradient(linear, left 10%, left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}

Here is what is curretly working, so literally all i want to do is change the font to arial…what mistake am i making here???

::-webkit-scrollbar {
visibility: hidden;
}
body {
color: transparent;
margin: 0px auto;
}
.chat_line {
font-size: 22px;
line-height: 25px;
opacity: 0.80 !important;
}
.chat_line .nick {
font-weight: bold;
text-transform: capitalize;
color: #000;
}
.chat_line .message {
color: #00c2ff;
text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
word-break: break-word !important;

}
#chat_box {
-webkit-mask-image: -webkit-gradient(linear, left 10%, left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
}

While we don’t give support for custom CSS, I can’t help but notice you’ve misnamed the font family.

.chat_line .message {
    font-family: Arial !important;
}

The above should work.

1 Like