Как изменить шрифт visual studio 2023

title

description

titleSuffix

ms.date

ms.topic

ms.custom

helpviewer_keywords

ms.assetid

author

ms.author

manager

ms.technology

ms.workload

Change themes, fonts, text, and contrast for accessibility

Learn how to change Visual Studio color themes, font colors, text sizes, extra-contrast colors, and more for ease of use and accessibility concerns.

04/15/2022

how-to

contperf-fy22q3

Visual Studio, color themes

color themes, Visual Studio

60d91ba1-244b-4c43-847f-60b744f1352a

TerryGLee

tglee

jmartens

vs-ide-general

multiple

How to: Change fonts, colors, and themes in Visual Studio

[!INCLUDE Visual Studio]

::: moniker range=»>=vs-2022″

You can change the fonts and the colors in Visual Studio in several ways. For example, you can change the default dark theme (also referred to as «dark mode») to a light theme, a blue theme, an extra-contrast theme, or a theme that matches your system settings. You can also change the default font and text size in both the IDE and the code editor.

[!TIP]
See the We’ve upgraded the UI in Visual Studio 2022 blog post to learn more about the subtle color contrast ratio adjustments and a new Cascadia Code font we’ve added to make Visual Studio more accessible for everyone.

::: moniker-end

::: moniker range=»<=vs-2019″

You can change the fonts and the colors in Visual Studio in many ways. For example, you can change the default blue color theme to the dark theme (also referred to as «dark mode»). You can also select an extra-contrast theme if that best suits your needs. And, you can change the default font and text size in both the IDE and the code editor.

::: moniker-end

Change the color theme

Here’s how to change the color theme of the IDE frame and the tool windows in Visual Studio.

::: moniker range=»>=vs-2022″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > General.
In the Color theme list, choose either the default Dark theme, the Light theme, the Blue theme, or the Blue (Extra Contrast) theme.

You can also choose to use the theme that Windows uses by selecting Use system setting.

:::image type=»content» source=»media/vs-2022/fonts-colors-theme.png» alt-text=»Screenshot of the Options dialog box where you can change the color theme.»:::

[!NOTE]
When you change a color theme, text in the IDE reverts to the default or previously customized fonts and sizes for that theme.

[!TIP]
Want even more themes to choose from? Check out the wide range of custom themes on the Visual Studio Marketplace. And to see examples of new Visual Studio 2022 custom themes based on VS Code, take a look at the Introducing a collection of new Visual Studio themes blog post.

::: moniker-end

::: moniker range=»<=vs-2019″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > General.
In the Color theme list, choose either the default Blue theme, the Light theme, the Dark theme, or the Blue (Extra Contrast) theme.

[!NOTE]
When you change a color theme, text in the IDE reverts to the default or previously customized fonts and sizes for that theme.
[!TIP]
You can create and edit your own Visual Studio themes by using an extension. Choose from either of the following two options, depending on the version of Visual Studio you’re using:
- Color Theme Designer for Visual Studio 2019.
- Color Theme Editor for Visual Studio 2017

::: moniker-end

Change fonts and text size

You can change the font and text size for all the IDE frame and tool windows, or for only certain windows or text elements. You can also change the font and text size in the editor, too.

To change the font and text size in the IDE

::: moniker range=»>=vs-2022″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > Fonts and Colors.
In the Show settings for list, choose Environment.

[!NOTE]
If you want to change the font for tool windows only, in the Show settings for list, choose All Text Tool Windows.
Modify the Font and Size options to change the font and text size for the IDE.
Select the appropriate item in Display items, and then modify the Item foreground and Item background options.

::: moniker-end

::: moniker range=»<=vs-2019″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > Fonts and Colors.
In the Show settings for list, choose Environment.

[!NOTE]
If you want to change the font for tool windows only, in the Show settings for list, choose All Text Tool Windows.
Modify the Font and Size options to change the font and text size for the IDE.
Select the appropriate item in Display items, and then modify the Item foreground and Item background options.

