Changing the Header size and formatting

Hello, I’m not so familiar with CSS but would like to know how I can change the formatting and size of my headers using CSS? The size difference between them is huge and I’d like to make some of them bold with an underline, etc.

Thus far I only saw how to change the size of the body which is not what I want to do.

1 Like

Here are some use example CSS rules you can freely combine:

image

.rem-text.rem-header--1 {
  font-size: 32px;
  text-align: center;
  background-color: #e7e7ef;
  text-decoration: underline;
  font-weight: 900;
}

.rem-text.rem-header--2 {
  background-color: #efeff6;
  color: gray;
  font-style: italic;
  font-weight: 300;
}

.rem-text.rem-header--3 {
  background-color: #fafafd;
  font-family: monospace;
  font-size: 18px;
}
7 Likes

Would you mind sharing the pre-update default font-sizes for each header? And if it’s not too much to ask, the pre-update default regular font size and a selector for it as well as for selected document titles, please. (Tbh, I could just zoom out in browser, but that makes the emojis look too small)

Hi, @hannesfrank ! I changed the Header 2 with this code, but it seems to affect the way these documents are displayed when zoomed in (as titles, I think). Is there a way to make these changes not affect the document title format? I hope I’m being clear. Thanks!

Here is the solution:

Thanks @UMNiK!

3 Likes

Super useful! Thanks!