WebStorm 2018.2 Help

Other File Types

File | Settings | Editor | Code Style | Other File Types for Windows and Linux
WebStorm | Preferences | Editor | Code Style | Other File Types for macOS
Ctrl+Alt+S icons general settings svg


In this area, choose the code style scheme and change it as required. Code style scheme settings are automatically applied every time WebStorm generates, refactors, or reformats your code.

Code styles are defined at the project level and at the IDE level (global).

  • At the Project level, settings are grouped under the Project scheme, which is predefined and is marked in bold. The Project style scheme is applied to the current project only.

    You can copy the Project scheme to the IDE level, using the Copy to IDE... command.

  • At the IDE level, settings are grouped under the predefined Default scheme (marked in bold), and any other scheme created by the user by the Duplicate command (marked as plain text). Global settings are used when the user doesn't want to keep code style settings with the project and share them.

    You can copy the IDE scheme to the current project, using the Copy to Project... command.




From this drop-down list, select the scheme to be used. The predefined schemes are shown bold. The custom schemes, ones created as copies of the predefined schemes, are in plain text. The location where the scheme is stored is written next to each scheme, for example, the Default scheme is stored in the IDE, the Project scheme is stored in the project.

cogwheel black with arrowClick this button to invoke the drop-down list of commands to manage the schemes:



Available for

Copy to IDE...

Choose this command to copy the scheme settings to the IDE.



Choose this command to export the selected scheme to an xml file in the selected location:

export scheme

Project and IDE

Import Scheme...

Choose this command to import the scheme of the selected type from the specified location:

import scheme

Project and IDE

Copy to Project...

Choose this command to copy the scheme settings to be stored with a project.



Choose this command to create a copy of the selected scheme.



Choose this command to reset the default or bundled color scheme to the initial defaults shipped with WebStorm. This command becomes available only if some changes have been done.



Choose this command to change the name of the selected custom scheme. Press Enter to save changes, or Escape to cancel.

Custom schemes

Tabs and Indents

Use tab character

  • If this checkbox is selected, tab characters are used for indentation and for code reformatting.

  • When the checkbox is cleared, WebStorm uses spaces instead of tabs.

Smart tabs

An indentation consists of two parts. One part results from nesting code blocks and the other part is determined by alignment.
  • If this checkbox is selected, the part that results from nesting contains both tabs and spaces (if necessary), while the part defined by alignment consists only of spaces.

  • If this checkbox is cleared, only tabs are used. This means that after reformatting a group of spaces that fits the specified tab size is automatically replaced with a tab, which may result in breaking fine alignment.

Tab size

In this text box, specify the number of spaces that fits in a tab.


In this text box, specify the number of spaces (or tabs if the Use Tab Character checkbox is selected) to be inserted for each indent level.

Last modified: 19 November 2018

See Also