::: moniker-end

To change the font and text size in the editor

::: moniker range=»>=vs-2022″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > Fonts and Colors.
In Show settings for list, select Text Editor.
Modify the Font and Size options to change the font and text size for the editor.
Select the appropriate item in Display items, and then modify the Item foreground and Item background options.

::: moniker-end

::: moniker range=»<=vs-2019″

On the menu bar, choose Tools > Options.
In the options list, choose Environment > Fonts and Colors.
In Show settings for list, select Text Editor.
Modify the Font and Size options to change the font and text size for the editor.
Select the appropriate item in Display items, and then modify the Item foreground and Item background options.

::: moniker-end

For more information about how to change fonts and colors for accessibility, see the Set accessibility options section of this page. And, for details about all the user interface (UI) elements where you can change font and color schemes, see the Fonts and Colors, Environment, Options Dialog Box page.

Set language-specific editor options

You can make a variety of changes to the code editor to suit your programming language of choice. For example, you can change brace formatting in C# to appear inline or on a new line, and more. To learn how to customize the code editor, see Set language-specific editor options.

Set accessibility options

::: moniker range=»vs-2022″

In a neurodiverse world, we want to support our different learners and low-vision users by offering the following font options and color themes:

You can use the Cascadia Code font, which adds more weight to the proportions of letters, numerals, and characters to help disambiguate them. Cascadia Code also includes coding ligatures.
You can choose to use a high-contrast color theme for all the apps and UI on a computer, or an extra-contrast color theme for Visual Studio only.

Use the Cascadia Code font

The new Cascadia Code font includes Cascade Mono, which is the default font in Visual Studio 2022. Not only are both of these fonts easier to read, but the Cascadia Code font also includes coding ligatures that turn a sequence of characters into a glyph. Coding ligatures, or glyphs, make it easier for people to cognitively associate the meaning behind them.

The following screenshot shows an example of the default Cascadia Mono font and lists a series of characters, to include mathematical symbols, that you might find yourself using while you code.

:::image type=»content» source=»media/vs-2022/cascadia-mono-font.png» alt-text=»Screenshot of an example of the Cascadia Mono font in the Editor.»:::

The following screenshot shows an example of the Cascadia Code font, where the same series of characters shown previously are now converted to coding ligatures, or glyphs.

:::image type=»content» source=»media/vs-2022/cascadia-code-font.png» alt-text=»Screenshot of an example of the Cascadia Code font in the Editor.»:::

Notice that the last line of text in the Cascadia Code screenshot shows how the space between duplicate characters is reduced, which also makes them easier to read.

Here’s how to toggle between the Cascadia fonts:

Go to Tools > Options > Environment > Fonts and colors.
From the Font dropdown list, select either the Cascadia Code font or the Cascadia Mono font you want, and then select OK.

:::image type=»content» source=»media/vs-2022/cascadia-font-options.png» alt-text=»Screenshot of the Cascadia fonts available from the Options dialog box.»:::

::: moniker-end

::: moniker range=»<=vs-2019″

There are color theme options for you if you experience low vision. You can use a high-contrast option for all the apps and UI on a computer, or an extra contrast option for Visual Studio only.

::: moniker-end

Use Windows high contrast

Use either of the following procedures to toggle the Windows high contrast option:

In Windows or in any Microsoft application, press the Left Alt+Left Shift+PrtScn keys.
In Windows, choose Start > Settings > Ease of Access. Then, under the Vision section in Windows 10 and later, choose High contrast.

[!WARNING]
The Windows high contrast setting affects all applications and UI on the computer.

Use Visual Studio extra contrast

Use the following procedures to toggle the Visual Studio extra contrast option:

On the menu bar in Visual Studio, choose Tools > Options, and then, in the options list, choose Environment > General.
In the Color theme drop-down list, choose the Blue (Extra Contrast) theme, and then choose OK.

