Skip to main content
CodingTheme

VS Code preview

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

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

  • activityBar.activeBackground#232323
  • activityBar.activeBorder#232323
  • activityBar.activeFocusBorder#e74c3c
  • activityBar.background#232323
  • activityBar.border#232323
  • activityBar.foreground#a9ba21
  • activityBar.inactiveForeground#e1e1e1CC
  • activityBarBadge.background#a9ba21
  • activityBarBadge.foreground#101010
  • badge.background#a9ba21
  • badge.foreground#101010
  • button.background#a9ba21
  • button.foreground#101010
  • button.hoverBackground#a9ba21CC
  • contrastActiveBorder#fff0
  • contrastBorder#fff0
  • dropdown.background#494949
  • dropdown.border#494949
  • dropdown.foreground#e1e1e1
  • dropdown.listBackground#494949
  • editor.background#232323
  • editor.foreground#e1e1e1E6
  • editorGroupHeader.border#fff0
  • editorGroupHeader.noTabsBackground#232323
  • editorGroupHeader.tabsBackground#232323
  • editorGroupHeader.tabsBorder#fff0
  • editorUnnecessaryCode.border#e74c3c
  • editorUnnecessaryCode.opacity#e1e1e180
  • errorForeground#e74c3c
  • extensionButton.prominentBackground#a9ba21
  • extensionButton.prominentForeground#101010
  • extensionButton.prominentHoverBackground#a9ba21
  • focusBorder#fff0
  • foreground#e1e1e1
  • icon.foreground#e1e1e166
  • inputValidation.errorBackground#e74c3c
  • inputValidation.errorBorder#e74c3c
  • inputValidation.errorForeground#e1e1e1
  • inputValidation.infoBackground#494949
  • inputValidation.infoBorder#a9ba21
  • inputValidation.infoForeground#e1e1e1
  • inputValidation.warningBackground#494949
  • inputValidation.warningBorder#f1c40f
  • inputValidation.warningForeground#e1e1e1
  • list.focusBackground#e1e1e116
  • list.focusForeground#e1e1e1
  • list.highlightForeground#99cf54
  • list.hoverBackground#e1e1e116
  • list.hoverForeground#e1e1e1
  • list.inactiveSelectionBackground#e1e1e116
  • list.inactiveSelectionForeground#e1e1e1
  • pickerGroup.border#a9ba21
  • pickerGroup.foreground#a9ba21
  • problemsErrorIcon.foreground#e74c3c
  • problemsInfoIcon.foreground#5e98e2
  • problemsWarningIcon.foreground#f1c40f
  • progressBar.background#a9ba21
  • sash.hoverBorder#494949
  • scrollbar.shadow#fff0
  • settings.dropdownListBorder#a9ba21
  • settings.modifiedItemIndicator#a9ba21
  • sideBar.background#232323
  • sideBar.border#fff0
  • sideBar.dropBackground#232323
  • sideBar.foreground#e1e1e1
  • sideBarSectionHeader.background#232323
  • sideBarSectionHeader.border#fff0
  • sideBarSectionHeader.foreground#e1e1e1
  • sideBarTitle.foreground#e1e1e166
  • statusBar.background#494949
  • statusBar.border#fff0
  • statusBar.debuggingBackground#e74c3cE6
  • statusBar.debuggingBorder#fff0
  • statusBar.debuggingForeground#e1e1e1
  • statusBar.foreground#e1e1e1
  • statusBar.noFolderBackground#f1c40f
  • statusBar.noFolderBorder#fff0
  • statusBar.noFolderForeground#232323
  • statusBarItem.activeBackground#494949
  • statusBarItem.hoverBackground#23232380
  • statusBarItem.prominentBackground#06b1c4
  • statusBarItem.prominentForeground#e1e1e1
  • statusBarItem.prominentHoverBackground#5e98e2
  • statusBarItem.remoteBackground#a9ba21
  • statusBarItem.remoteForeground#232323
  • tab.activeBackground#e1e1e116
  • tab.activeBorder#a9ba21
  • tab.activeBorderTop#232323
  • tab.activeForeground#a9ba21
  • tab.activeModifiedBorder#232323
  • tab.border#fff0
  • tab.hoverBackground#232323
  • tab.hoverBorder#232323
  • tab.hoverForeground#f1c40f
  • tab.inactiveBackground#232323
  • tab.inactiveForeground#e1e1e199
  • tab.inactiveModifiedBorder#232323
  • tab.unfocusedActiveBackground#232323
  • tab.unfocusedActiveBorder#232323
  • tab.unfocusedActiveBorderTop#232323
  • tab.unfocusedActiveForeground#e1e1e1CC
  • tab.unfocusedActiveModifiedBorder#232323
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#417ab3
  • terminal.ansiBrightBlack#676965
  • terminal.ansiBrightBlue#83afd8
  • terminal.ansiBrightCyan#37e5e7
  • terminal.ansiBrightGreen#98e342
  • terminal.ansiBrightMagenta#bc93b6
  • terminal.ansiBrightRed#f44135
  • terminal.ansiBrightWhite#f1f1f1
  • terminal.ansiBrightYellow#fcea60
  • terminal.ansiCyan#00a7aa
  • terminal.ansiGreen#5da602
  • terminal.ansiMagenta#88658d
  • terminal.ansiRed#dbabb0
  • terminal.ansiWhite#f1f1f1
  • terminal.ansiYellow#cfad00
  • terminal.background#232323
  • terminal.border#fff0
  • terminal.foreground#e1e1e1
  • terminalCursor.background#232323
  • terminalCursor.foreground#a9ba21
  • textBlockQuote.background#494949
  • textBlockQuote.border#a9ba21
  • textCodeBlock.background#232323
  • textLink.foreground#a9ba21
  • textPreformat.foreground#d9d965
  • titleBar.activeBackground#494949
  • titleBar.activeForeground#e1e1e1
  • titleBar.border#232323
  • titleBar.inactiveBackground#494949
  • titleBar.inactiveForeground#e1e1e1
  • widget.shadow#fff0

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#fcfcfc80italic
invalid.illegal#e74c3cbold underline
constant.numeric#3f96b3
constant.numeric.float#3f96b3
constant.numeric.integer#3f96b3
constant.language.boolean#abdae8
constant.language.null#abdae8
keyword.operator.address, keyword.operator.arithmetic, keyword.operator.increment, keyword.operator.decrement, keyword.operator.comparison, keyword.operator.assignment#a0d787
keyword.operator.arithmetic.bitwise, keyword.operator.bitwise#abdae8
keyword.control#ff6188
constant.language#3f96b3bold
string.unquoted, string.quoted, string.template#ffd866
punctuation.definition.string.begin, punctuation.definition.string.end#f1c40fB3
constant.character.format.placeholder#fcfcfc
keyword.control.import#ff6188
constant.character.escape#fcfcfc
storage.type.function#81c784
entity.name.function#abdae8
support.function.builtin#abdae8underline
meta.function.parameters#fcfcfcitalic
storage.type.class#81c784
entity.name.type.class#abdae8
entity.other.inherited-class#abdae8
variable.parameter.function.language.special.self, variable.language.special.self#f1c40f
storage.modifier#81c784CCunderline italic
punctuation.definition.parameters.begin, punctuation.definition.parameters.end#fcfcfcnormal
keyword.operator.logical#ff6188
source.starlark#fcfcfc
comment.block.documentation.starlark punctuation.definition.string.begin.starlark, comment.block.documentation.starlark punctuation.definition.string.end.starlark#fcfcfc80italic
support.function.starlark#abdae8
keyword.other.type.php, comment.block.documentation.phpdoc.php support.class.php, constant.language.access-type.jsdoc, constant.language.symbol-type.jsdoc, constant.other.description.jsdoc, constant.other.email.link.underline.jsdoc, entity.name.tag.inline.jsdoc, keyword.operator.assignment.jsdoc, keyword.operator.control.jsdoc, meta.example.jsdoc, entity.name.type.instance.jsdoc#ffd866
storage.type.class.jsdoc, keyword.other.phpdoc.php#abdae8
variable.other.jsdoc#81c784
source.python#fcfcfc
storage.type.function.lambda.python#81c784
support.function.magic, support.variable.magic.python#abdae8italic
meta.function-call.generic.python#abdae8
variable.parameter.function.language.python#fcfcfcitalic
meta.function.parameters.python support.type.python, meta.function.python support.type.python#ffd866CC
variable.parameter.function.language.special.self.python, variable.language.special.self#f1c40f
support.type.python#abdae8
punctuation.definition.decorator.python, entity.name.function.decorator.python#5e98e2bold
meta.function-call.python support.type.python#3f96b3normal
source.go#fcfcfc
entity.name.package.go#abdae8underline
keyword.import.go#ff6188
entity.name.import#fcfcfc
keyword.function.go, keyword.var.go, keyword.const.go, keyword.map.go, keyword.type.go#81c784
keyword.struct.go, keyword.interface.go#81c784
entity.name.type.go, storage.type.string.go, storage.type.boolean.go, storage.type.byte.go, storage.type.error.go, storage.type.numeric.go, storage.type.rune.go, storage.type.uintptr.go#ffd866CC
support.function.go#abdae8
keyword.operator.ellipsis.go, keyword.operator.address.go#ffd866
keyword.operator.channel.go, keyword.channel.go#abdae8
constant.other.placeholder.go#fcfcfc
constant.other.placeholder.gotemplate#fcfcfc
variable.other.gotemplate#3f96b3
punctuation.section.embedded.begin.gotemplate, punctuation.section.embedded.end.gotemplate, keyword.operator.pipe.gotemplate#81c784
source.shell#fcfcfc
constant.numeric.hex.shell, constant.numeric.integer.shell, constant.numeric.octal.shell#3f96b3
storage.modifier.shell#81c784normal
keyword.operator.redirect.shell, keyword.operator.pipe.shell#81c784regular
punctuation.section.array.shell, variable.other.bracket.shell#f1c40f
source.php#fcfcfc
meta.include.php string.quoted.double.php, meta.include.php string.quoted.single.php#fcfcfc
entity.name.type.interface.php, entity.name.type.trait.php#abdae8
storage.type.interface.php, storage.type.trait.php, support.class.exception.php#81c784
storage.type.php#ffd866CC
storage.modifier.reference.php, punctuation.definition.variable.php, punctuation.definition.arrow.php, keyword.operator.key.php#ffd866normal
meta.function.parameter.no-default.php storage.modifier.reference.php, meta.function.parameter.no-default.php punctuation.definition.variable.php, meta.function.parameter.no-default.php punctuation.definition.arrow.php, meta.function.parameter.no-default.php keyword.operator.key.php#ffd866italic
variable.language.this.php, keyword.other.new.php#f1c40fbold
keyword.operator.nullable-type.php#ffd866CC
keyword.other.use.php#ff6188
meta.use.php support.class.php, meta.function-call.php entity.name.function.php, meta.function-call.php support.function.alias.php, meta.function-call.php support.function.apc.php, meta.function-call.php support.function.array.php, meta.function-call.php support.function.basic_functions.php, meta.function-call.php support.function.bcmath.php, meta.function-call.php support.function.blenc.php, meta.function-call.php support.function.bz2.php, meta.function-call.php support.function.calendar.php, meta.function-call.php support.function.classobj.php, meta.function-call.php support.function.com.php, meta.function-call.php support.function.construct.output.php, meta.function-call.php support.function.construct.php, meta.function-call.php support.function.ctype.php, meta.function-call.php support.function.curl.php, meta.function-call.php support.function.datetime.php, meta.function-call.php support.function.dba.php, meta.function-call.php support.function.dbx.php, meta.function-call.php support.function.dir.php, meta.function-call.php support.function.eio.php, meta.function-call.php support.function.enchant.php, meta.function-call.php support.function.ereg.php, meta.function-call.php support.function.errorfunc.php, meta.function-call.php support.function.exec.php, meta.function-call.php support.function.exif.php, meta.function-call.php support.function.fann.php, meta.function-call.php support.function.file.php, meta.function-call.php support.function.fileinfo.php, meta.function-call.php support.function.filter.php, meta.function-call.php support.function.fpm.php, meta.function-call.php support.function.funchand.php, meta.function-call.php support.function.gettext.php, meta.function-call.php support.function.gmp.php, meta.function-call.php support.function.hash.php, meta.function-call.php support.function.http.php, meta.function-call.php support.function.iconv.php, meta.function-call.php support.function.iisfunc.php, meta.function-call.php support.function.image.php, meta.function-call.php support.function.info.php, meta.function-call.php support.function.interbase.php, meta.function-call.php support.function.intl.php, meta.function-call.php support.function.json.php, meta.function-call.php support.function.ldap.php, meta.function-call.php support.function.libxml.php, meta.function-call.php support.function.magic.php, meta.function-call.php support.function.mail.php, meta.function-call.php support.function.math.php, meta.function-call.php support.function.mbstring.php, meta.function-call.php support.function.mcrypt.php, meta.function-call.php support.function.memcache.php, meta.function-call.php support.function.mhash.php, meta.function-call.php support.function.mongo.php, meta.function-call.php support.function.mysql.php, meta.function-call.php support.function.mysqli.php, meta.function-call.php support.function.mysqlnd-memcache.php, meta.function-call.php support.function.mysqlnd-ms.php, meta.function-call.php support.function.mysqlnd-qc.php, meta.function-call.php support.function.mysqlnd-uh.php, meta.function-call.php support.function.network.php, meta.function-call.php support.function.nsapi.php, meta.function-call.php support.function.oci8.php, meta.function-call.php support.function.opcache.php, meta.function-call.php support.function.openssl.php, meta.function-call.php support.function.output.php, meta.function-call.php support.function.password.php, meta.function-call.php support.function.pcntl.php, meta.function-call.php support.function.pgsql.php, meta.function-call.php support.function.php_apache.php, meta.function-call.php support.function.php_dom.php, meta.function-call.php support.function.php_ftp.php, meta.function-call.php support.function.php_imap.php, meta.function-call.php support.function.php_mssql.php, meta.function-call.php support.function.php_odbc.php, meta.function-call.php support.function.php_pcre.php, meta.function-call.php support.function.php_spl.php, meta.function-call.php support.function.php_zip.php, meta.function-call.php support.function.posix.php, meta.function-call.php support.function.proctitle.php, meta.function-call.php support.function.pspell.php, meta.function-call.php support.function.readline.php, meta.function-call.php support.function.recode.php, meta.function-call.php support.function.rrd.php, meta.function-call.php support.function.sem.php, meta.function-call.php support.function.session.php, meta.function-call.php support.function.shmop.php, meta.function-call.php support.function.simplexml.php, meta.function-call.php support.function.snmp.php, meta.function-call.php support.function.soap.php, meta.function-call.php support.function.sockets.php, meta.function-call.php support.function.sqlite.php, meta.function-call.php support.function.sqlsrv.php, meta.function-call.php support.function.stats.php, meta.function-call.php support.function.streamsfuncs.php, meta.function-call.php support.function.string.php, meta.function-call.php support.function.sybase.php, meta.function-call.php support.function.taint.php, meta.function-call.php support.function.tidy.php, meta.function-call.php support.function.tokenizer.php, meta.function-call.php support.function.trader.php, meta.function-call.php support.function.uopz.php, meta.function-call.php support.function.url.php, meta.function-call.php support.function.var.php, meta.function-call.php support.function.wddx.php, meta.function-call.php support.function.xhprof.php, meta.function-call.php support.function.xml.php, meta.function-call.php support.function.xmlrpc.php, meta.function-call.php support.function.xmlwriter.php, meta.function-call.php support.function.zlib.php#abdae8
support.function.construct.output.php, support.function.basic_functions.php, meta.array.php support.function.construct.php, support.class.builtin.php#abdae8underline
storage.type.terraform, entity.name.label.terraform#abdae8
variable.declaration.terraform#81c784
string.quoted variable.other.member.terraform, string.quoted variable.other.readwrite.terraformunderline
string.quoted support.constant.terraform#3f96b3underline
keyword.operator.dockerfile, keyword.other.special-method.dockerfile#f1c40f
text.html#fcfcfc
entity.name.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#abdae8
source.ts, source.js#fcfcfc
keyword.control.from.ts, keyword.control.require.ts#ff6188
constant.language.import-export-all.ts#ff6188bold underline
keyword.operator.ternary.ts, keyword.operator.ternary.js, keyword.operator.spread.ts, keyword.operator.expression.of.ts, keyword.operator.type.ts, keyword.operator.expression.typeof.ts, keyword.operator.expression.typeof.js, keyword.operator.optional.ts, keyword.operator.relational.ts, keyword.operator.relational.js#a0d787
entity.name.type.ts, entity.name.type.js, support.type.primitive.ts, entity.name.type.alias.ts, entity.name.type.enum.ts, entity.name.type.interface.ts#ffd866CC
punctuation.definition.typeparameters.begin.ts, punctuation.definition.typeparameters.end.ts, meta.brace.angle.ts#3f96b3bold
keyword.operator.new.ts, keyword.operator.new.js, variable.language.this.ts, variable.language.this.js#f1c40f
entity.name.type.module.ts, entity.name.type.module.js, variable.other.object.ts, variable.other.object.js#f1c40f
support.function.json.ts, support.function.js#abdae8
variable.parameter.ts, variable.parameter.js#fcfcfcitalic
storage.type.type.ts, meta.var.expr.ts storage.type.ts, meta.var.expr.js storage.type.js, storage.type.enum.ts, storage.type.interface.ts, storage.modifier.js#81c784
support.class.builtin.ts, support.class.console.ts, support.class.error.ts, support.class.promise.ts, support.type.builtin.ts, support.constant.json.ts#abdae8underline
meta.object-literal.key.js#abdae8
source.proto#fcfcfc
keyword.other.proto, keyword.other.proto#81c784
entity.name.class.message.proto#abdae8
entity.name.class.proto#fcfcfcitalic
storage.type.proto#ffd866CC
constant.other.proto#f1c40funderline
source.css#fcfcfc
entity.other.attribute-name.class.mixin.css, support.function.misc.css, support.function.type-checking.less, support.function.any-method.builtin.less, support.function.url.css, support.function.misc.scss#abdae8
keyword.other.default.scss, keyword.other.important.css#e74c3citalic bold underline
support.constant.font-name.css, variable.parameter.url.scss#ffd866
meta.property-list.css variable.css, meta.definition.variable.scss variable.scss, variable.other.less#ffd866
support.type.property-name.css, support.type.vendored.property-name.css, meta.property-list.scss entity.name.tag.css, meta.property-list.css entity.name.tag.css#a0d787
meta.property-value.css, support.constant.property-value.css, support.constant.color.w3c-standard-color-name.css, variable.parameter.keyframe-list.css#81c784
meta.property-value.scss variable.scss, meta.property-value.css variable.other.less, meta.function.variable.css variable.argument.css#a9ba21normal
meta.at-rule.mixin.scss variable.scss, meta.at-rule.supports.header.css meta.property-name.css, variable.other.less#fcfcfcitalic
entity.other.keyframe-offset.css#ff6188
text.html.markdown, punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown#fcfcfc
markup.bold.markdown#a9ba21bold
markup.italic.markdown#a9ba21italic
markup.quote.markdownitalic
markup.raw.block.markdown#fcfcfc80
meta.image.inline.markdown#a9ba21bold
string.other.link.title.markdown, markup.underline.link.markdown, punctuation.definition.heading.markdown, punctuation.definition.list.begin.markdown, markup.inline.raw.string.markdown, markup.fenced_code.block.markdown punctuation.definition.markdown, punctuation.definition.quote.begin.markdown#a9ba21
string.json support.type.property-name.json#abdae8
constant.language.json#abdae8
entity.other.document.begin.yaml, entity.other.document.end.yaml#3f96b3
entity.name.tag.yaml#abdae8
constant.other.timestamp.yaml#abdae8underline
punctuation.definition.anchor.yaml, punctuation.definition.alias.yaml, keyword.control.flow.block-scalar.folded.yaml, keyword.control.flow.block-scalar.literal.yaml, storage.modifier.chomping-indicator.yaml, constant.language.merge.yaml#a0d787
entity.name.type.anchor.yaml, variable.other.alias.yaml#fcfcfcitalic
storage.type.tag-handle.yaml#f1c40fitalic

Shiki preview

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

Loading...

ACID by butuzov - VS Code Theme