Skip to main content
Coding Theme

Soft Colors

Publisher: Victor LitvinenkoThemes in package: 2

Soft Colors Theme was created with care for your eyes. I tried to save a low contrast balance with the least loss of code perception.

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#1a1f28
  • activityBar.border#1a1f28
  • activityBar.foreground#738699
  • activityBarBadge.background#b89d64
  • activityBarBadge.foreground#1a1f28
  • badge.background#b89d64
  • badge.foreground#1a1f28
  • button.background#FFD580BF
  • button.foreground#1a1f28
  • button.hoverBackground#ffcc66bb
  • debugExceptionWidget.background#272d38
  • debugExceptionWidget.border#343d4a
  • debugToolBar.background#272d38
  • diffEditor.insertedTextBackground#95e6cb15
  • diffEditor.removedTextBackground#f0717820
  • dropdown.background#212733
  • dropdown.listBackground#212733
  • editor.background#212733
  • editor.findMatchBackground#ffcc6633
  • editor.findMatchHighlightBackground#ffcc6633
  • editor.findRangeHighlightBackground#ffcc6633
  • editor.foreground#FFFFFFA8
  • editor.lineHighlightBackground#242b38
  • editor.rangeHighlightBackground#242b3863
  • editor.selectionBackground#343f4c
  • editor.wordHighlightBackground#ffcc6633
  • editor.wordHighlightStrongBackground#ffcc6633
  • editorBracketMatch.border#3d4752
  • editorCursor.foreground#FFD580BF
  • editorError.foreground#ff3333
  • editorGroup.border#343d4a
  • editorGroupHeader.noTabsBackground#212733
  • editorGroupHeader.tabsBackground#1a1f28
  • editorGroupHeader.tabsBorder#212733
  • editorGutter.addedBackground#bae67e
  • editorGutter.deletedBackground#ff3333
  • editorGutter.modifiedBackground#5CCFE6CC
  • editorHoverWidget.background#272d38
  • editorHoverWidget.border#343d4a
  • editorIndentGuide.background1#2b333b
  • editorLineNumber.foreground#3d4752
  • editorLink.activeForeground#ffcc66
  • editorMarkerNavigation.background#272d38
  • editorOverviewRuler.border#343d4a
  • editorOverviewRuler.errorForeground#ff3333
  • editorOverviewRuler.warningForeground#ffcc66
  • editorRuler.foreground#343d4a
  • editorSuggestWidget.background#272d38
  • editorSuggestWidget.border#343d4a
  • editorSuggestWidget.highlightForeground#ffcc66
  • editorSuggestWidget.selectedBackground#303540
  • editorWarning.foreground#ffcc66
  • editorWhitespace.foreground#3d4752
  • editorWidget.background#272d38
  • extensionButton.prominentBackground#ffcc66aa
  • extensionButton.prominentForeground#ffffff
  • extensionButton.prominentHoverBackground#ffcc66bb
  • focusBorder#7386998a
  • foreground#738699
  • gitDecoration.conflictingResourceForeground#6da1dd
  • gitDecoration.ignoredResourceForeground#73869977
  • gitDecoration.modifiedResourceForeground#ffd580a2
  • gitDecoration.untrackedResourceForeground#80ff80a2
  • input.background#272d38
  • input.border#7386994c
  • input.foreground#d9d7ce
  • input.placeholderForeground#7386998a
  • inputOption.activeBorder#7386998a
  • inputValidation.errorBackground#212733
  • inputValidation.errorBorder#ff3333
  • inputValidation.infoBackground#212733
  • inputValidation.infoBorder#5CCFE6CC
  • inputValidation.warningBackground#212733
  • inputValidation.warningBorder#ffd580
  • list.activeSelectionBackground#343d4a
  • list.activeSelectionForeground#d9d7ce
  • list.focusBackground#303540
  • list.focusForeground#d9d7ce
  • list.highlightForeground#ffcc66
  • list.hoverBackground#303540
  • list.hoverForeground#d9d7ce
  • list.inactiveSelectionBackground#ffffff08
  • list.inactiveSelectionForeground#d9d7ce
  • notificationCenter.border#1a1f28
  • notificationCenterHeader.background#1a1f28
  • notificationCenterHeader.foreground#ffcc66
  • notificationLink.foreground#ffae57
  • notifications.background#343d4a
  • notifications.foreground#ffffff
  • notificationToast.border#1a1f28
  • panel.background#1a1f28
  • panel.border#11141ab3
  • panelTitle.activeBorder#1a1f28
  • panelTitle.activeForeground#FFFFFFA8
  • panelTitle.inactiveForeground#66737f
  • peekView.border#343d4a
  • peekViewEditor.background#272d38
  • peekViewEditor.matchHighlightBackground#ffcc6633
  • peekViewResult.background#272d38
  • peekViewResult.fileForeground#738699
  • peekViewResult.matchHighlightBackground#ffcc6633
  • peekViewTitle.background#272d38
  • peekViewTitleDescription.foreground#738699
  • peekViewTitleLabel.foreground#738699
  • pickerGroup.border#343d4a
  • pickerGroup.foreground#ffcc66
  • progressBar.background#ffcc66
  • scrollbar.shadow#11141a11
  • scrollbarSlider.activeBackground#ffffff22
  • scrollbarSlider.background#ffffff11
  • scrollbarSlider.hoverBackground#ffffff22
  • selection.background#343f4cfd
  • sideBar.background#1a1f28
  • sideBar.border#11141ab3
  • sideBar.foreground#738699dd
  • sideBarSectionHeader.background#1a1f28
  • sideBarSectionHeader.foreground#738699dd
  • sideBarTitle.foreground#FFFFFFA8
  • statusBar.background#1a1f28
  • statusBar.border#1a1f28
  • statusBar.debuggingBackground#6C90B9CC
  • statusBar.debuggingForeground#E6E6E6
  • statusBar.foreground#738699
  • statusBar.noFolderBackground#272d38
  • statusBarItem.activeBackground#343d4a
  • statusBarItem.hoverBackground#303540
  • statusBarItem.prominentBackground#343d4a
  • statusBarItem.prominentHoverBackground#303540
  • tab.activeBackground#212733
  • tab.activeForeground#FFFFFFA8
  • tab.border#1a1f28
  • tab.inactiveBackground#1a1f28
  • tab.inactiveForeground#516170
  • tab.unfocusedActiveForeground#d9d7ceaa
  • tab.unfocusedInactiveForeground#738699
  • terminal.ansiBlack#1a1f28
  • terminal.ansiBlue#3182bd
  • terminal.ansiBrightBlack#737475
  • terminal.ansiBrightBlue#3182bd
  • terminal.ansiBrightCyan#80b1d3
  • terminal.ansiBrightGreen#44a762
  • terminal.ansiBrightMagenta#756bb1
  • terminal.ansiBrightRed#e31a1c
  • terminal.ansiBrightWhite#d1d1d1
  • terminal.ansiBrightYellow#dca060
  • terminal.ansiCyan#80b1d3
  • terminal.ansiGreen#31A354
  • terminal.ansiMagenta#756bb1
  • terminal.ansiRed#c2282a
  • terminal.ansiWhite#b7b8b9
  • terminal.ansiYellow#dca060
  • terminal.background#1a1f28
  • terminal.border#343d4a
  • terminal.foreground#b7b8b9
  • terminalCursor.background#b7b8b9
  • terminalCursor.foreground#b7b8b9
  • textBlockQuote.background#272d38
  • textLink.activeForeground#ffcc66
  • textLink.foreground#FFD580BF
  • textPreformat.foreground#d9d7ce
  • titleBar.activeBackground#1a1f28
  • titleBar.activeForeground#738699
  • titleBar.border#1a1f28
  • titleBar.inactiveBackground#1a1f28
  • titleBar.inactiveForeground#516170
  • walkThrough.embeddedEditorBackground#272d38
  • widget.shadow#11141ab3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5C6773
