Is it possible to customize the backlight of closing tags in Sublime Text 3, just like in the screenshot below (This is implemented in Brackets) ?. There is a plug-in for this purpose BracketHighlighter ( https://github.com/facelessuser/BracketHighlighter ), but having sorted through the existing configs, not

Tag highlighting example

  • intrigued Stanislavsky is afraid to go to the toilet ... - maxwell
  • About BracketHighlighter plugin settings, see here . Plugin options in Preferences → Package Settings → Bracket Highlighter → Bracket Settings - Default . If you did not find the function you need, please specify your question. Thank. - Sasha Chernykh

2 answers 2

Underline, not highlighting of tags and brackets in Sublime Text 3 is implemented without plug-ins.

To start, just in case, click on Preferences → Settings - User , in the opened file between {} add the following lines:

 "match_brackets": true, "match_brackets_angle": true, "match_brackets_square": true, "match_brackets_braces": true, "match_brackets_content":true, "match_tags": true,

We save. In Sublime Text 3, all these parameters, except match_brackets_angle , are set to true , but you match_brackets_angle know, in subsequent assemblies they can be changed to false . match_brackets - underlining various types of brackets, match_tags - underline tags.

Next, open the file with the usual color scheme with the extension tm.Theme . At the very beginning we find approximately the following lines (the values ​​of colors may differ from those given in the example):

 <key>lineHighlight</key> <string>lightslategray</string> <key>foreground</key> <string>#ffdab9</string> <key>invisibles</key> <string>#BFBFBF</string> <key>selection</key> <string>dimgray</string>

Somewhere between them before the closing tags </dict> insert the following tags:

  <key>bracketContentsForeground</key> <string>yellow</string> <key>bracketContentsOptions</key> <string>underline</string> <key>bracketsForeground</key> <string>cyan</string> <key>bracketsOptions</key> <string>squiggly_underline</string> <key>tagsForeground</key> <string>lawngreen</string> <key>tagsOptions</key> <string>underline</string>

Explanations:

  • bracketContentsForeground is the underline color of any brackets between which the caret is located. A color fits between the <string></string> tags, better in HEX format than X11 , since Sublime Text may have problems with at least the display of aqua , fuchsia and lime colors.

  • bracketContentsOptions is the underline style of the parentheses between which the caret is located. Values: underline - underlined straight line, stippled_underline - dashed, squiggly_underline - wavy. The default is underline .

Underline any brackets

  • bracketsForeground - the color of brackets underlining when the carriage is located next to the brackets A color fits between the <string></string> tags.

  • bracketsOptions - the underline style of brackets next to which the caret is located. Values: underline - underlined straight line, stippled_underline - dashed, squiggly_underline - wavy. The default is underline .

Underline brackets when near carriage

  • tagsForeground - underline color of tags. When the caret is inside a tag, both it and the corresponding opening / closing tag are underlined.

  • tagsOptions - tag underline style. Values: underline - underlined straight line, stippled_underline - dashed, squiggly_underline - wavy. Default stippled_underline .

Underline tags in Sublime Text 3

This is enough for me. Thank.

    Better than that , use the BracketHighlighter plugin.

    A common problem is brackets and quotes in both the code and gutter (a bar where line numbers) are highlighted in the same color as the text. To fix it, you need:

    1. Preferences → Package Settings → BracketHighlighter → Bracket Settings - User → we insert the following code into the opened file → we save the file.

       { "bracket_styles": { // This particular style is used to highlight // unmatched bracket pairs. It is a special // style. "unmatched": { "icon": "question", "color": "brackethighlighter.unmatched", "style": "highlight" }, // User defined region styles "curly": { "icon": "curly_bracket", "color": "brackethighlighter.curly", "style": "highlight" }, "round": { "icon": "round_bracket", "color": "brackethighlighter.round", "style": "outline" }, "square": { "icon": "square_bracket", "color": "brackethighlighter.square", "style": "outline" }, "angle": { "icon": "angle_bracket", "color": "brackethighlighter.angle", "style": "outline" }, "tag": { "icon": "tag", "color": "brackethighlighter.tag", "style": "outline" }, "single_quote": { "icon": "single_quote", "color": "brackethighlighter.quote", "style": "outline" }, "double_quote": { "icon": "double_quote", "color": "brackethighlighter.quote", "style": "outline" }, "regex": { "icon": "regex", "color": "brackethighlighter.quote", "style": "outline" } } }

    2. In the file of your color scheme with the tmTheme extension (if you don’t know how to open it, see here at the very beginning) somewhere between the <array></array> tags, insert the following lines:

       <!-- BracketHighlighter --> <!-- BracketHighlighter: Вопросительный знак, если BracketHighlighter не находит, с чем сопоставлена скобка, а также текст внутри несопоставленного открывающего/закрывающего тега --> <dict> <key>name</key> <string>Unmatched</string> <key>scope</key> <string>brackethighlighter.unmatched</string> <key>settings</key> <dict> <key>foreground</key> <string>#FD971F</string> </dict> </dict> <!-- BracketHighlighter: фигурные скобки --> <dict> <key>name</key> <string>BracketHighlighter: Curly</string> <key>scope</key> <string>brackethighlighter.curly</string> <key>settings</key> <dict> <key>foreground</key> <string>#FF0000</string> </dict> </dict> <!-- BracketHighlighter: круглые скобки --> <dict> <key>name</key> <string>BracketHighlighter: Round</string> <key>scope</key> <string>brackethighlighter.round</string> <key>settings</key> <dict> <key>foreground</key> <string>lightblue</string> </dict> </dict> <!-- BracketHighlighter: квадратные скобки --> <dict> <key>name</key> <string>BracketHighlighter: Square</string> <key>scope</key> <string>brackethighlighter.square</string> <key>settings</key> <dict> <key>foreground</key> <string>pink</string> </dict> </dict> <!-- BracketHighlighter: угловые скобки --> <dict> <key>name</key> <string>BracketHighlighter: Angle</string> <key>scope</key> <string>brackethighlighter.angle</string> <key>settings</key> <dict> <key>foreground</key> <string>#FEFE22</string> </dict> </dict> <!-- BracketHighlighter: скобки тегов (пока не знаю, что за тегов) --> <dict> <key>name</key> <string>BracketHighlighter: Bracket Tag</string> <key>scope</key> <string>brackethighlighter.tag</string> <key>settings</key> <dict> <key>foreground</key> <string>violet</string> </dict> </dict> <!-- BracketHighlighter: одинарные и двойные скобки, (ещё где-то регулярные выражения) --> <dict> <key>name</key> <string>BracketHighlighter: Single Quote | Double Quote | Regex</string> <key>scope</key> <string>brackethighlighter.quote</string> <key>settings</key> <dict> <key>foreground</key> <string>palegreen</string> </dict> </dict>

    Between the <string></string> tags under the <key>foreground</key> we change the colors as you please. It is better to write them in HEX , rather than X11 colors , since at least colors of aqua , fuchsia and lime may be displayed incorrectly in Sublime Text 3.

    Brackets, quotes, and their selection in the text should turn out to be multi-colored:

    Customized BracketHighlighter

    • Good evening! Please tell me how to make the rest stand out in bold, like - {} . And it doesn’t my eye for me :) - Dmitry