Sublime Forum

[SOLVED] Changing the background for a code block that already has sublime-syntax applied


Long time lurker, first time poster :grinning:

I take notes using Sublime and while I have a custom sublime-syntax and sublime-color-scheme file to apply all the formatting I want, I’m stuck at this one complicated scenario involving code blocks.

Here’s what I have so far…

I used a push inside a match¹ to apply JavaScript syntax highlighting to this code block (everything between << and >>, the opening angled braces are styled differently on purpose; just playing around with the style.)

My problem:
I want to apply a dark background just for this code block. I can change the colors and styles for the keyword tokens inside the code using scopes but I can’t target just the background color for the code block alone, like so…
(sorry, new users can’t upload more than 1 image in post so that’s an external link to a mockup of what I’m aiming for.)

¹The relevant bit of sublime-syntax:

    - match: (<<)
        1: post.code.start
      push: Packages/JavaScript/JavaScript.sublime-syntax
        - match: (?=>>)
          pop: true
    - match: ">>"
      scope: post.code.end

The relevant bit of sublime-color-scheme:

  "scope": "post.code.start",
  "foreground": "var(gray1)",
  "background": "var(gray5)",
  "scope": "post.code.end",
  "foreground": "var(gray1)",
  "background": "#FFFFFF",

Is it possible to apply a dark color scheme just to this code block?

If not, what are my other options to change the background?

I can change the colors for the keywords albeit by tediously mapping JavaScript-related scopes to dark-themed colors in my color-scheme file, but I can’t even do that with the bg, nothing works there.



What if

- match: "<<"
  scope: post.code.start
  embed: Packages/JavaScript/JavaScript.sublime-syntax
  embed_scope: meta.code-block
  escape: (?=>>)
- match: ">>"
  scope: post.code.end

and assign a bg color to meta.code-block?

1 Like


Yes, that works! Thank you :pray:

Could you give some detail on what you are doing with this new syntax and how it’s different from my approach? (which was a shameless copy-pasta from Sublime docs :grinning:)



  • embed / escape is basically doing the same job with with_prototype / pop. But iirc, embed will not compile the included file (or scope) into the generated cache so the compiled syntax cache will be smaller and it’s preferred.
  • embed_scope gives the embedded part an extra scope which in your case, using it to color the background. The doc says meta_content_scope is doing a similar job but I didn’t test it since embed_scope looks more consistent.
1 Like


Thanks for clearing that up, I think I’ll get a lot of use out of embed_scope :grinning:

Is there a way to mark this thread as [SOLVED] or should I manually edit the title?

update: nvm, cheers :+1:



I am sure the [SOLVED] is not manually added but I hardly ask questions these days here so I do know about how to do that :stuck_out_tongue:

1 Like


You may want to add a language identifier to code block just like markdown.
>> and << are bit-shifting operator in most languages by the way.

// some js codes

# some python codes


If this was posted in the Technical Support category, you could select a post as the “solution” and the thread would get marked as solved through that.

This feature should probably be added to some more categories because I can totally see this making sense for Plugin Development.



    - match: "($*.*<<)(SCPT|Applescript)"
      scope: post.code.start
      embed: Packages/AppleScript/AppleScript.sublime-syntax
      embed_scope: meta.code-block
      escape: (?=>>SCPT.*$)
  1. Can’t understand how to make highlighted complete line (line 430,448)
  2. Is it possible to skip from highlighting empty lines in code?For example line 434,436,444 make skip highlighting.

Im try by myself but can’t do that (spend 6 hour and nothing…)



Because obviously you missed a rule in the quoted post.

Sounds like a weird behavior but if that’s what you want, then you can’t use embed but with_prototype and give empty lines a special scope.