Skip to content


Switch branches/tags

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time

HTML Template Literals

Syntax highlighting and indentation for html inside of tagged template literals, as seen in lit-html and Polymer 3.

Supported Syntaxes inside html`...`

  • HTML (including CSS embedded in <style> tags)
  • JavaScript string interpolation (${...})
  • nested templates (html`${html`${}`}`)

See Configuration for support for css tagged literals (css`...` ).


This plugin requires vim-javascript (or typescript-vim if you're using typescript). If you use vim-plug for package management, installation looks like this:

Plug 'jonsmithers/vim-html-template-literals'
Plug 'pangloss/vim-javascript'

NOTE: it's generally a good idea to have let g:html_indent_style1 = "inc" in your vimrc for reasonable indentation of <style> tags. See :help html-indenting.


Flag Description
g:htl_css_templates Enable css syntax inside css-tagged template literals (css`...`). Indentation behavior is currently not implemented.
g:htl_all_templates (Experimental) Enable html syntax inside all template literals (`...`).

Known Issues

  • Indentation in general still has some kinks. If you see an issue, please report it.
  • This plugin conflicts a bit with vim-jsx. Having both installed simultaneously may result in undesired indentation behaviors.
  • A patch in vim 8.1 introduced native typescript support in Vim. However, its region definitions are less precise and it's not easy to translate vim-html-template-literals indentation behavior to work with Vim's native typescript region definitions.


  • You can configure the vim-closetag plugin to work inside html template literals:

    let g:closetag_filetypes = 'html,xhtml,phtml,javascript,typescript'
    let g:closetag_regions = {
          \ 'typescript.tsx': 'jsxRegion,tsxRegion,litHtmlRegion',
          \ 'javascript.jsx': 'jsxRegion,litHtmlRegion',
          \ 'javascript':     'litHtmlRegion',
          \ 'typescript':     'litHtmlRegion',
          \ }