--- title: How to change the font size in VS Code, the settings, shortcuts and zoom explained | daily.dev description: Change editor, terminal, or UI font sizes in VS Code using settings, shortcuts, zoom, and per-language overrides. Explore practical developer news, tutorials, and tools read by millions of developers worldwide. canonical: https://daily.dev/blog/how-to-change-font-size-in-vs-code/ og:type: article og:url: https://daily.dev/blog/how-to-change-font-size-in-vs-code/ og:title: How to change the font size in VS Code, the settings, shortcuts and zoom explained | daily.dev og:description: Change editor, terminal, or UI font sizes in VS Code using settings, shortcuts, zoom, and per-language overrides. Explore practical developer news, tutorials, and tools read by millions of developers worldwide. og:image: https://media.daily.dev/image/upload/s--7_xByL7b--/f_auto,q_auto/v1/recruiter-landing/6ae8e9e5f0eee09effb28246_1793650435150_6206d62928?_a=BAMAMiB80 og:site_name: daily.dev og:locale: en_US article:published_time: 2026-11-02 article:modified_time: 2026-11-02T20:46:16.812Z article:author: Daniela Torres twitter:card: summary_large_image twitter:site: @dailydotdev twitter:creator: @dailydotdev twitter:title: How to change the font size in VS Code, the settings, shortcuts and zoom explained | daily.dev twitter:description: Change editor, terminal, or UI font sizes in VS Code using settings, shortcuts, zoom, and per-language overrides. Explore practical developer news, tutorials, and tools read by millions of developers worldwide. twitter:image: https://media.daily.dev/image/upload/s--7_xByL7b--/f_auto,q_auto/v1/recruiter-landing/6ae8e9e5f0eee09effb28246_1793650435150_6206d62928?_a=BAMAMiB80 --- To change the font size in [VS Code](https://code.visualstudio.com/), I use **Settings → Editor Font Size** or set `"editor.fontSize": 16` in `settings.json` for 16-pixel text. Want the whole interface larger? Press **Ctrl + =** on [Windows](https://www.microsoft.com/en-us/windows) or [Linux](https://en.wikipedia.org/wiki/Linux), or **Cmd + =** on [macOS](https://www.apple.com/os/macos/). Here’s how I choose what to change: - **Code only:** Adjust `editor.fontSize`, or enable `editor.mouseWheelZoom` to resize text while scrolling. - **The whole window:** Use window zoom to scale code, tabs, menus, and the sidebar together. - **Other panels:** Use separate font settings for the terminal, Debug Console, and Output logs. - **Font and scope:** Choose a font family, turn on supported ligatures, and apply settings by language or workspace. Before screen sharing, I note my current sizes so I can restore them afterward. Resetting the editor font does not reset window zoom - they’re _separate controls_. ## Choose what to resize ::: @figure {VS Code Font Size vs. Window Zoom} Resize only the area that’s too small using the matching control below. [\[2\]](https://www.itechguides.com/vs-code-how-to-change-the-font-editor-terminal-and-ui/)[\[5\]](https://code.visualstudio.com/docs/editing/getting-started/tips-and-tricks) | Control | Affected area | | --- | --- | | `editor.fontSize` | Main code editor | | `window.zoomLevel` | Entire interface, including sidebar, tabs, and menus | | `terminal.integrated.fontSize` | Integrated terminal | | `debug.console.fontSize` | Debug Console | | `editor.fontSize` inside `[Log]` | Output panel | ### Use window zoom and editor mouse-wheel zoom **Window zoom resizes the entire interface.** On Windows and Linux, press **Ctrl + =** to zoom in, **Ctrl + -** to zoom out, or **Ctrl + Numpad0** to reset. On macOS, use **Cmd + =**, **Cmd + -**, or **Cmd + Numpad0**. [\[2\]](https://www.itechguides.com/vs-code-how-to-change-the-font-editor-terminal-and-ui/)[\[4\]](https://bobbyhadz.com/blog/zoom-in-out-vscode)[\[7\]](https://code.visualstudio.com/docs/reference/default-keybindings) To resize **editor text only** with the mouse wheel, enable `"editor.mouseWheelZoom": true`. Then hold **Ctrl** on Windows or Linux, or **Cmd** on macOS, while scrolling. The rest of VS Code stays unchanged. [\[4\]](https://bobbyhadz.com/blog/zoom-in-out-vscode)[\[6\]](https://stackoverflow.com/questions/68614419/have-to-press-ctrl-click-and-scroll-mouse-wheel-to-zoom-in-and-out-in-vscode) ### Resize terminal, Debug Console, and Output text In `settings.json`, set `terminal.integrated.fontSize` for the terminal and `debug.console.fontSize` for the Debug Console. For Output text, set `editor.fontSize` inside a `[Log]` block. [\[2\]](https://www.itechguides.com/vs-code-how-to-change-the-font-editor-terminal-and-ui/)[\[5\]](https://code.visualstudio.com/docs/editing/getting-started/tips-and-tricks) > ```json > { > "terminal.integrated.fontSize": 15, > "debug.console.fontSize": 15, > "[Log]": { > "editor.fontSize": 15 > } > } > ``` Next, choose the font family or a per-language scope if you want a different look. ## Choose fonts and setting scopes ### Change the font family and ligatures Your font family and ligature settings affect how easy your code is to read. First, install **[Fira Code](https://github.com/tonsky/firacode), [JetBrains Mono](https://www.jetbrains.com/lp/mono/), or [Cascadia Code](https://github.com/microsoft/cascadia-code)**. Then set `editor.fontFamily` to a font stack, with `monospace` last as the fallback. VS Code uses the first available font. [\[1\]](https://code.visualstudio.com/docs/configure/settings) Set `editor.fontLigatures` to `true` to display coding ligatures, such as showing `->` as a single arrow. This works only with fonts that support ligatures. [\[1\]](https://code.visualstudio.com/docs/configure/settings) ### Set font sizes by language or workspace You can use the same settings file to set font size, family, and ligatures by language or project. **Workspace settings override User settings.** To apply settings such as `editor.fontSize` to just one project, edit `.vscode/settings.json` in the project root. [\[1\]](https://code.visualstudio.com/docs/configure/settings) > ```json > { > "editor.fontSize": 16, > "editor.fontFamily": "'JetBrains Mono', 'Fira Code', monospace", > "editor.fontLigatures": true, > "[javascript]": { > "editor.fontSize": 15 > } > } > ``` This example sets the font size to 16, prefers JetBrains Mono, turns on ligatures, and sets the [JavaScript](https://en.wikipedia.org/wiki/JavaScript) font size to 15. [\[1\]](https://code.visualstudio.com/docs/configure/settings) Language-specific settings override global settings. If a language-specific setting doesn't apply, check both User and Workspace settings. When the same language-specific setting appears in both, Workspace wins. [\[1\]](https://code.visualstudio.com/docs/configure/settings) ## Reset sizes and prepare for screen sharing ### Reset font sizes and window zoom Open Settings, search for `@modified`, and reset `editor.fontSize` to its default. **Resetting the editor font does not reset window zoom.** To return the entire interface to its default zoom level of `0`, use **View > Appearance > Reset Zoom**.[\[2\]](https://www.itechguides.com/vs-code-how-to-change-the-font-editor-terminal-and-ui/)[\[3\]](https://code.visualstudio.com/docs/configure/accessibility/accessibility) If the size doesn’t change, check Workspace settings for a language override, such as `@lang:python`. This is worth checking before demos or pair sessions. ### Make code readable for viewers Before sharing your screen, note your current `editor.fontSize` and `window.zoomLevel` values. Then reset the sizes and scale only what viewers need to read. Increase window zoom if the interface is hard to read. Adjust `editor.fontSize` only if the code still needs more space. If you’ll run commands, check the terminal text too. Adjust `terminal.integrated.fontSize` separately if needed. After the session, restore your recorded values. Use **Reset Setting** only when you want to return to the default size. ## Match the setting to the text If the wrong text changes size, **the setting targets the wrong area**. Use `editor.fontSize` for the editor, `window.zoomLevel` for the entire interface, and `terminal.integrated.fontSize` for the terminal.[\[2\]](https://www.itechguides.com/vs-code-how-to-change-the-font-editor-terminal-and-ui/)[\[3\]](https://code.visualstudio.com/docs/configure/accessibility/accessibility)[\[5\]](https://code.visualstudio.com/docs/editing/getting-started/tips-and-tricks) Output panel logs work differently. To resize them separately from the terminal, use the `[Log]` language override with its own `editor.fontSize`.[\[5\]](https://code.visualstudio.com/docs/editing/getting-started/tips-and-tricks) ## FAQs ### How do I reset the font size in VS Code? To reset **window zoom**, press **Ctrl+Numpad0** on Windows or Linux, or **Cmd+Numpad0** on macOS. To reset only the editor’s font zoom, open the Command Palette and run **Editor Font Zoom Reset**. You can also restore the default font sizes by removing custom font size entries from your `settings.json` file. ### Why did my sidebar get bigger too? Your sidebar got bigger because **global zoom** changes the size of the entire VS Code window - not just your code. The zoom shortcuts (`Ctrl+=` or `Cmd+=`) also scale the sidebar, menus, and activity bar. To resize **only your code text**, change `editor.fontSize` or use the editor’s font zoom commands instead. ### How do I change the terminal font size only? Change `terminal.integrated.fontSize` in the Settings editor or in your `settings.json` file. This setting affects **only the terminal font size**. The editor, sidebar, and other interface elements stay unchanged. For example, add this inside the curly braces in `settings.json`: > `"terminal.integrated.fontSize": 14` ### Does the font size sync across machines with Settings Sync? Yes, **Settings Sync** syncs your font size and other user settings across machines, along with keyboard shortcuts and installed extensions. To turn it on, select **Backup and Sync Settings** in the Settings editor or the Accounts menu in the Activity Bar. ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/og-image.png?v=a830cdf1","width":1200,"height":630},"sameAs":["https://twitter.com/dailydotdev","https://www.linkedin.com/company/dailydotdev","https://github.com/dailydotdev","https://www.instagram.com/dailydotdev"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","description":"Free, personalized developer news aggregator. Stay on top of software development news, AI coding tools, and web dev - curated daily from trusted sources.","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}},{"@type":"WebPage","@id":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/","url":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/","name":"How to change the font size in VS Code, the settings, shortcuts and zoom explained | daily.dev","description":"Change editor, terminal, or UI font sizes in VS Code using settings, shortcuts, zoom, and per-language overrides. Explore practical developer news, tutorials, and tools read by millions of developers worldwide.","inLanguage":"en-US","isPartOf":{"@id":"https://daily.dev/#website"},"timeRequired":"PT5M"},{"@type":"Article","@id":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/#article","headline":"How to change the font size in VS Code, the settings, shortcuts and zoom explained","url":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/","datePublished":"2026-11-02","dateModified":"2026-11-02T20:46:16.812Z","isPartOf":{"@id":"https://daily.dev/#website"},"publisher":{"@id":"https://daily.dev/#organization"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/"},"description":"Change editor, terminal, or UI font sizes in VS Code using settings, shortcuts, zoom, and per-language overrides. Explore practical developer news, tutorials, and tools read by millions of developers worldwide.","image":{"@type":"ImageObject","url":"https://media.daily.dev/image/upload/s--7_xByL7b--/f_auto,q_auto/v1/recruiter-landing/6ae8e9e5f0eee09effb28246_1793650435150_6206d62928?_a=BAMAMiB80"},"author":{"@type":"Person","name":"Daniela Torres"},"timeRequired":"PT5M","potentialAction":{"@type":"ReadAction","target":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/"}},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev/"},{"@type":"ListItem","position":2,"name":"Blog","item":"https://daily.dev/blog/"},{"@type":"ListItem","position":3,"name":"Trends","item":"https://daily.dev/categories/trends/"},{"@type":"ListItem","position":4,"name":"How to change the font size in VS Code, the settings, shortcuts and zoom explained","item":"https://daily.dev/blog/how-to-change-font-size-in-vs-code/"}]},{"@type":"FAQPage","@context":"https://schema.org","mainEntity":[{"name":"How do I reset the font size in VS Code?","@type":"Question","acceptedAnswer":{"text":"To reset window zoom, press Ctrl+Numpad0 on Windows or Linux, or Cmd+Numpad0 on macOS. To reset only the editor’s font zoom, open the Command Palette and run Editor Font Zoom Reset. You can also restore the default font sizes by removing custom font size entries from your settings.json file.","@type":"Answer"}},{"name":"Why did my sidebar get bigger too?","@type":"Question","acceptedAnswer":{"text":"Your sidebar got bigger because global zoom changes the size of the entire VS Code window - not just your code. The zoom shortcuts (Ctrl+= or Cmd+=) also scale the sidebar, menus, and activity bar. To resize only your code text, change editor.fontSize or use the editor’s font zoom commands instead.","@type":"Answer"}},{"name":"How do I change the terminal font size only?","@type":"Question","acceptedAnswer":{"text":"Change terminal.integrated.fontSize in the Settings editor or in your settings.json file. This setting affects only the terminal font size. The editor, sidebar, and other interface elements stay unchanged. For example, add this inside the curly braces in settings.json: \"terminal.integrated.fontSize\": 14","@type":"Answer"}},{"name":"Does the font size sync across machines with Settings Sync?","@type":"Question","acceptedAnswer":{"text":"Yes, Settings Sync syncs your font size and other user settings across machines, along with keyboard shortcuts and installed extensions. To turn it on, select Backup and Sync Settings in the Settings editor or the Accounts menu in the Activity Bar.","@type":"Answer"}}]}]} ```