darc-city
Publisher: PerelaxThemes in package: 1
Theme based on City Lights and Darcula. Darcula has been modified to have reduced coloring and a crisp background.
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#1d252c
- activityBar.background#1d252c
- activityBar.border#333f4a
- activityBar.foreground#f0f0f0
- activityBar.inactiveForeground#f0f0f077
- activityBarBadge.background#96a3b0
- activityBarBadge.foreground#11151a
- badge.background#42494d
- badge.foreground#f0f0f0
- breadcrumb.activeSelectionForeground#41505e
- breadcrumb.background#1d252c
- breadcrumb.focusForeground#e0e0e0
- breadcrumb.foreground#b7c4cf
- button.background#1d252c
- button.foreground#ffffff
- button.hoverBackground#356d94
- contrastBorder#f0f0f000
- debugExceptionWidget.background#181e24
- debugExceptionWidget.border#333f4a
- debugToolBar.background#181e24
- descriptionForeground#b7c5d3
- diffEditor.insertedTextBackground#6c794d33
- diffEditor.insertedTextBorder#204729
- diffEditor.removedTextBackground#ab3b3b28
- diffEditor.removedTextBorder#5c2a31
- dropdown.background#1d252c
- dropdown.border#333f4a
- dropdown.foreground#cccccc
- editor.background#000000
- editor.findMatchBackground#2a3d54
- editor.findMatchBorder#66768a
- editor.findMatchHighlightBackground#d5651c55
- editor.findMatchHighlightBorder#f0f0f000
- editor.findRangeHighlightBackground#3a3d4166
- editor.findRangeHighlightBorder#f0f0f000
- editor.foldBackground#264f784d
- editor.foreground#f2f2f2
- editor.hoverHighlightBackground#264f7840
- editor.inactiveSelectionBackground#3a3d41
- editor.lineHighlightBackground#f0f0f00a
- editor.lineHighlightBorder#282828
- editor.rangeHighlightBackground#f0f0f00b
- editor.rangeHighlightBorder#f0f0f000
- editor.selectionBackground#245b8fcc
- editor.selectionHighlightBackground#add6ff26
- editor.selectionHighlightBorder#495f77
- editor.wordHighlightBackground#575757b8
- editor.wordHighlightStrongBackground#004972b8
- editorBracketMatch.background#0064001a
- editorBracketMatch.border#888888
- editorCodeLens.foreground#999999
- editorCursor.background#000000
- editorCursor.foreground#aeafad
- editorError.background#b73a3400
- editorError.border#f0f0f000
- editorError.foreground#f48771
- editorGroup.border#444444
- editorGroup.dropBackground#333f4a
- editorGroup.emptyBackground#1d252c
- editorGroupHeader.noTabsBackground#333f4a
- editorGroupHeader.tabsBackground#181e24
- editorGroupHeader.tabsBorder#333f4a
- editorGutter.addedBackground#587c0c
- editorGutter.background#000000
- editorGutter.deletedBackground#881b20
- editorGutter.foldingControlForeground#c5c5c5
- editorGutter.modifiedBackground#0c7d9d
- editorHoverWidget.background#0f0f0f
- editorHoverWidget.border#394b58
- editorHoverWidget.foreground#cccccc
- editorInfo.background#4490bf00
- editorInfo.border#4490bf00
- editorInfo.foreground#75beff
- editorLineNumber.activeForeground#c6c6c6
- editorLineNumber.foreground#a1a1a1
- editorLink.activeForeground#4e94ce
- editorMarkerNavigation.background#2d2d30
- editorMarkerNavigationError.background#f48771
- editorMarkerNavigationInfo.background#75beff
- editorMarkerNavigationWarning.background#cca700
- editorOverviewRuler.background#25252500
- editorOverviewRuler.border#7f7f7f4d
- editorOverviewRuler.commonContentForeground#ebbf8355
- editorOverviewRuler.currentContentForeground#ee3a4355
- editorOverviewRuler.incomingContentForeground#3ad90055
- editorRuler.foreground#5a5a5a
- editorSuggestWidget.background#0f0f0f
- editorSuggestWidget.border#394b58
- editorSuggestWidget.foreground#d4d4d4
- editorSuggestWidget.highlightForeground#2d94c7
- editorSuggestWidget.selectedBackground#133454cc
- editorWarning.background#a9904000
- editorWarning.border#f0f0f000
- editorWarning.foreground#cca700
- editorWhitespace.foreground#e3e4e229
- editorWidget.background#181e24
- editorWidget.foreground#cccccc
- editorWidget.resizeBorder#333f4a
- errorForeground#e27e8d
- extensionButton.prominentBackground#008b94
- extensionButton.prominentForeground#ffffff
- extensionButton.prominentHoverBackground#008b94
- focusBorder#333f4a
- foreground#c4ccd3
- gitDecoration.addedResourceForeground#81b88b
- gitDecoration.conflictingResourceForeground#6c6cc4
- gitDecoration.deletedResourceForeground#c74e39
- gitDecoration.ignoredResourceForeground#8c8c8c
- gitDecoration.modifiedResourceForeground#e2c08d
- gitDecoration.stageDeletedResourceForeground#c74e39
- gitDecoration.stageModifiedResourceForeground#e2c08d
- gitDecoration.submoduleResourceForeground#8db9e2
- gitDecoration.untrackedResourceForeground#73c991
- input.background#333f4a
- input.border#333f4a
- input.foreground#cccccc
- input.placeholderForeground#a6a6a6
- inputOption.activeBackground#007bd466
- inputOption.activeBorder#007acc00
- inputOption.activeForeground#f0f0f0
- inputValidation.errorBackground#e27e8d
- inputValidation.errorBorder#d95468
- inputValidation.errorForeground#ffffff
- inputValidation.infoBackground#5ec4ff
- inputValidation.infoBorder#539afc
- inputValidation.warningBackground#ebbf83
- inputValidation.warningBorder#d98e48
- list.activeSelectionBackground#212b34
- list.activeSelectionForeground#f0f0f0
- list.dropBackground#292e36
- list.focusBackground#212b34
- list.focusForeground#cccccc
- list.highlightForeground#3396d7
- list.hoverBackground#1d252c
- list.hoverForeground#cccccc
- list.inactiveSelectionBackground#11151a
- list.inactiveSelectionForeground#cccccc
- listFilterWidget.background#5a4b0f
- listFilterWidget.noMatchesOutline#be1100
- listFilterWidget.outline#00000000
- menu.background#1d252c
- menu.foreground#f0f0f0
- menu.selectionBackground#333f4a
- menu.selectionForeground#f0f0f0
- menu.separatorBackground#333f4a
- menubar.selectionBackground#333f4a
- menubar.selectionForeground#f0f0f0
- panel.background#000000
- panel.border#80808059
- panelTitle.activeBorder#e7e7e7
- panelTitle.activeForeground#e7e7e7
- panelTitle.inactiveForeground#e7e7e799
- peekView.border#293943
- peekViewEditor.background#041826
- peekViewEditor.matchHighlightBackground#00000099
- peekViewEditor.matchHighlightBorder#9f651c
- peekViewEditorGutter.background#041826
- peekViewResult.background#000000
- peekViewResult.fileForeground#f0f0f0
- peekViewResult.lineForeground#c9c9c9
- peekViewResult.matchHighlightBackground#b05c264d
- peekViewResult.selectionBackground#527fab33
- peekViewResult.selectionForeground#f0f0f0
- peekViewTitle.background#0b0f13
- peekViewTitleDescription.foreground#ccccccb3
- peekViewTitleLabel.foreground#f0f0f0
- pickerGroup.border#333f4a
- pickerGroup.foreground#3794ff
- progressBar.background#0e70c0
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#333f4a
- scrollbarSlider.background#41505e80
- scrollbarSlider.hoverBackground#41505ecc
- selection.background#396892
- sideBar.background#11151a
- sideBar.border#1d252c
- sideBar.dropBackground#11151a
- sideBar.foreground#b7c5d3
- sideBarSectionHeader.background#1d252c
- sideBarSectionHeader.border#cccccc33
- sideBarSectionHeader.foreground#b7c5d3
- sideBarTitle.foreground#b7c5d3
- statusBar.background#333f4a
- statusBar.border#333f4a
- statusBar.debuggingBackground#cc6633
- statusBar.debuggingForeground#f0f0f0
- statusBar.foreground#f0f0f0
- statusBar.noFolderBackground#1d252c
- statusBar.noFolderForeground#f0f0f0
- statusBarItem.activeBackground#f0f0f025
- statusBarItem.hoverBackground#f0f0f01f
- statusBarItem.prominentBackground#171d23
- statusBarItem.prominentHoverBackground#333f4a
- statusBarItem.remoteBackground#21344e
- statusBarItem.remoteForeground#f0f0f0
- tab.activeBackground#1d252c
- tab.activeBorder#00000000
- tab.activeBorderTop#00000000
- tab.activeForeground#f0f0f0
- tab.border#333f4a
- tab.inactiveBackground#11151a
- tab.inactiveForeground#f0f0f081
- tab.unfocusedActiveForeground#1d252c
- tab.unfocusedInactiveForeground#f0f0f081
- terminal.ansiBlack#000000
- terminal.ansiBlue#5199d3
- terminal.ansiBrightBlack#666666
- terminal.ansiBrightBlue#6fc0ff
- terminal.ansiBrightCyan#47cfd1
- terminal.ansiBrightGreen#42bd3d
- terminal.ansiBrightMagenta#d670d6
- terminal.ansiBrightRed#f55b5b
- terminal.ansiBrightWhite#e5e5e5
- terminal.ansiBrightYellow#f5f543
- terminal.ansiCyan#24b2b4
- terminal.ansiGreen#32c02d
- terminal.ansiMagenta#bc3fbc
- terminal.ansiRed#e24040
- terminal.ansiWhite#e5e5e5
- terminal.ansiYellow#d3d319
- terminal.background#000000
- terminal.border#80808059
- terminal.foreground#cccccc
- terminal.selectionBackground#668eab40
- terminalCursor.background#0087ff
- terminalCursor.foreground#f0f0f0
- textBlockQuote.background#171d23
- textBlockQuote.border#171d23
- textCodeBlock.background#171d23
- textLink.activeForeground#3794ff
- textLink.foreground#3794ff
- textPreformat.foreground#718ca1
- textSeparator.foreground#718ca1
- titleBar.activeBackground#1d252c
- titleBar.activeForeground#cccccc
- titleBar.border#00000000
- titleBar.inactiveBackground#272c30
- titleBar.inactiveForeground#cccccc99
- tree.indentGuidesStroke#585858
- walkThrough.embeddedEditorBackground#00000050
- widget.shadow#00000026
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #707070 | — |
| keyword.operator,keyword.operator.logical,keyword.operator.relational,keyword.operator.assignment,keyword.operator.comparison,keyword.operator.ternary,keyword.operator.arithmetic,keyword.operator.spread | #CCCCCC | — |
| string,string.character.escape,string.template.quoted,string.template.quoted.punctuation,string.template.quoted.punctuation.single,string.template.quoted.punctuation.double,string.type.declaration.annotation,string.template.quoted.punctuation.tag | #6A8759 | — |
| punctuation.definition.template-expression.begin,punctuation.definition.template-expression.end | #CC8242 | — |
| expression.string,meta.template.expression | #CCCCCC | — |
| constant.numeric | #7A9EC2 | — |
| constant.language,variable.language | #CC8242 | — |
| constant.character, constant.other | #9E7BB0 | — |
| keyword,keyword.operator.new,keyword.operator.delete,keyword.operator.static,keyword.operator.this,keyword.operator.expression | #CC8242 | — |
| entity.name.type,meta.return.type,meta.type.annotation,meta.type.parameters,support.type.primitive | #7A9EC2 | — |
| storage,storage.type,storage.modifier,storage.arrow | #CC8242 | — |
| class.instance.constructor,new.expr entity.name.type | #FFC66D | — |
| support.function, entity.name.function | #FFC66D | — |
| annotation.meta.ts, annotation.meta.tsx | #CCCCCC | — |
| variable.parameter, operator.rest.parameters | #CCCCCC | — |
| variable.property,variable.other.property,variable.other.object.property,variable.object.property,support.variable.property | #9E7BB0 | — |
| quote.module | #6A8759 | — |
| markup.heading | #CC8242 | — |
| punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end, entity.name.tag | #FFC66D | — |
| entity.other.attribute-name | #CCCCCC | — |
| meta.object-literal.key | #9E7BB0 | — |
| storage.modifier.ts | #CC8242 | — |
| ts.cast.expr,ts.meta.entity.class.method.new.expr.cast,ts.meta.entity.type.name.new.expr.cast,ts.meta.entity.type.name.var-single-variable.annotation,tsx.cast.expr,tsx.meta.entity.class.method.new.expr.cast,tsx.meta.entity.type.name.new.expr.cast,tsx.meta.entity.type.name.var-single-variable.annotation | #7A9EC2 | — |
| ts.meta.type.support,ts.meta.type.entity.name,ts.meta.class.inherited-class,tsx.meta.type.support,tsx.meta.type.entity.name,tsx.meta.class.inherited-class,type-declaration,enum-declaration | #7A9EC2 | — |
| function-declaration,method-declaration,method-overload-declaration,type-fn-type-parameters | #FFC66D | — |
| comment.block.documentation | #6A8759 | — |
| storage.type.class.jsdoc | #CC8242 | — |
| constant.language.import-export-all | #CCCCCC | — |
| objectliteral.key.separator, punctuation.separator.key-value | #CCCCCC | — |
| regex | — | italic |
| ts.meta.entity.name.namespace,tsx.meta.entity.name.namespace | #CCCCCC | — |
| regex.character-class | #CCCCCC | — |
| entity.name.type.class | #CCCCCC | — |
| entity.other.inherited-class | #7A9EC2 | — |
| entity.name.type.instance.jsdoc | #FFC66D | — |
| yaml.entity.name,yaml.string.entity.name | #CC8242 | — |
| yaml.string.out | #CCCCCC | — |
| meta.brace.square.ts,block.support.module,block.support.type.module,block.support.function.variable,punctuation.definition.typeparameters.begin,punctuation.definition.typeparameters.end | #CCCCCC | — |
| string.regexp | #CC8242 | — |
| punctuation.definition.group.regexp,punctuation.definition.character-class.regexp | #FFC66D | — |
| constant.other.character-class.regexp, constant.character.escape.ts | #CCCCCC | — |
| expr.regex.or.operator | #CCCCCC | — |
| string.template.tag,string.template.punctuation.tag,string.quoted.punctuation.tag,string.quoted.embedded.tag, string.quoted.double.tag | #6A8759 | — |
| tag.punctuation.begin.arrow.parameters.embedded,tag.punctuation.end.arrow.parameters.embedded | #CCCCCC | — |
| object-literal.object.member.key.field.other,object-literal.object.member.key.accessor,object-literal.object.member.key.array.brace.square | #CCCCCC | — |
| property-list.property-value,property-list.constant | #A5C261 | — |
| support.type.property-name.variable.css,support.type.property-name.variable.scss,variable.scss | #7A9EC2 | — |
| entity.other.attribute-name.class.css,entity.other.attribute-name.class.scss,entity.other.attribute-name.parent-selector-suffix.css,entity.other.attribute-name.parent-selector-suffix.scss | #FFC66D | — |
| property-list.property-value.rgb-value, keyword.other.unit.css,keyword.other.unit.scss | #7A9EC2 | — |
| property-list.property-value.function | #FFC66D | — |
| support.constant.property-value.css,support.constant.property-value.scss | #A5C261 | — |
| css.entity.name.tag,scss.entity.name.tag | #CC8242 | — |
| meta.selector.css, entity.attribute-name.id, entity.other.attribute-name.pseudo-class.css,entity.other.attribute-name.pseudo-element.css | #FFC66D | — |
| keyword.scss,keyword.css | #CC8242 | — |
| triple-slash.tag | #CCCCCC | italic |
| token.info-token | #6796E6 | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B267E6 | — |
| keyword.operator.logical.python | #CC8242 | — |
| support.class.dart | #CC8242 | — |
| variable.language.php, variable.other.php | #9E7BB0 | — |
| variable.other.readwrite.perl | #9E7BB0 | — |
| variable.other.property.php | #CC8242 | — |
| support.variable.property.php | #FFC66D | — |
| comment | #808080 | italic |
| keyword | #F0F0F0 | — |
| keyword.control.ternary.java | #F0F0F0 | — |
| string,string.character.escape,string.template.quoted,string.template.quoted.punctuation,string.template.quoted.punctuation.single,string.template.quoted.punctuation.double,string.type.declaration.annotation,string.template.quoted.punctuation.tag | #6EA859 | — |
| punctuation.definition.annotation | #C4BA08 | — |
| storage.type.annotation.java | #C4BA08 | — |
| punctuation.definition.template-expression.begin,punctuation.definition.template-expression.end | #6EA859 | — |
| expression.string,meta.template.expression | #6EA859 | — |
| constant.numeric | #7EA9D4 | — |
| constant.language,variable.language | #7EA9D4 | — |
| constant.character, constant.other | #7EA9D4 | — |
| keyword,keyword.operator.new,keyword.operator.delete,keywordDE873C.operator.static,keyword.operator.this,keyword.operator.expression | #DE873C | — |
| entity.name.type,meta.return.type,meta.type.annotation,meta.type.parameters,support.type.primitive | #F0F0F0 | — |
| variable.language | #DE873C | — |
| constant.language | #DE873C | — |
| constant.other.caps.python | #A88AB6 | — |
| storage.modifier | #DE873C | — |
| storage.modifier.reference.cpp | #F5F5F5 | — |
| entity.name.scope-resolution.function.call.cpp, entity.name.scope-resolution.function.definition.cpp, entity.name.scope-resolution.cpp | #F0F0F0 | — |
| entity.name.type.cpp | #A88AB6 | — |
| storage.modifier.pointer, storage.modifier.reference.cpp, keyword.operator.bitwise, entity.name.function.definition.cpp | #EDC881 | — |
| string.regexp.quoted, constant.character.escape | #6EA859 | — |
| keyword.other.unit.suffix | #7A9EC2 | — |
| meta.format.percent.python | #7A9EC2 | — |
| storage.type | #A88AB6 | — |
| storage.type.function.arrow | #A88AB6 | — |
| storage.type.function.python | #DE873C | — |
| constant.character.format.placeholder.other.python | #7EA9D4 | — |
| class.instance.constructor,new.expr entity.name.type | #DE873C | — |
| support.function, entity.name.function | #F0F0F0 | — |
| annotation.meta.ts, annotation.meta.tsx | #F0F0F0 | — |
| variable.parameter, operator.rest.parameters | #F0F0F0 | — |
| variable.property,variable.other.property,variable.other.object.property,variable.object.property,support.variable.property | #F0F0F0 | — |
| storage.modifier.package.java,meta.package.java | #EDC881 | — |
| punctuation.terminator,punctuation.separator,punctuation.separator.continuation,punctuation.accessor | #F0F0F0 | — |
| storage.modifier.import.java | #F0F0F0 | — |
| quote.module | #6A8759 | — |
| markup.heading | #DE873C | — |
| punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end, entity.name.tag | #DE873C | — |
| entity.other.attribute-name | #CCCCCC | — |
| meta.object-literal.key | #A88AB6 | — |
| storage.modifier.ts | #DE873C | — |
| ts.cast.expr,ts.meta.entity.class.method.new.expr.cast,ts.meta.entity.type.name.new.expr.cast,ts.meta.entity.type.name.var-single-variable.annotation,tsx.cast.expr,tsx.meta.entity.class.method.new.expr.cast,tsx.meta.entity.type.name.new.expr.cast,tsx.meta.entity.type.name.var-single-variable.annotation | #7A9EC2 | — |
| ts.meta.type.support,ts.meta.type.entity.name,ts.meta.class.inherited-class,tsx.meta.type.support,tsx.meta.type.entity.name,tsx.meta.class.inherited-class,type-declaration,enum-declaration | #7A9EC2 | — |
| function-declaration,method-declaration,methoCC8242d-overload-declaration,type-fn-type-parameters | #DE873C | — |
| comment.block.documentation | #6A8759 | — |
| storage.type.class.jsdoc | #DE873C | — |
| constant.language.import-export-all | #CCCCCC | — |
| objectliteral.key.separator, punctuation.separator.key-value | #CCCCCC | — |
| regex | — | italic |
| ts.meta.entity.name.namespace,tsx.meta.entity.name.namespace | #CCCCCC | — |
| regex.character-class | #CCCCCC | — |
| entity.name.type.class | #CCCCCC | — |
| entity.other.inherited-class, | #F0F0F0 | — |
| entity.name.namespace | #F0F0F0 | — |
| entity.name.type.instance.jsdoc | #DE873C | — |
| yaml.entity.name,yaml.string.entity.name | #DE873C | — |
| yaml.string.out | #CCCCCC | — |
| meta.brace.square.ts,block.support.module,block.support.type.module,block.support.function.variable,punctuation.definition.typeparameters.begin,punctuation.definition.typeparameters.end | #CCCCCC | — |
| string.regexp | #DE873C | — |
| punctuation.definition.group.regexp,punctuation.definition.character-class.regexp | #DE873C | — |
| constant.other.character-class.regexp, constant.character.escape.ts | #CCCCCC | — |
| expr.regex.or.operator | #CCCCCC | — |
| string.template.tag,string.template.punctuation.tag,string.quoted.punctuation.tag,string.quoted.embedded.tag, string.quoted.double.tag | #6A8759 | — |
| tag.punctuation.begin.arrow.parameters.embedded,tag.punctuation.end.arrow.parameters.embedded | #CCCCCC | — |
| object-literal.object.member.key.field.other,object-literal.object.member.key.accessor,object-literal.object.member.key.array.brace.square | #CCCCCC | — |
| variable.other.makefile | #A88AB6 | — |
| keyword.other.unit.px.css | #A88AB6 | — |
| keyword.other.unit.percentage.css | #A88AB6 | — |
| property-list.property-value,property-list.constant | #EDC881 | — |
| support.type.property-name.variable.css,support.type.property-name.variable.scss,variable.scss | #7A9EC2 | — |
| entity.other.attribute-name.class.css,entity.other.attribute-name.class.scss,entity.other.attribute-name.parent-selector-suffix.css,entity.other.attribute-name.parent-selector-suffix.scss | #DE873C | — |
| property-list.property-value.rgb-value, keyword.other.unit.css,keyword.other.unit.scss | #7A9EC2 | — |
| property-list.property-value.function | #DE873C | — |
| support.constant.property-value.css,support.constant.property-value.scss | #EDC881 | — |
| css.entity.name.tag,scss.entity.name.tag | #DE873C | — |
| meta.selector.css, entity.attribute-name.id, entity.other.attribute-name.pseudo-class.css,entity.other.attribute-name.pseudo-element.css | #DE873C | — |
| keyword.scss,keyword.css | #DE873C | — |
| triple-slash.tag | #CCCCCC | italic |
| token.info-token | #6796E6 | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B267E6 | — |
| keyword.operator.logical.python | #DE873C | — |
| support.class.dart | #DE873C | — |
| variable.language.php, variable.other.php | #A88AB6 | — |
| variable.other.readwrite.perl | #A88AB6 | — |
| support.variable.property.php | #DE873C | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...