Late Night Mocha i
Publisher: ChookithThemes in package: 1
Themes for the late night coders
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#7d634f
- activityBar.background#3a271c
- activityBar.foreground#e0d3c9
- badge.background#b8aa9f
- badge.foreground#4d3a2b
- banner.background#3a271c
- banner.foreground#e0d3c9
- banner.iconForeground#e0d3c9
- breadcrumb.foreground#e0d3c9
- button.background#6f5541
- button.secondaryBackground#9b6f4f
- checkbox.background#e0d3c9
- checkbox.foreground#6f5541
- debugConsole.errorForeground#b29278
- debugToolBar.background#3a271c
- dropdown.background#6f5541
- dropdown.foreground#e0d3c9
- dropdown.listBackground#6f5541
- editor.background#4d3a2b
- editor.foreground#e0d3c9
- editor.hoverHighlightBackground#d1b28a96
- editor.lineHighlightBackground#664d3ae5
- editor.lineHighlightBorder#4d3a2bd7
- editor.selectionBackground#d1b28a98
- editor.selectionHighlightBackground#d1b28a3d
- editor.wordHighlightBackground#9b6f4f8f
- editorBracketHighlight.foreground1#e5ba85
- editorBracketHighlight.foreground2#94654c
- editorBracketHighlight.foreground3#94654c
- editorBracketHighlight.foreground4#e5ba85
- editorBracketHighlight.foreground5#d2a44b
- editorBracketHighlight.foreground6#d2a44b
- editorBracketHighlight.unexpectedBracket.foreground#748ba8
- editorBracketMatch.background#a89b8965
- editorBracketMatch.border#806a4d91
- editorCodeLens.foreground#d1ba9c
- editorGroup.dropBackground#d0beab56
- editorGroupHeader.noTabsBackground#d0beab56
- editorGroupHeader.tabsBackground#7d634f
- editorHoverWidget.highlightForeground#DCBE94
- editorLineNumber.activeForeground#e0d3c9
- editorLineNumber.foreground#d1ba9c91
- editorLink.activeForeground#d1ba9c
- editorSuggestWidget.foreground#e0d3c9
- editorSuggestWidget.highlightForeground#e5ba85
- editorWhitespace.foreground#d1ba9c91
- editorWidget.background#61462b
- icon.foreground#e0d3c9
- input.background#4d3a2b
- input.border#4d3a2b
- input.foreground#e0d3c9
- input.placeholderForeground#8c7767
- inputOption.activeBackground#6f5541
- inputOption.activeBorder#4e3b2e
- inputOption.activeForeground#e0d3c9
- inputOption.hoverBackground#4d3a2b
- list.activeSelectionBackground#d0beab80
- list.activeSelectionForeground#3a271c
- list.activeSelectionIconForeground#3a271c
- list.dropBackground#d0beab80
- list.focusBackground#d0beab80
- list.focusForeground#e0d3c9
- list.focusOutline#d0beab80
- list.highlightForeground#3a271c
- list.hoverBackground#d0beab80
- list.hoverForeground#3a271c
- list.inactiveFocusBackground#4e3d33
- list.inactiveFocusOutline#4e3d33
- list.inactiveSelectionBackground#4e3d33
- list.inactiveSelectionForeground#d0beab80
- menu.background#6f5541
- menu.foreground#e0d3c9
- menu.selectionBackground#7d634f
- menu.selectionForeground#e0d3c9
- merge.commonContentBackground#c4dce2ab
- merge.currentContentBackground#748ba89f
- merge.incomingContentBackground#6d7f959c
- notificationCenterHeader.background#3a271c
- notificationCenterHeader.foreground#e0d3c9
- notificationLink.foreground#e0d3c9
- notifications.background#3a271c
- notifications.foreground#e0d3c9
- progressBar.background#e0d3c9
- scrollbar.shadow#3a271c
- scrollbarSlider.activeBackground#e0d3c996
- scrollbarSlider.background#d1ba9c91
- scrollbarSlider.hoverBackground#d1ba9c91
- searchEditor.findMatchBackground#d1b28a98
- sideBar.background#3a271c
- sideBar.foreground#e0d3c9
- statusBar.background#4d3a2b
- statusBar.debuggingBackground#7d634f
- statusBar.foreground#e0d3c9
- statusBar.noFolderBackground#4d3a2b
- statusBarItem.activeBackground#a46c48
- statusBarItem.errorBackground#646c70
- statusBarItem.hoverBackground#d0beab56
- tab.activeForeground#e0d3c9
- tab.inactiveBackground#5b4638
- tab.inactiveForeground#e0d3c9
- terminal.ansiBrightYellow#e7ca74
- terminal.ansiCyan#E5BA85
- terminal.foreground#e0d3c9
- titleBar.activeBackground#4d3a2b
- titleBar.activeForeground#e0d3c9
- toolbar.activeBackground#6f5541
- toolbar.hoverBackground#6f5541
- welcomePage.background#4d3a2b
- welcomePage.progress.background#7d634f
- welcomePage.progress.foreground#e0d3c9
- welcomePage.tileBackground#4d3a2b
- welcomePage.tileHoverBackground#e0d3c9
- widget.shadow#4e2c17
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| keyword.control.at-rule.tailwind.tailwind, keyword.control.import.js, keyword.control.as.js, keyword.control.from.js, keyword.control.import.ts, keyword.control.as.ts, keyword.control.from.ts, keyword.control.import.tsx, keyword.control.as.tsx, keyword.control.from.tsx, keyword.control.import.python, keyword.control.directive.include.c, keyword.other.using.directive.cpp, keyword.control.directive.include.cpp, keyword.other.directive.using.cs | #e6d5a2 | — |
| punctuation.separator.key-value, punctuation.terminator.rule.css, punctuation.definition.entity.css, punctuation.separator.list.comma.css, punctuation.accessor.js, punctuation.terminator.statement.js, keyword.operator.assignment.js, punctuation.separator.comma.js, keyword.operator.type.annotation.ts, keyword.operator.type.ts, keyword.operator.assignment.ts, punctuation.accessor.ts, punctuation.separator.comma.ts, punctuation.terminator.statement.ts, keyword.operator.assignment.ts, keyword.operator.assignment.tsx, keyword.operator.type.annotation.tsx, punctuation.terminator.statement.tsx, punctuation.accessor.tsx, punctuation.separator.comma.tsx, punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json, punctuation.separator.array.json, punctuation.section.function.begin.python, punctuation.section.class.begin.python, punctuation.separator.colon.python, punctuation.separator.annotation.python, punctuation.separator.period.python, keyword.operator.assignment.python, punctuation.separator.parameters.python, punctuation.separator.element.python, punctuation.separator.method.ruby, punctuation.separator.object.ruby, keyword.operator.assignment.ruby, punctuation.definition.constant.ruby, punctuation.separator.arguments.ruby, punctuation.separator.statement.ruby, punctuation.separator.variable.ruby, punctuation.separator.delimiter.c, punctuation.terminator.statement.c, keyword.operator.assignment.c, punctuation.separator.dot-access.c, punctuation.separator.colon.case.c, punctuation.terminator.statement.cpp, punctuation.separator.dot-access.cpp, punctuation.separator.label.cpp, keyword.operator.assignment.cpp, punctuation.separator.colon.access.control.cpp, punctuation.separator.colon.case.default.cpp, punctuation.separator.colon.case.cpp, punctuation.separator.colon.cs, punctuation.terminator.statement.cs, punctuation.accessor.cs, keyword.operator.assignment.cs, punctuation.separator.comma.cs, keyword.other.DML.sql, keyword.operator.assignment.scad, punctuation.terminator.statement.scad, keyword.operator.conditional.scad, meta.delimiter.object.comma.scad | #e4a561 | — |
| constant.language.boolean.true.js, constant.language.boolean.true.ts, constant.language.boolean.true.tsx, constant.language.true.cpp, constant.language.boolean.true.cs, constant.language.boolean.true.scad | #c6c992 | bold |
| constant.language.boolean.false.js, constant.language.boolean.false.ts, constant.language.boolean.false.tsx, constant.language.false.cpp, constant.language.boolean.false.cs | #8d99af | bold |
| constant.language.null.js, constant.language.null.ts, constant.language.null.tsx, constant.language.python, constant.language.ruby, constant.language.nil.ruby, constant.language.boolean.ruby, constant.language.c, constant.language.NULL.cpp, constant.language.null.cs | #e99d3b | bold |
| storage.type.class.js, storage.type.class.ts, storage.type.class.tsx, storage.type.class.python, keyword.control.class.ruby, storage.type.class.cpp, storage.type.class.cs | #b48c69 | bold |
| entity.name.type.class.js, entity.name.type.class.ts, entity.name.type.class.tsx, entity.name.type.class.python, entity.name.type.class.ruby, entity.name.type.class.cpp, entity.name.type.class.cs | #ffdfa7 | italic bold |
| storage.modifier.ts, keyword.control.export.ts, storage.modifier.tsx, keyword.control.export.tsx, keyword.control.export.js.jsx, storage.type.function.lambda.python, storage.modifier.declaration.python, punctuation.definition.variable.ruby, storage.type.modifier.access.control.public.cpp, storage.modifier.public.cs, storage.modifier.private.cs, storage.modifier.protected.cs | #DDB16E | italic |
| entity.other.attribute-name.class, entity.name.tag.css, storage.type.function.js, storage.type.function.arrow.js, storage.type.function.ts, storage.type.function.arrow.ts, storage.type.function.tsx, storage.type.function.arrow.tsx, storage.type.function.python, keyword.control.def.ruby, punctuation.separator.pointer-access.c, keyword.operator.arrow.cs | #C09E81 | italic |
| entity.name.function.js, entity.name.function.ts, entity.name.function.tsx, entity.name.function.python, entity.name.function.decorator.python, meta.function-call.generic.python, entity.name.function.ruby, entity.name.function.c, entity.name.function.definition.cpp, entity.name.function.cs, entity.name.function.call.scad | #e5ba85 | italic bold |
| keyword.operator.new.js, variable.language.this.js, variable.language.this.ts, keyword.operator.new.ts, keyword.other.special-method.ruby, keyword.operator.new.cpp, variable.language.this.cpp, keyword.operator.expression.new.cs, variable.language.this.cs | #eecb95 | italic bold |
| variable.parameter.js, variable.parameter.tsx, variable.parameter.function.language.python, entity.other.inherited-class.python, meta.function-call.arguments.python, variable.parameter.function.ruby, meta.function-call.ruby, meta.function.definition.parameters.c, entity.name.type.parameter.cpp, entity.name.variable.parameter.cs, meta.function-call.arguments.scad | #eed8bc | italic bold |
| storage.modifier.async.ts, storage.modifier.async.js.jsx, storage.type.function.async.python, keyword.other.async.cs, keyword.other.await.cs | #EBDFC7 | bold |
| storage.type.js, storage.type.ts, storage.type.tsx, storage.type.built-in.primitive.c, keyword.control.directive.define.c, storage.type.built-in.primitive.cpp, storage.type.namespace.directive.cpp, keyword.type.void.cs, keyword.type.int.cs, keyword.type.string.cs, keyword.type.bool.cs, storage.type.var.cs, entity.name.type.cs, storage.type.namespace.cs | #d29b6a | italic bold |
| meta.attribute.lang.html, meta.attribute.charset.html, meta.attribute.content.html, meta.attribute.http-equiv.html, meta.attribute.name.html, meta.attribute.content.html, meta.attribute.href.html, meta.attribute.rel.html, meta.attribute.type.html, meta.attribute.wrap.html, meta.attribute.cols.html, meta.attribute.rows.html, meta.attribute.id.html, meta.attribute.placeholder.html, meta.attribute.lang.html, meta.attribute.charset.html, meta.attribute.content.html, meta.attribute.http-equiv.html, meta.attribute.name.html, meta.attribute.content.html, meta.attribute.href.html, meta.attribute.rel.html, meta.attribute.type.html, meta.attribute.wrap.html, meta.attribute.cols.html , meta.attribute.rows.html, meta.attribute.id.html, meta.attribute.placeholder.html, meta.tag.structure.input.void.html, string.quoted.double.css, string.quoted.double.js, entity.other.attribute-name.js, string.quoted.double.ts, string.quoted.double.tsx, string.quoted.double.ruby, string.quoted.double.interpolated.ruby, string.quoted.double.c, string.quoted.double.cpp, string.quoted.double.cs, keyword.other.sql, string.quoted.double.sql | #C6AC9C | bold |
| string.quoted.single.js, string.quoted.single.python, string.quoted.single.ruby, string.quoted.single.ts, string.quoted.single.tsx, string.quoted.single.c, storage.type.namespace.directive.cpp, string.quoted.single.cs, string.quoted.single.sql | #C6AC9C | italic |
| string.template.js, invalid.deprecated.backtick.python, string.interpolated.ruby, string.quoted.other.backtick.sql | #c58f1c | italic bold |
| meta.attribute.for.html, entity.name.tag.in.css, entity.name.tag.to.css, keyword.control.conditional.js, keyword.control.loop.js, keyword.control.flow.python, keyword.control.ruby, keyword.control.start-block.ruby, keyword.control.conditional.ts, keyword.control.loop.ts, keyword.control.conditional.tsx, keyword.control.loop.tsx, keyword.control.c, keyword.control.case.c, keyword.control.switch.c, keyword.control.if.cpp, keyword.control.else.cpp, keyword.control.for.cpp, keyword.control.while.cpp, keyword.control.do.cpp, keyword.control.switch.cpp, keyword.control.case.cpp, keyword.control.default.cpp, keyword.control.try.cpp, keyword.control.catch.cpp, keyword.control.conditional.if.cs, keyword.control.conditional.else.cs, keyword.control.loop.foreach.cs, keyword.control.loop.for.cs, keyword.control.loop.in.cs | #c09e81 | italic bold |
| keyword.control.flow.js, keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.pseudo-method.ruby, keyword.control.return.cpp, keyword.control.break.cpp, keyword.control.continue.cpp, keyword.control.throw.cpp, keyword.control.flow.return.cs, keyword.control.flow.break.cs, keyword.control.flow.continue.cs | #ebdfc7 | italic bold |
| constant.numeric.decimal.js, constant.numeric.decimal.ts, constant.numeric.decimal.tsx, constant.numeric.dec.python, constant.numeric.integer.ruby, constant.numeric.ruby, constant.numeric.decimal.c, constant.numeric.decimal.cpp, constant.numeric.decimal.cs, constant.numeric.sql, constant.numeric.integer.decimal.scad, constant.numeric.float.scad | #dbbb8b | bold |
| constant.numeric.css | #f7e4c0 | — |
| entity.name.tag.body.css, entity.name.tag.li.css, entity.name.tag.a.css, entity.name.tag.header.css, entity.name.tag.h1.css, entity.name.tag.h2.css, entity.name.tag.h3.css, entity.name.tag.p.css | #f9dba3 | italic bold |
| constant.other.color.rgb-value.hex.css | #cfa378 | italic |
| keyword.operator.assignment.compound.js, keyword.operator.assignment.compound.js, keyword.operator.arithmetic.js, keyword.operator.increment.ts, keyword.operator.decrement.ts, keyword.operator.assignment.compound.ts, keyword.operator.arithmetic.ts, keyword.operator.increment.tsx, keyword.operator.decrement.tsx, keyword.operator.assignment.compound.tsx, keyword.operator.arithmetic.tsx, keyword.operator.arithmetic.python, keyword.operator.assignment.augmented.ruby, keyword.operator.arithmetic.ruby, keyword.operator.assignment.compound.c, keyword.operator.c, keyword.operator.increment.c, keyword.operator.increment.cpp, keyword.operator.decrement.cpp, keyword.operator.arithmetic.cpp, keyword.operator.assignment.compound.cpp, keyword.operator.assignment.compound.cs, keyword.operator.increment.cs, keyword.operator.decrement.cs, keyword.operator.arithmetic.cs | #e9ce93 | italic bold |
| keyword.operator.logical.js, keyword.operator.relational.js, keyword.operator.comparison.js, keyword.operator.comparison.ts, keyword.operator.relational.ts, keyword.operator.logical.ts, keyword.operator.comparison.tsx, keyword.operator.relational.tsx, keyword.operator.logical.tsx, keyword.operator.comparison.python, keyword.operator.logical.python, keyword.operator.comparison.ruby, keyword.operator.logical.ruby, keyword.operator.comparison.c, keyword.operator.relational.c, keyword.operator.logical.c, keyword.operator.comparison.cpp, keyword.operator.logical.cpp, keyword.operator.relational.cpp, keyword.operator.comparison.cs, keyword.operator.relational.cs, keyword.operator.logical.cs, keyword.operator.comparison.sql | #C09E81 | bold |
| keyword.operator.bitwise.js, keyword.operator.bitwise.ts, keyword.operator.bitwise.shift.ts, keyword.operator.bitwise.tsx, keyword.operator.bitwise.shift.tsx, keyword.operator.bitwise.python, keyword.operator.other.ruby, keyword.operator.bitwise.shift.c, keyword.operator.bitwise.cpp, keyword.operator.bitwise.shift.cpp, keyword.operator.bitwise.cs | #b87d25 | bold |
| meta.object-literal.key.ts, variable.object.property.ts, meta.definition.variable.ts, support.type.property-name.json, constant.other.symbol.hashkey.ruby, constant.language.symbol.hashkey.ruby | #b29278 | italic bold |
| comment.block.html, comment.block.css, comment.line.double-slash.js, comment.block.js, punctuation.definition.comment.ts, comment.block.ts, punctuation.definition.comment.tsx, comment.line.double-slash.tsx, comment.block.tsx, comment.line.double-slash.js, punctuation.definition.comment.json.comments, comment.line.number-sign.python, string.quoted.docstring.multi.python, comment.line.number-sign.ruby, comment.line.double-slash.c, comment.block.c, comment.line.double-slash.cpp, comment.block.cpp, comment.line.double-slash.cs, entity.name.tag.localname.cs, comment.block.documentation.cs, comment.line.double-slash.scad | #99755acb | italic |
| entity.name.tag.html, punctuation.definition.tag.begin.html, meta.tag.metadata.style.end.html, punctuation.definition.tag.end.html, punctuation.definition.tag.begin.js, entity.name.tag.js, punctuation.definition.tag.end.js, entity.name.tag.tsx, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.definition.tag.begin.js.jsx, entity.name.tag.js.jsx, punctuation.definition.tag.end.js.jsx | #e5ba85 | italic bold |
| text.html.derivative, text.html, meta.jsx.children.tsx, meta.jsx.children.js.jsx, meta.jsx.children.js | #F7E4C0 | italic bold |
| text.html.markdown | #e0d3c9 | |
| meta.attribute.class.html | #c7a28c | italic bold |
| meta.property-value.css | #a27b5b | — |
| entity.other.attribute-name.pseudo-element.css | #c6ac9c | italic bold |
| keyword.control.trycatch.js | #B29278 | italic bold |
| meta.object-literal.key.js | #B29278 | italic bold |
| keyword.operator.expression.typeof.js | #B29278 | italic bold |
| entity.other.ng-binding-name.formGroup.html, entity.other.ng-binding-name.submit.html | #cfa983 | italic |
| keyword.operator.assignment.ts, meta.definition.property.ts | #e0d3c9 | |
| punctuation.definition.block.ts | #e5ba85 | bold |
| punctuation.definition.block.ts | #e5ba85 | bold |
| variable.object.property.tsx | #B29278 | italic bold |
| storage.modifier.async.tsx | #EBDFC7 | italic bold |
| punctuation.definition.template-expression.begin.tsx, punctuation.definition.template-expression.end.tsx | #94654c | italic bold |
| meta.embedded.line.tsx, meta.embedded.line.ruby | #F7E4C0 | italic |
| meta.tag.attributes.tsx | #C7A28C | — |
| entity.other.attribute-name.html, entity.other.attribute-name.tsx, entity.other.attribute-name.js.jsx | #C09365 | — |
| #E5BA85 | italic bold | |
| entity.name.function.decorator.python | #dcbe94 | italic bold |
| support.function.magic.python | #fccd4e | — |
| support.function.builtin.python, support.function.kernel.ruby | #d6b485 | italic bold |
| string.quoted.other.lt-gt.include.c | #ebc29c | bold |
| constant.other.placeholder.c | #e6bd92 | bold |
| punctuation.definition.typeparameters.begin.cs, punctuation.definition.typeparameters.end.cs, string.quoted.other.lt-gt.include.cpp | #eed8bb | bold |
| heading.1.markdown | #e5ba85 | italic bold |
| heading.2.markdown | #b29278 | italic bold |
| heading.3.markdown | #a67f62 | italic bold |
| markup.underline.link.image.markdown, markup.quote.markdown | #E0BF81 | — |
| markup.list.numbered.markdown, punctuation.definition.list.begin.markdown | #E0D3C9 | — |
| meta.function.scad | #a6805f | italic bold |
| support.function.scad | #cbb6a3 | italic |