Basic UI Settings e.g. Font Size

Most of the users don’t have much experience in tweaking the custom CSS, even if they do, sometimes it’s hard to locate the CSS elements that they intend to adjust.

Would be great if a simple dashboard with some basic UI settings is provided. Things like font, font-size, line spacing and text area width, etc.

Please upvote if you have the same need.

I think this is really needed to get more users taking up Logseq. Not everyone wants to faff around with css. Upvoted!

5 Likes

Would be nice if this could be linked to the computer where this defined. In the case I am facing, I’d like to have a different font size on my Android and computer. Android is too small to read. I can’t manage this by CSS as it would apply the settings regardless of the session, leading my computer view to be become unadapted.

5 Likes

Hi there!

currently I am using the Atlas light theme and I like it a lot, but the font size on a windows machine is really small. Is there a way to tweak the font size to be more comfortabel to old eyes like mine?

Thanks for your support!
Peter

1 Like

You can do that by editing your graph/logseq/custom.css file.
To change the font size and line height (change the values):

:root {
  --ct-text-size: 18px;
  --ct-line-height: 1.6;
}

You can also change the font used if you prefer something else:

:root {
  --ct-text-size: 18px;
  --ct-line-height: 1.6;
  --ls-font-family: "JetBrains Mono";
  --ct-page-title-font-family: var(--ls-font-family);
  --ct-code-font-family: "JetBrains Mono";
}
5 Likes

Thanks for your help, but I am afraid I do not have this in my folder structure.

It looks like that:


Bildschirmfoto 2022-01-08 um 09.29.11

The custom.css is empty :frowning:

Any ideas?

The custom.css file will be empty if you have not made any modifications, simply open it in your favorite text editor, or inside logseq and make the changes @Bader mentioned above. Hope that helps and good luck.

1 Like

Got it! Thanks!

But when I copy & paste the code into the empty css sheet, save it and restart LogSeq, it does not change anything. As far as I know, there are several values or lines in a css sheet where you can change the font size, but this is the problem: I have no idea in which line. Sometimes it looks like the size is being defined in percentage, then in eml, whatsoever …

Regards,
Peter

Copy and paste this into your custom.css, while replacing "FONT_NAME" with whatever font you want to use. The values below will only work with Atlas theme. If you switch to the Atlas theme, you may need to press CTRL+SHIFT+R to force logseq to reload your custom.css settings.

:root {
  --atlas-font-family: "FONT_NAME";
  --atlas-title-font-family: "FONT_NAME";
}
1 Like

It is strange but it seems that adding values to the customer.css does not have any effect on the fonts, neither when I refresh with CTRL+SHIFT+R

Any ideas?

cheers,
Peter

I tried too, but it didn’t work. I wanted to change only the size, but nothing happens

1 Like

It’s possible that either your font size was already 18px, or that your theme isn’t great at cascading down font size values. Try adding this big font-size value to custom.css, and see if things get huge and ugly.

BTW, at least on MacOS, the CSS changes should take effect within a few seconds, no restart required. But if you don’t see the changes right away, a restart might help.

:root {
  --ct-text-size: 32px;
  --ct-line-height: 1.6;
}

I agree with this feature request… However, for the overall font size, try using the zoom features in the view menu (whether in the Desktop app or in the Browser). Works great! However, sometimes the Desktop app resets the zoom unexpectedly. Definitely a bug.

2 Likes

I’ve encountered the same problem. However, I haven’t found a way to consistently trigger this problem. I think it’s better to report an issue in the github repo :slight_smile:

1 Like

There appears to be one already. Please leave a thumbs up on it and leave a comment if this bothers you too. :slight_smile:

3 Likes

I completely agree. I’m testing out logseq and its competitors. It’s rather strange that logseq doesn’t have an options menu to make simple changes. Out of the box, the UI has huge fonts in a generic white background. Adding custom css code is beyond most people, and many others would rather not bother with it.

4 Likes

Thanks for the comment - it works only now after I changed the c-+ and c-- shortcuts from Zoom in/out. This naming is misleading IMHO since every other app thinks font size when zoom+.
Pressing alt in the app and going to the menu entry for View/ Zoom In is not acceptable, since I use it only when screen sharing an need some HUGE font sizes and would need 20 cycles :weary:

Creating a plugin for this, curious about some elements ya’ll would like to be able to change.

I’ve got the following so far:

  • Font size
  • Width of the window
  • Line spacing
  • Default link colors
8 Likes

Cool. One thing I would love is the ability to turn the strikethrough of DONE tasks on or off. I managed to do so once in the custom.css but then I switched themes, or Logseq updated, or something else … and the strikethrough was back again.

Hey everyone.

It’s my first post and I just dropped Obsidian for Logseq.

Even tho I have no issues with customizing settings in files, but basic UI Settings would be really great. I have a two monitor setup and the smaller monitor (Laptop Screen) has 2560 x 1440 with about 16/17 inch and fonts are really, really small to me.

Additionally, my changes in Custom.css no longer have any effect on the UI, for whatever reason and that’s pretty shitty for my two monitor setup :slight_smile:

Using the AppImage for Linux.

1 Like