variable#D9D7CE
constant.other.placeholder.go#5CCFE6CC
keyword, storage.type, storage.modifier#FFAE57
constant.other.color, punctuation.separator.inheritance.php, punctuation.section.embedded, keyword.other.substitution#5CCFE6CC
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#5CCFE6CC
meta.tag.jsx, meta.tag.tsx#D9D7CE
meta.tag#FFFFFFA8
entity.name.function, keyword.other.special-method, variable.function, meta.block-level, support.function#FFD580
support.other.variable, string.other.link#ff605a
constant.numeric, constant.language, support.constant, constant.character, variable.parameter, keyword.other.unit#6C90B9CC
string, keyword.other.template, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js, meta.group.braces.curly constant.other.object.key.ts string.unquoted.label.ts#FFD580BF
entity.name.class, entity.name.type.class, entity.name.instance, entity.name.type.instance, support.type, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter#5ccfe6cc
entity.name.module, entity.name.type.module, variable.import.parameter.js, variable.other.class.js, variable.import.parameter.ts, variable.other.class.ts#5ccfe6cc
variable.language#5ccfe6ccitalic
invalid#c2282a
invalid.deprecated#FFFFFF
punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag#5CCFE690
entity.other.attribute-name#FFAE57
markup.inserted#BAE67E
markup.deleted#5ccfe6cc
markup.changed#FFAE57
string.regexp, constant.character.escape#5CCFE6CC
keyword.control.anchor.regexp
*url*, *link*, *uri*underline
constant.numeric.line-number.find-in-files - match#5C6773
entity.name.filename.find-in-files#BAE67E
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js, tag.decorator.ts entity.name.tag.ts, tag.decorator.ts punctuation.definition.tag.ts#FFC44Citalic
source.js constant.other.object.key.js string.unquoted.label.js, source.ts constant.other.object.key.ts string.unquoted.label.ts#5ccfe6ccitalic
entity.name.method.js, entity.name.method.ts#FFC44C
meta.class-method.js entity.name.function.js, variable.function.constructor, meta.class-method.ts entity.name.function.ts#FFC44C
markup.italic#F07178italic
markup.bold#F07178bold
markup.underline#6C90B9CCunderline
markup.strike#FFC44C
markup.quote#5CCFE6CCitalic
markup.fenced_code.block.markdown#FFAE57
markup.table#5ccfe6cc
text.html.markdown, punctuation.definition.list_item.markdown#FFFFFFA8
text.html.markdown markup.inline.raw.string.markdown#5ccfe6cc
text.html.markdown meta.dummy.line-break#5C6773
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#5CCFE6CC
markup.quote, punctuation.definition.blockquote.markdown#5CCFE6CCitalic
string.other.link.title.markdown#FFAE5794underline
markup.raw.block.fenced.markdown#D9D7CE
punctuation.definition.fenced.markdown, variable.language.fenced.markdown#5C6773
variable.language.fenced.markdown#5C6773
meta.separator#5C6773bold
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta meta.structure.dictionary.json string.quoted.double.json - meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta.structure.dictionary.json punctuation.definition.string - meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
source.json meta.structure.dictionary.json string.quoted.double.json - meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta.structure.dictionary.json punctuation.definition.string - meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#5ccfe6cc
acejump.label.blue#FFFFFF
acejump.label.green#FFFFFF
acejump.label.orange#FFFFFF
acejump.label.purple#FFFFFF
sublimelinter.mark.warning#5ccfe6cc
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#FF3333
markup.ignored.git_gutter#5C6773
markup.untracked.git_gutter#5C6773
gutter_color#FFFFFF
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f44747
token.debug-token#b267e6
string#6c90b9cc
meta.embedded.assembly#6c90b9cc
entity.other.attribute-name, keyword.control, storage.type, storage.modifier#ffae5794italic
commentitalic
punctuation, variable.language.this.js, punctuation.definition.tag.begin, punctuation.definition.tag.end, variable.language.this.ts#586f89
entity.name.tag, variable.language, entity.name.type.class, punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.end.js, punctuation.definition.template-expression.begin.ts, punctuation.definition.template-expression.end.ts#5ccfe6cc
support.class#FFD580BF
punctuation.section.embedded#FFD580BF
variable, support.variable.property.js, support.variable.property.ts#ffffffa8
meta.tag#ffffff9a
variable.object.property.js, meta.object-literal.key.js, variable.object.property.ts, meta.object-literal.key.ts#5ccfe6cc
meta.brace#5ccfe690
punctuation.definition.parameters.begin.js.jsx, punctuation.definition.parameters.end.js.jsx, punctuation.definition.parameters.begin.ts.tsx, punctuation.definition.parameters.end.ts.tsx#5ccfe690
entity.name.function, support.function, keyword, entity.other.inherited-class#FFD580BF
constant.character.escape#5CCFE6CC
constant.numeric, constant.language#FFAE5794
storage.type.function.arrow.js, storage.type.function.arrow.ts
variable.parameter#ffae57a2
entity.name.tag.css#FFD580BF
meta.object-literal.key.tsx, meta.object-literal.key.ts#5CCFE6CC
storage.type.function.arrow.tsx, storage.type.function.arrow.ts

Shiki preview

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

Loading...