Skip to main content
Coding Theme

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#f8f8f2
comment#75715e
string#e6db74
constant.numeric#be84ff
constant.language, meta.preprocessor#be84ff
constant.character, constant.other#be84ff
variable.language, variable.other#ffffff
keyword#f92672
storage#f92672
storage.type#66d9ef italic
entity.name.class#66D9EF underline
entity.other.inherited-class#a6e22eitalic underline
entity.name.function#a6e22e
variable.parameter#fd971f italic
entity.name.tag#f92672
entity.other.attribute-name#a6e22e
support.function#66d9ef
support.constant#66d9ef
support.type, support.class#A6E22Eitalic
support.other.variable
string constant#66d9ef
string.regexp#f6aa11
string variable#ffffff
punctuation.definition.variable#ffffff
entity#a6e22e
meta.tag.sgml.doctype.xml, declaration.sgml.html declaration.doctype, declaration.sgml.html declaration.doctype entity, declaration.sgml.html declaration.doctype string, declaration.xml-processing, declaration.xml-processing entity, declaration.xml-processing string, doctype#c8cecc
comment.block.html#7c7865
entity.name.tag.script.htmlitalic
text.html.basic meta.tag.other.html, text.html.basic meta.tag.any.html, text.html.basic meta.tag.block.any, text.html.basic meta.tag.inline.any, text.html.basic meta.tag.structure.any.html, text.html.basic source.js.embedded.html, punctuation.separator.key-value.html#a6e22e
text.html.basic entity.other.attribute-name.html#a6e22e
text.html.basic meta.tag.structure.any.html punctuation.definition.string.begin.html, punctuation.definition.string.begin.html, punctuation.definition.string.end.html#ffffff
punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag#ffffff
variable.parameter.handlebars#f6aa11
support.constant.handlebars, meta.function.block.start.handlebars#66d9ef
meta.preprocessor.at-rule keyword.control.at-rule#f6aa11
meta.selector.css entity.other.attribute-name.id#f6aa11
meta.selector.css entity.other.attribute-name.class#a6e22e
support.type.property-name.css#66d9ef
meta.constructor.argument.css#f6aa11
punctuation.section.property-list.css#ffffff
punctuation.definition.tag.css#f92672
punctuation.separator.key-value.css, punctuation.terminator.rule.css#ffffff
entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-selector.css#a6e22e
variable.other.less#ffffff
entity.other.less.mixin#e0fdce italic
entity.other.attribute-name.pseudo-element.less#ff9117
meta.instance.constructor meta.function-call.constructor.js#a6e22e
meta.template.expression.js punctuation.definition.template-expression.begin.js, meta.template.expression.js punctuation.definition.template-expression.end.js, meta.template.expression.js punctuation.accessor#AFF132
meta.function.js, entity.name.function.js, support.function.dom.js#a6e22e
source.js meta.function.js punctuation.separator.parameter.function.js#ffffff
meta.property.object.js, keyword.operator.accessor.js#ffffff
source.js meta.group.braces.curly constant.other.object.key.js punctuation.separator.key-value.js#ffffff
source.js meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#ffffff
support.type.object.module.js, source.js meta.function.declaration.js support.class.js#66d9ef
support.type.object.module.js support.type.object.module.js#a6e22e
storage.type.js#66d9ef italic
text.html.basic source.js.embedded.html#ffffff
storage.type.function.js#66d9ef italic
constant.numeric.js#ae81ff
variable.language.arguments.js, variable.language.super.js, variable.language.this.js, variable.language.self.js, variable.language.proto.js, variable.language.constructor.js, variable.language.prototype.js#66d9ef italic
meta.brace.square.js#ffffff
meta.brace.round, punctuation.definition.parameters.begin.js, punctuation.definition.parameters.end.js, punctuation.definition.group#ffffff
meta.brace.curly.js, meta.object-literal.js#ffffff
meta.structure.dictionary.json string.quoted.double.json#cfcfc2
punctuation.section.embedded.coffee#e69f66
keyword.operator.index-start.php, keyword.operator.index-end.php#ffffff
meta.array.php#ffffff
meta.array.php support.function.construct.php, meta.array.empty.php support.function.construct.php#e42e70
support.function.construct.php#e42e70
storage.type.function.php#f92672dd
constant.numeric.php#be84ff
keyword.other.new.php#f6aa11
support.class.php#ffffff
variable.other.property.php#f6aa11
storage.modifier.extends.php, storage.type.class.php, keyword.operator.class.php#a6e22e
meta.other.inherited-class.php#a6e22e
storage.type.php#66d9ef
entity.name.function.php#66d9ef
support.function.construct.php#a6e22e
entity.name.type.class.php, meta.function-call.php, meta.function-call.static.php, meta.function-call.object.php#ffffff
keyword.other.phpdoc#7c7865
source.php.embedded.block.html#ffffff
invalid#f8f8f0
invalid.deprecated#f8f8f0
meta.diff, meta.diff.header#75715e
markup.deleted#f92672
markup.inserted#a6e22e
markup.changed#e6db74
meta.diff, meta.diff.range#3bc0f0
storage.type.class.python, storage.type.function.python, storage.modifier.global.python#a6e22e
keyword.control.import.python, keyword.control.import.from.python#f92672dd
support.type.exception.python#66d9ef
punctuation.definition.variable.perl, variable.other.readwrite.global.perl, variable.other.predefined.perl, keyword.operator.comparison.perl#e42e70
support.function.perl#66d9ef
comment.line.number-sign.perl#75715eitalic
punctuation.definition.string.begin.perl, punctuation.definition.string.end.perl#ffffff
constant.character.escape.perl#dc322f
constant.language.ruby, constant.numeric.ruby#ae81ff
punctuation.definition.variable.ruby#f6aa11
meta.function.method.with-arguments.ruby#a6e22e
variable.language.ruby#ffffff
entity.name.function.ruby#f6aa11
keyword.control.ruby, keyword.control.def.ruby#a6e22ebold
keyword.control.class.ruby, meta.class.ruby#a6e22e
entity.name.type.class.ruby#66d9ef
keyword.control.ruby#a6e22e
support.class.ruby#66d9ef
keyword.other.special-method.ruby#a6e22e
variable.other.constant.ruby#66d9ef
constant.other.symbol.ruby#f6f080
punctuation.section.embedded.ruby, punctuation.definition.string.begin.ruby, punctuation.definition.string.end.ruby#f92672
keyword.other.special-method.ruby#e42e70
text.html.markdown#ffffff
text.html.markdown markup.raw.inline#ec3533
text.html.markdown meta.dummy.line-break#e0eddd
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#fd971f
markup.italic#e42e70italic
markup.bold#f92672bold
markup.underline#a6e22eunderline
markup.strike#cc4273
markup.quote, punctuation.definition.blockquote.markdown#66d9efitalic
markup.quote#66d9ef italic
string.other.link.title.markdown#66d9efunderline
markup.raw.block#ae81ff
punctuation.definition.list_item.markdown#777777
markup.raw.block.fenced.markdown#ffffff
punctuation.definition.fenced.markdown, variable.language.fenced.markdown#636050
variable.language.fenced.markdown#7c7865
meta.separator#ffffff33bold
markup.table#b42a1d
variable.other.math.tex#e6db74
other.package.exclude, other.remove#d3201f
support.function.builtin.shell#a6e22e
variable.other.normal.shell#66d9ef
source.shell#ffffff
meta.scope.for-in-loop.shell, variable.other.loop.shell#fd971f
entity.name.function.shell#a6e22e
punctuation.definition.string.end.shell, punctuation.definition.string.begin.shell#ffffff
meta.scope.case-block.shell, meta.scope.case-body.shell#fd971f
punctuation.definition.logical-expression.shell#ffffff
comment.line.number-sign.shell#7c7865italic
comment.line.number-sign.makefile#7c7865
punctuation.definition.comment.makefile#7c7865
variable.other.makefile#f92672
entity.name.function.makefile#a6e22e
meta.function.makefile#66d9ef
markup.deleted.git_gutter#F92672
markup.inserted.git_gutter#A6E22E
markup.changed.git_gutter#967EFB
markup.ignored.git_gutter#565656
markup.untracked.git_gutter#565656
string.other.path.nginx#fc951e

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Agila Theme - Coding Theme