Skip to main content
Coding Theme

Color themes

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.background#16130F
  • activityBar.foreground#FFB84A
  • button.background#FFB84A
  • button.foreground#16130F
  • button.hoverBackground#FFCB7F
  • editor.background#1A1711
  • editor.foreground#F3EDE2
  • editor.lineHighlightBackground#2E2314
  • editor.selectionBackground#4F3D1F
  • editor.wordHighlightBackground#4F3D1F
  • editorGroupHeader.tabsBackground#16130F
  • focusBorder#FFB84A50
  • inputOption.activeBorder#FFB84A
  • progressBar.background#FFB84A
  • sideBar.background#1A1711
  • sideBar.foreground#E2D1B8
  • statusBar.background#16130F
  • statusBar.foreground#FFB84A
  • tab.activeBackground#1A1711
  • tab.inactiveBackground#16130F
  • titleBar.activeBackground#16130F

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, comment.line.double-slash, comment.block, comment.block.documentation, comment.line.number-sign.python, comment.line.hash.ruby, comment.line.percentage.ruby#9F8661italic
variable, string constant.other.placeholder, variable.other.readwrite, variable.other.object, variable.parameter, variable.language, variable.other.property, variable.other.ruby, variable.other.php, variable.other.normal.shell, variable.other.special.rust#F3EDE2
keyword, storage.type, storage.modifier, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.declaration, keyword.control.flow, storage.type.class.python, storage.type.function.python, storage.type.js, storage.type.ts, storage.type.java, storage.type.kotlin, storage.type.rust, storage.type.cs, storage.type.go#FFB84A
keyword.operator, punctuation, meta.brace, meta.delimiter, punctuation.definition.parameters, punctuation.separator, punctuation.terminator, punctuation.accessor, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.assignment#FFD700
entity.name.tag, support.class.component, entity.name.tag.html, entity.name.tag.xml, entity.name.tag.jsx, entity.name.tag.tsx, entity.name.tag.css, entity.name.tag.custom, punctuation.definition.tag#FFC773
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method, meta.method-call, meta.function, support.function.builtin, support.function.core, support.function.dom, support.function.php, support.function.magic.python#FFD68A
constant.numeric, constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, constant.other.color, constant.other.symbol, constant.other.key, support.constant.property-value, constant.numeric.decimal#FFA94D
string, string.quoted.single, string.quoted.double, string.template, string.interpolated, string.regexp, string.other.link, string.quoted.backtick, string.unquoted.heredoc#98FF98
entity.name.type, support.type, support.class, storage.type.generic, storage.type.primitive, entity.name.class, entity.other.inherited-class, entity.name.struct, entity.name.enum, entity.name.interface, support.type.primitive#FFE5B4
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#FFD68A
meta.decorator, meta.decorator entity.name.function, meta.decorator variable.other.readwrite, meta.decorator punctuation.decorator, storage.type.annotation, punctuation.definition.annotation#FFB84A
support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.sass, support.type.vendored.property-name, support.constant.property-value.css#FFC773
keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.default, keyword.control.async, keyword.control.await, storage.type.class.python, storage.type.function.python, storage.modifier.rust, keyword.declaration.rust#FFB84A
punctuation.definition.template-expression, punctuation.section.embedded, meta.embedded.line#FFD700
Cosmic Night Theme Collection by CosmicNight - VS Code Theme