Changing Chat Panel Font Size / Line Height easily

VSCode still doesn’t have an easy way to change the font size and line height of side bar text. All current solutions to achieve this are hacky and either require loading in a custom CSS file that modifies the sidebar styling or updating the zoom level globally and then modifying the editor/terminal/etc panels’ font sizes so it looks right.

https://www.reddit.com/r/vscode/comments/l72z6c/tip_how_to_change_the_explorersidebar_font/

This is mostly not an issue in VSCode because the sidebar panel extensions in VSCode are not that important to the editor experience, but on Cursor, the chat panel is a core feature!

Would love if you guys added a few settings that control only the chat panel’s font size and line height for better readability

Cheers

6 Likes

+1 for the feature. It is almost impossible to read chat output on 13 inch screen. Generally, we’ve many windows open and the font size is just un-readable. I copy paste the entire chat in a new buffer to read it.

Please work on a fix for this one.

1 Like

Just to be sure, is the font size in the chat the same as in the editor for you? Or is it smaller than the editor font size?

@truell20 It’s much smaller than my editor font, very hard to read on 13 inch screen :frowning:

I’ve currently zoomed in the entire editor ( changed window.zoomLevel from 0 to 0.3) and then reduced my editor and terminal font size to compensate, but this has the unfortunate side effect of making everything bigger (icons, tab sizes, etc) so I’m left with less room on the screen as a result

Would really appreciate it if I could just adjust only the chat panel’s font size and line height, thank you!

Could you send a screenshot?

Still no workaround/solution? Really struggling with this…

I figured it out!

Steps:

  1. Install the APC Customize UI extension (Apc Customize UI++ - Visual Studio Marketplace)
  2. In your editor settings, add this:
"apc.stylesheet": {
  ".anysphere-markdown-container-root": "font-size: 16px; line-height: 1.4;"
}

Change the font size to whatever you want.

5 Likes

+1 Likewise struggling with this

A workaround is to use ctrl/cmd + “+” to increase font size. This will increase font size in both the editor and chat, after that you can decrease the font size of the editor in settings → Editor: Font size

This extension worked! Except here is the settings.json that worked for me:

"apc.stylesheet": {
    ".anysphere-markdown-container-root": "font-size: 15px !important; line-height: 1.5 !important;",
    ".view-line": "font-size: 14px !important;",
    ".aislash-editor-input": "font-size: 15px !important; line-height: 1.5 !important;"
  },
4 Likes

HOW HASN’T THIS SHIPPED YET??? I’ve been subscribed for close to a year now (almost as long as this post has existed basically) and I’m still getting wildly mistmatched font sizes between my editor and Cursor. I can configure fifteen fucking thousand beta features in the settings but not font size? Devs going from shipping for the customer to shipping for a16z VCs.

3 Likes

any update on this?

Any update? I’m using the nix package version of Cursor, which doesn’t seem to be compatible with the Apc extension. To clarify, the sidebar text is smaller than the main text, and changing ‘Chat > Editor: Font size’ has absolutely no effect on either the output text or the codeblocks. This only became an issue for me after I switched to linux, probably because of how it handles HiDPI monitors and fractional scaling. I have 150% global scaling, and my guess is that the global scaling is not being applied properly. But I shouldn’t have to fiddle with my system display settings anyway. There are a million other settings I can tweak, why not sidebar font?

My current workaround is using global zoom, which is mostly fine. It scales up all the UI elements but I don’t mind the jumbo look. It’s just annoying to have such a hacky workaround.

+1 until we reach AGI and find a way to stop aging, this problem becomes more and more urgent every day :slight_smile:

1 Like