[!TIP]
If there is an accessibility option for colors or fonts that you think might be useful but isn’t currently available in Visual Studio, please let us know by selecting Suggest a feature in the Visual Studio Developer Community. For more information about this forum and how it works, see the Suggest a feature page.

More accessibility features in Visual Studio

Visual Studio also includes features to help people who have limited dexterity to write. For example, Visual Studio supports Dvorak keyboard layouts, which make the most frequently typed characters more accessible.

You can also customize the default keyboard shortcuts available with Visual Studio. For more information, see the following pages:

Identify and customize keyboard shortcuts
How to use the keyboard exclusively
Keyboard shortcuts in Visual Studio

Visual Studio also includes auto-completion for methods and parameters; for more information, see IntelliSense in Visual Studio.

There are more ways to customize Visual Studio to be more accessible to you. For example, you can change the behavior of pop-up windows, text-based tool windows, toolbar buttons, margin indicators, and more.

[!NOTE]
The dialog boxes and menu commands you see might differ from those described here, which can vary depending on your active settings or edition. To change your settings, choose Import and Export Settings on the Tools menu. For more information, see Reset settings.

Change the behavior of pop-up windows

Visual Studio displays pop-up windows in the editor. These pop-up windows include information that makes coding easier, such as parameters to complete a function or statement. The pop-up windows can also be helpful if you have difficulty typing. However, some users might find that they interfere with focus in the code editor, which can be problematic.

Here’s how to turn off the pop-up windows:

From the Tools menu, choose Options.
Choose Text Editor > All Languages > General.
Clear the Auto list members and Parameter information checkboxes.

You can rearrange the windows in the integrated development environment (IDE) to best suit the way you work. You can dock, float, hide, or automatically hide each tool window. For more information about how to change window layouts, see Customize window layouts.

Change the settings of text-based tool windows

You can change the settings for text-based tool windows, such as the Command window, Immediate window, and Output window by using Tools > Options > Environment > Fonts and Colors.

When you select [All Text Tool Windows] in the Show settings for drop-down list, the default setting is listed as Default in the Item foreground and Item background drop-down lists. Choose the Custom button to change these settings.

You can also change the settings for how text is displayed in the editor. Here’s how.

From the Tools menu, choose Options.
Choose Environment > Fonts and Colors.
Select an option on the Show settings for drop-down menu.

To change the font size for text in an editor, choose Text Editor.

To change the font size for text in text-based tool windows, choose [All Text Tool Windows].

To change the font size for ToolTip text in an editor, choose Editor Tooltip.

To change the font size for text in statement completion pop-ups, choose Statement Completion.
From Display items, select Plain Text.
In Font, select a new font type.
In Size, select a new font size.

[!TIP]
To reset the text size for text-based tool windows and editors, choose Use Defaults.
Choose OK.

Change the colors for text, margin indicators, white space, and code elements

You can choose to change the default colors for text, margin indicators, white space, and code elements in the editor. Here’s how.

From the Tools menu, choose Options.
In the Environment folder, choose Fonts and Colors.
In Show settings for, choose Text Editor.
From Display items, select an item whose display you need to change, such as Plain Text, Indicator Margin, Visible White Space, HTML Attribute Name, or XML Attribute.
Select display settings from the following options: Item foreground, Item background, and Bold.
Choose OK.

[!TIP]
To use high contrast colors for all application windows on your operating system, press Left Alt+Left Shift+PrtScn. If Visual Studio is open, close and then reopen it to fully implement high contrast colors.

Add text to toolbar buttons or modify the text

To improve toolbar usability and accessibility, you can add text to toolbar buttons.

To assign text to toolbar buttons

From the Tools menu, choose Customize.
In the Customize dialog box, select the Commands tab.
Select Toolbar, and then choose the toolbar name that contains the button you intend to display text for.
In the list, select the command you intend to change.
Choose Modify Selection.
Choose Image and Text.

