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.activeBorder#100F0F
  • activityBar.background#FFFCF0
  • activityBar.border#DAD8CE
  • activityBar.foreground#100F0F
  • activityBar.inactiveForeground#6F6E69
  • activityBarBadge.background#24837B
  • activityBarBadge.foreground#FFFCF0
  • badge.background#24837B
  • badge.foreground#FFFCF0
  • button.background#24837B
  • button.foreground#FFFCF0
  • diffEditor.insertedTextBackground#879A3999
  • diffEditor.removedTextBackground#D14D4199
  • dropdown.background#F2F0E5
  • dropdown.border#DAD8CE
  • dropdown.foreground#100F0F
  • dropdown.listBackground#FFFCF0
  • editor.background#FFFCF0
  • editor.findMatchBackground#D0A215
  • editor.findMatchHighlightBackground#D0A215cc
  • editor.findRangeHighlightBackground#F2F0E5
  • editor.foreground#100F0F
  • editor.hoverHighlightBackground#DAD8CE
  • editor.inactiveSelectionBackground#E6E4D9
  • editor.lineHighlightBackground#F2F0E5
  • editor.lineHighlightBorder#E6E4D9
  • editor.rangeHighlightBackground#CECDC3
  • editor.selectionBackground#100F0F44
  • editor.selectionHighlightBackground#100F0F44
  • editorBracketMatch.background#E6E4D9
  • editorBracketMatch.border#DAD8CE
  • editorError.foreground#AF3029
  • editorGroup.border#DAD8CE
  • editorGroupHeader.tabsBackground#FFFCF0
  • editorGutter.addedBackground#66800B
  • editorGutter.background#FFFCF0
  • editorGutter.deletedBackground#AF3029
  • editorGutter.modifiedBackground#24837B
  • editorHoverWidget.background#E6E4D9
  • editorIndentGuide.background1#DAD8CE
  • editorInfo.foreground#205EA6
  • editorInlayHint.background#DAD8CE
  • editorInlayHint.foreground#6F6E69
  • editorInlayHint.typeBackground#DAD8CE
  • editorInlayHint.typeForeground#100F0F
  • editorLineNumber.activeForeground#100F0F
  • editorLineNumber.foreground#CECDC3
  • editorSuggestWidget.background#FFFCF0
  • editorSuggestWidget.border#DAD8CE
  • editorSuggestWidget.foreground#100F0F
  • editorSuggestWidget.highlightForeground#6F6E69
  • editorSuggestWidget.selectedBackground#DAD8CE
  • editorWarning.foreground#BC5215
  • editorWhitespace.foreground#CECDC3
  • editorWidget.background#F2F0E5
  • editorWidget.border#DAD8CE
  • input.background#F2F0E5
  • input.border#DAD8CE
  • input.foreground#100F0F
  • input.placeholderForeground#6F6E69
  • inputOption.activeBackground#E6E4D9
  • inputOption.activeBorder#DAD8CE
  • inputOption.activeForeground#100F0F
  • inputValidation.errorBackground#AF3029
  • inputValidation.errorBorder#D14D41
  • inputValidation.infoBackground#24837B
  • inputValidation.infoBorder#3AA99F
  • inputValidation.warningBackground#BC5215
  • inputValidation.warningBorder#DA702C
  • list.activeSelectionBackground#CECDC3
  • list.activeSelectionForeground#100F0F
  • list.errorForeground#AF3029
  • list.hoverBackground#DAD8CE
  • list.hoverForeground#100F0F
  • list.inactiveSelectionBackground#DAD8CE
  • list.inactiveSelectionForeground#100F0F
  • list.warningForeground#BC5215
  • menu.background#FFFCF0
  • menu.border#DAD8CE
  • menu.foreground#100F0F
  • menu.selectionBackground#DAD8CE
  • menu.selectionForeground#100F0F
  • merge.border#DAD8CE
  • merge.commonContentBackground#CECDC3
  • merge.commonHeaderBackground#DAD8CE
  • merge.currentContentBackground#879A39
  • merge.currentHeaderBackground#66800B
  • merge.incomingContentBackground#3AA99F
  • merge.incomingHeaderBackground#24837B
  • notifications.background#E6E4D9
  • panel.background#FFFCF0
  • panel.border#DAD8CE
  • panelTitle.activeBorder#CECDC3
  • panelTitle.activeForeground#100F0F
  • panelTitle.inactiveForeground#6F6E69
  • peekView.border#DAD8CE
  • peekViewEditor.background#FFFCF0
  • peekViewEditor.matchHighlightBackground#CECDC3
  • peekViewResult.background#F2F0E5
  • peekViewResult.fileForeground#100F0F
  • peekViewResult.lineForeground#6F6E69
  • peekViewResult.matchHighlightBackground#CECDC3
  • peekViewResult.selectionBackground#E6E4D9
  • peekViewResult.selectionForeground#B7B5AC
  • peekViewTitle.background#DAD8CE
  • peekViewTitleDescription.foreground#6F6E69
  • peekViewTitleLabel.foreground#100F0F
  • sideBar.activeBackground#CECDC3
  • sideBar.activeForeground#100F0F
  • sideBar.background#FFFCF0
  • sideBar.border#DAD8CE
  • sideBar.fileIcon.foreground#205EA6
  • sideBar.folderIcon.foreground#66800B
  • sideBar.foreground#100F0F
  • sideBar.hoverBackground#DAD8CE
  • sideBar.hoverForeground#6F6E69
  • sideBarSectionHeader.background#F2F0E5
  • sideBarSectionHeader.border#DAD8CE
  • sideBarSectionHeader.foreground#100F0F
  • sideBarTitle.foreground#100F0F
  • statusBar.background#FFFCF0
  • statusBar.border#DAD8CE
  • statusBar.debuggingBackground#AF3029
  • statusBar.debuggingForeground#100F0F
  • statusBar.foreground#100F0F
  • statusBar.noFolderBackground#CECDC3
  • statusBar.noFolderForeground#B7B5AC
  • tab.activeBackground#FFFCF0
  • tab.activeForeground#100F0F
  • tab.activeModifiedBorder#AD8301
  • tab.border#DAD8CE
  • tab.hoverBackground#DAD8CE
  • tab.inactiveBackground#F2F0E5
  • tab.inactiveForeground#6F6E69
  • tab.inactiveModifiedBorder#205EA6
  • tab.unfocusedActiveModifiedBorder#D0A215
  • tab.unfocusedHoverBackground#DAD8CE
  • tab.unfocusedInactiveModifiedBorder#4385BE
  • terminal.ansiBlue#205EA6
  • terminal.ansiCyan#24837B
  • terminal.ansiGreen#66800B
  • terminal.ansiMagenta#24837B
  • terminal.ansiRed#AF3029
  • terminal.ansiYellow#AD8301
  • terminal.background#FFFCF0
  • terminal.foreground#100F0F
  • terminalCursor.background#FFFCF0
  • terminalCursor.foreground#100F0F
  • titleBar.activeBackground#FFFCF0
  • titleBar.activeForeground#100F0F
  • titleBar.border#DAD8CE
  • titleBar.inactiveBackground#F2F0E5
  • titleBar.inactiveForeground#6F6E69

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source, support.type.property-name.css#100F0F
entity.name.type.class#BC5215
entity.name.type.interface, entity.name.type#AD8301
entity.name.type.struct#BC5215
entity.name.type.enum#BC5215
meta.object-literal.key, support.type.property-name#BC5215
entity.name.function.method, meta.function.method#66800B
entity.name.function, support.function, meta.function-call.generic#BC5215bold
variable, meta.variable, variable.other.object.property#100F0F
variable.other.object, variable.other.readwrite.alias#66800B
variable.other.global, variable.language.this#A02F6F
variable.other.local#E6E4D9
variable.parameter, meta.parameter#100F0F
variable.other.property, meta.property#205EA6
string, string.other.link, markup.inline.raw.string.markdown, markup.inline.raw.code.mdx#24837B
constant.character.escape, constant.other.placeholder#100F0F
keyword#66800B
keyword.control.import, keyword.control.from, keyword.import#AF3029
storage.modifier, keyword.modifier, storage.type#205EA6
comment, punctuation.definition.comment#6F6E69
comment.documentation, comment.line.documentation#B7B5AC
constant.numeric#5E409D
constant.language.boolean, constant.language.json#AD8301
keyword.operator#AF3029
entity.name.function.preprocessor, meta.preprocessor#205EA6
meta.preprocessor#A02F6F
markup.underline.link, string.other.link.destination.mdx#205EA6
entity.name.tag#205EA6
support.class.component#A02F6F
entity.other.attribute-name, meta.attribute#AD8301
support.type#AD8301
variable.other.constant, variable.readonly#100F0F
entity.name.label, punctuation.definition.label#A02F6F
entity.name.namespace, storage.modifier.namespace, markup.bold.markdown#AD8301
entity.name.module, storage.modifier.module#AF3029
variable.type.parameter, variable.parameter.type#BC5215
keyword.control.exception, keyword.control.trycatch#A02F6F
meta.decorator, punctuation.decorator, entity.name.function.decorator#AD8301
variable.function#100F0F
punctuation, punctuation.terminator, punctuation.definition.tag, punctuation.separator, punctuation.definition.string, punctuation.section.block#6F6E69
storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, constant.language.go, support.class.dart, keyword.other.documentation, storage.modifier.import.java, punctuation.definition.list.begin.markdown, punctuation.definition.quote.begin.markdown, meta.separator.markdown, entity.name.section.markdown, entity.name.section.mdx, string.other.number.mdx, variable.ordered.list.mdx, variable.unordered.list.mdx#AD8301
#66800B
markup.italic.markdown, support.type.python, variable.legacy.builtin.python, support.constant.property-value.css, storage.modifier.attribute.swift#24837B
#205EA6
keyword.channel.go, keyword.other.platform.os.swift#5E409D
punctuation.definition.heading.markdown, punctuation.definition.heading.mdx#A02F6F
#AF3029
#BC5215

Shiki preview

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

Loading...

One Hunter Theme - Coding Theme