How to change logo size on Rocket.Chat login screen [5.4.1]


I would like to edit the size of the displayed logo on the login screen and its margin.
I found the corresponding configuration in css:

  @media all
.rcx-css-13sr1uc {
  max-height: 2.5rem !important;
  margin-inline: -0.5rem !important;

which points to:

<img src="" alt="Logo" class="rcx-box rcx-box--full rcx-css-13sr1uc">

The problem is that after adding:

  @media all
.rcx-css-13sr1uc {
  max-height: 5.5rem !important;
  margin-inline: -0.0rem !important;

to custom css nothing changes. I read in a thread on github that “important” entries cannot be overwritten or changed. Is this true?

Server Setup Information

  • Version of Rocket.Chat Server: 5.4.1
  • Deployment Method: docker
  • MongoDB Version: 4.4


Can you try the code below?

the .rcx-css-something is usually a random generated class, so you should not reference it directly.

img[alt~=“Logo”] {
max-height: none !important;

Let me know if this helps :slight_smile:


Unfortunately, it did not help - nothing has changed. The logo is still small.