To modify the displayed text in a button

Re-select Modify Selection.
Adjacent to In Name, insert provide a new caption for the selected button.

Accessibility support

For more information about features, products, and services that make Windows more accessible for people with disabilities, see Accessibility products and services from Microsoft. And, for more information about how to obtain more accessible formats of documentation for Microsoft products, see the Documentation in alternative formats section of the Accessibility products and services from Microsoft page.

The accessibility information included on this page might apply only to users who license Microsoft products in the United States. If you obtained this product outside of the United States, visit the Microsoft Accessibility website for a list of Microsoft support services telephone numbers and addresses. You can contact your subsidiary to find out whether the type of products and services described on this page are available in your area. Information about accessibility is also available in other languages.

On my windows 8.1 machine default VS Code font is Consolas, but you can easily change the font in File->Preferences->User Preferences. setting.json file will be opened alongside with default settings file, from where you can take syntax and names for settings properties and set your own ones in settings.json.

answered Apr 30, 2015 at 6:54

On Windows, the default settings are as follow (I never installed Monaco nor Menlo)

{
    "editor.fontFamily": "Consolas",
    "editor.fontSize": 14,
    "editor.lineHeight": 19
}

Settings fontSize to 12 and lineHeight to 16 closely approximate Visual Studio set to Consolas with 10pt size. I could not get an exact match (VS Code font is slightly bolder) but close enough.

answered Apr 13, 2016 at 19:17

Axel RietschinAxel Rietschin

5711 gold badge6 silver badges8 bronze badges

Another way to determine the default font is to start typing "editor.fontFamily" in settings and see what auto-fill suggests. On a Mac, it shows by default:

"editor.fontFamily": "Menlo, Monaco, 'Courier New', monospace",

which confirms what Andy Li says above.

answered Jun 1, 2018 at 16:45

shackershacker

14.3k7 gold badges85 silver badges88 bronze badges

Open vscode.

Press ctrl,.

The setting is "editor.fontFamily".

On Linux to get a list of fonts (and their names which you have to use) run this in another shell:

fc-list | awk '{$1=""}1' | cut -d: -f1 | sort| uniq

You can specify a list of fonts, to have fallback values in case a font is missing.

answered Oct 13, 2018 at 4:54

sjassjas

18.1k12 gold badges85 silver badges92 bronze badges

Since the VisualStudio has been updated now (2019). You can try on this method:

Go to File->Preference->Settings.
Go to Workspace tab and then Text Editor->Font
Under Font-Family form, put the font-family names you want to use separated by a comma
For e.g I have put these fonts in my Workspace:
Click to see my Workspace setting

answered Oct 11, 2019 at 16:06

Go to Tools->Options on menu on main window.
Under Environment container, you can see Fonts and Colors.
You can select font and color which you want.

answered Jul 7, 2019 at 16:52

For windows
please follow these steps
Goto — > File -> preferences -> settings
OR
press CTRL + , (for windows only)
you’ll see settings page there find text editor option tab on left side then click on ‘ Font ‘ then add any valid font family name there which you want to apply to vscode.

answered Aug 18, 2020 at 8:56

Источник

So which is default font of Visual Studio Code Editor in All the environments(Ubuntu, MAC OS and windows)? And how can I change it?

asked Apr 30, 2015 at 5:55

Jalpesh VadgamaJalpesh Vadgama

13.5k19 gold badges71 silver badges93 bronze badges

Go to Preferences > User Settings. (Alternatively, Ctrl + , / Cmd + , on macOS)

Here’s an example:

// Controls the font family.
"editor.fontFamily": "Consolas",

// Controls the font size.
"editor.fontSize": 13

Useful links:

Default Settings

Edric

23.5k13 gold badges79 silver badges89 bronze badges

answered Apr 30, 2015 at 7:14

In the default settings, VS Code uses the following fonts (14 pt) in descending order:

