convert-vim-syntax-highlighting-into-css.vim

" Assumption: This script is executed by gVim.


function! s:css_property_from(vim_attribute)
  if a:vim_attribute ==# 'bold' || a:vim_attribute ==# 'standout'
    return 'font-weight: bolder;'
  elseif a:vim_attribute ==# 'underline'
    return 'text-decoration: underline;'
  elseif a:vim_attribute ==# 'undercurl'
    return 'border-bottom: thin dashed;'
  elseif a:vim_attribute ==# 'italic'
    return 'font-style: italic;'
  else
    return printf('/* FIXME: Support %s */', a:vim_attribute)
  endif
endfunction


function! s:css_properties_from(vim_attributes)
  let as = split(a:vim_attributes, ',')
  return join(map(as, 's:css_property_from(v:val)'), ' ')
endfunction


function! s:convert_vim_syntax_highlighting_into_css()
  " Dump the current configuration of syntax highlighting into the new buffer.
  redir => s
  silent highlight
  redir END
  tabnew
  put =s

  " Remove garbage.
  % substitute/\s\+/ /g
  global/\<cleared\>/delete _
  global/\<links\> \<to\>/delete _
  global/^\l/delete _
  % substitute/ \<c\?term\S\+//g
  % substitute/ \<xxx\>//
  global/^ *$/delete _
  sort

  " CSS'ize.
  % substitute/\<guifg=\(\S\+\)/color: \L\1;/
  % substitute/\<guibg=\(\S\+\)/background-color: \L\1;/
  % substitute/\<guisp=\(\S\+\)/border-color: \L\1;/
  % substitute/\<gui=\(\S\+\)/\=s:css_properties_from(submatch(1))/
  % substitute/^\(\S\+\) \(.*\)$/.\1 {\2}/

  " Tidy up.
  setfiletype css
  1
endfunction


silent call s:convert_vim_syntax_highlighting_into_css()

example-output.css

.ColorColumn {background-color: darkred;}
.Comment {color: skyblue;}
.Conceal {color: lightgrey; background-color: darkgrey;}
.Constant {color: #ffa0a0;}
.Cursor {color: #000000; background-color: #99ff99;}
.CursorColumn {background-color: #222222;}
.CursorIM {color: #000000; background-color: #cc9999;}
.CursorLine {background-color: #222222;}
.DiffAdd {background-color: darkblue;}
.DiffChange {background-color: darkmagenta;}
.DiffDelete {font-weight: bolder; color: blue; background-color: darkcyan;}
.DiffText {font-weight: bolder; background-color: red;}
.Directory {color: #00ffff;}
.DocbkBold {font-weight: bolder;}
.Error {color: white; background-color: red;}
.ErrorMsg {color: #ffffff; background-color: #cc0000;}
.FoldColumn {color: #666666; background-color: #111111;}
.Folded {color: #999999; background-color: #111111;}
.Identifier {color: palegreen;}
.Ignore {color: grey40;}
.IncSearch {font-weight: bolder; color: #000000; background-color: #ffcc00;}
.LineNr {color: #666666; background-color: #111111;}
.MatchParen {color: #000000; background-color: #339933;}
.ModeMsg {color: #ff9900;}
.MoreMsg {color: #000000; background-color: #66cc66;}
.NonText {color: #3333cc; background-color: #111111;}
.Normal {color: #cccccc; background-color: #000000;}
.Pmenu {color: #cccccc; background-color: #000000;}
.PmenuSbar {color: #cccccc; background-color: #000000;}
.PmenuSel {color: #000000; background-color: #cccc00;}
.PmenuThumb {color: #000000; background-color: #cccc00;}
.PreProc {color: indianred;}
.Question {color: #66ff33; background-color: #000000;}
.Search {color: #000000; background-color: #cccc00;}
.SignColumn {color: #000000; background-color: #111111;}
.Special {color: navajowhite;}
.SpecialKey {color: #66ff66; background-color: #000000;}
.SpellBad {border-bottom: thin dashed; border-color: red;}
.SpellCap {border-bottom: thin dashed; border-color: blue;}
.SpellLocal {border-bottom: thin dashed; border-color: cyan;}
.SpellRare {border-bottom: thin dashed; border-color: magenta;}
.Statement {font-weight: bolder; color: khaki;}
.StatusLine {font-weight: bolder; color: #000000; background-color: #666666;}
.StatusLineNC {color: #111111; background-color: #666666;}
.TabLine {text-decoration: underline; color: #999999; background-color: #111111;}
.TabLineFill {text-decoration: underline; color: #999999; background-color: #111111;}
.TabLineSel {color: #000000; background-color: #cccccc;}
.Title {color: #000000; background-color: #cc6633;}
.Todo {color: orangered; background-color: yellow2;}
.Type {font-weight: bolder; color: darkkhaki;}
.Underlined {text-decoration: underline; color: #80a0ff;}
.VertSplit {color: #000000; background-color: #666666;}
.Visual {font-weight: bolder; background-color: #665544;}
.VisualNOS {font-weight: bolder; background-color: #556644;}
.WarningMsg {color: #ffffff; background-color: #cc6600;}
.WildMenu {color: #000000; background-color: #ffff00;}

Cool! )

@gmarik Thank you!