Monaco
Menlo
Consolas
«Droid Sans Mono»
«Inconsolata»
«Courier New»
monospace (fallback)

Draex_

2,8324 gold badges28 silver badges48 bronze badges

answered Jun 2, 2015 at 19:57

SebastianSebastian

1,3731 gold badge7 silver badges15 bronze badges

The default fonts are different across Windows, Mac, and Linux. As of VSCode 1.15.1, the default font settings can be found in the source code:

const DEFAULT_WINDOWS_FONT_FAMILY = 'Consolas, 'Courier New', monospace';
const DEFAULT_MAC_FONT_FAMILY = 'Menlo, Monaco, 'Courier New', monospace';
const DEFAULT_LINUX_FONT_FAMILY = ''Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'';

answered Aug 29, 2017 at 5:49

Andy LiAndy Li

5,8346 gold badges35 silver badges46 bronze badges

In VSCode if "editor.fontFamily": "" is blank, the font size will NOT work. Set a font family to change the size.

"editor.fontFamily": "Verdana",
or
"editor.fontFamily": "Monaco",

Really, use whatever font family you like.

Then "editor.fontSize": 16,
should work.

retrixe

1434 silver badges7 bronze badges

answered Jun 4, 2015 at 20:31

answered Apr 30, 2015 at 6:54

On Windows, the default settings are as follow (I never installed Monaco nor Menlo)

{
    "editor.fontFamily": "Consolas",
    "editor.fontSize": 14,
    "editor.lineHeight": 19
}

Settings fontSize to 12 and lineHeight to 16 closely approximate Visual Studio set to Consolas with 10pt size. I could not get an exact match (VS Code font is slightly bolder) but close enough.

answered Apr 13, 2016 at 19:17

Axel RietschinAxel Rietschin

5711 gold badge6 silver badges8 bronze badges

Another way to determine the default font is to start typing "editor.fontFamily" in settings and see what auto-fill suggests. On a Mac, it shows by default:

"editor.fontFamily": "Menlo, Monaco, 'Courier New', monospace",

which confirms what Andy Li says above.

answered Jun 1, 2018 at 16:45

shackershacker

14.3k7 gold badges85 silver badges88 bronze badges

Open vscode.

Press ctrl,.

The setting is "editor.fontFamily".

On Linux to get a list of fonts (and their names which you have to use) run this in another shell:

fc-list | awk '{$1=""}1' | cut -d: -f1 | sort| uniq

You can specify a list of fonts, to have fallback values in case a font is missing.

answered Oct 13, 2018 at 4:54

sjassjas

18.1k12 gold badges85 silver badges92 bronze badges

Since the VisualStudio has been updated now (2019). You can try on this method:

Go to File->Preference->Settings.
Go to Workspace tab and then Text Editor->Font
Under Font-Family form, put the font-family names you want to use separated by a comma
For e.g I have put these fonts in my Workspace:
Click to see my Workspace setting

answered Oct 11, 2019 at 16:06

Go to Tools->Options on menu on main window.
Under Environment container, you can see Fonts and Colors.
You can select font and color which you want.

answered Jul 7, 2019 at 16:52

answered Aug 18, 2020 at 8:56

Источник

So which is default font of Visual Studio Code Editor in All the environments(Ubuntu, MAC OS and windows)? And how can I change it?

asked Apr 30, 2015 at 5:55

Jalpesh VadgamaJalpesh Vadgama

13.5k19 gold badges71 silver badges93 bronze badges

Go to Preferences > User Settings. (Alternatively, Ctrl + , / Cmd + , on macOS)

Here’s an example:

// Controls the font family.
"editor.fontFamily": "Consolas",

// Controls the font size.
"editor.fontSize": 13

Useful links:

Default Settings

Edric

23.5k13 gold badges79 silver badges89 bronze badges

answered Apr 30, 2015 at 7:14

In the default settings, VS Code uses the following fonts (14 pt) in descending order:

Monaco
Menlo
Consolas
«Droid Sans Mono»
«Inconsolata»
«Courier New»
monospace (fallback)

Draex_

2,8324 gold badges28 silver badges48 bronze badges

answered Jun 2, 2015 at 19:57

SebastianSebastian

1,3731 gold badge7 silver badges15 bronze badges

The default fonts are different across Windows, Mac, and Linux. As of VSCode 1.15.1, the default font settings can be found in the source code:

const DEFAULT_WINDOWS_FONT_FAMILY = 'Consolas, 'Courier New', monospace';
const DEFAULT_MAC_FONT_FAMILY = 'Menlo, Monaco, 'Courier New', monospace';
const DEFAULT_LINUX_FONT_FAMILY = ''Droid Sans Mono', 'Courier New', monospace, 'Droid Sans Fallback'';

answered Aug 29, 2017 at 5:49

Andy LiAndy Li

5,8346 gold badges35 silver badges46 bronze badges

In VSCode if "editor.fontFamily": "" is blank, the font size will NOT work. Set a font family to change the size.

"editor.fontFamily": "Verdana",
or
"editor.fontFamily": "Monaco",

Really, use whatever font family you like.

Then "editor.fontSize": 16,
should work.

retrixe

1434 silver badges7 bronze badges

answered Jun 4, 2015 at 20:31

answered Apr 30, 2015 at 6:54

On Windows, the default settings are as follow (I never installed Monaco nor Menlo)

{
    "editor.fontFamily": "Consolas",
    "editor.fontSize": 14,
    "editor.lineHeight": 19
}

Settings fontSize to 12 and lineHeight to 16 closely approximate Visual Studio set to Consolas with 10pt size. I could not get an exact match (VS Code font is slightly bolder) but close enough.

answered Apr 13, 2016 at 19:17

Axel RietschinAxel Rietschin

5711 gold badge6 silver badges8 bronze badges

Another way to determine the default font is to start typing "editor.fontFamily" in settings and see what auto-fill suggests. On a Mac, it shows by default:

"editor.fontFamily": "Menlo, Monaco, 'Courier New', monospace",

which confirms what Andy Li says above.

answered Jun 1, 2018 at 16:45

shackershacker

14.3k7 gold badges85 silver badges88 bronze badges

Open vscode.

Press ctrl,.

The setting is "editor.fontFamily".

On Linux to get a list of fonts (and their names which you have to use) run this in another shell:

fc-list | awk '{$1=""}1' | cut -d: -f1 | sort| uniq

You can specify a list of fonts, to have fallback values in case a font is missing.

answered Oct 13, 2018 at 4:54

sjassjas

18.1k12 gold badges85 silver badges92 bronze badges

Since the VisualStudio has been updated now (2019). You can try on this method:

Go to File->Preference->Settings.
Go to Workspace tab and then Text Editor->Font
Under Font-Family form, put the font-family names you want to use separated by a comma
For e.g I have put these fonts in my Workspace:
Click to see my Workspace setting

answered Oct 11, 2019 at 16:06

Go to Tools->Options on menu on main window.
Under Environment container, you can see Fonts and Colors.
You can select font and color which you want.

answered Jul 7, 2019 at 16:52

answered Aug 18, 2020 at 8:56

Источник

How to: Change fonts, colors, and themes in Visual Studio

Change the color theme

Change fonts and text size

To change the font and text size in the IDE

To change the font and text size in the editor

Set language-specific editor options

Set accessibility options

Use the Cascadia Code font

Use Windows high contrast

Use Visual Studio extra contrast

More accessibility features in Visual Studio

Change the behavior of pop-up windows

Change the settings of text-based tool windows

Change the colors for text, margin indicators, white space, and code elements

Add text to toolbar buttons or modify the text

To assign text to toolbar buttons

To modify the displayed text in a button

Accessibility support

See also

Читайте также: