ThemeDatabase All Themes
Publisher: enes ozturkThemes in package: 21943
One theme database to rule them all. All 22,037 ThemeDatabase themes in one VSIX package.
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#141820
- activityBarBadge.background#4B76CF
- activityBarBadge.foreground#ffffff
- diffEditor.insertedTextBackground#66f0c213
- dropdown.background#141820
- editor.background#212836
- editor.foreground#ced6e6
- editor.lineHighlightBackground#99bbff0a
- editor.selectionBackground#e6eeff21
- editor.wordHighlightBackground#343F56
- editorCursor.foreground#fff
- editorGroup.border#1A1F2E
- editorGroupHeader.tabsBackground#1C212E
- editorGutter.addedBackground#308E68
- editorGutter.modifiedBackground#938464
- editorIndentGuide.background#97a7c826
- editorLineNumber.activeForeground#818ca6
- editorLineNumber.foreground#3D4D67
- editorSuggestWidget.background#141820
- editorWhitespace.foreground#3b3a32
- editorWidget.background#141820
- foreground#818CA6
- gitDecoration.ignoredResourceForeground#3D4D67
- gitDecoration.modifiedResourceForeground#E3C18A
- gitDecoration.untrackedResourceForeground#70CA8E
- input.background#141820
- input.border#1A1F2E
- input.foreground#818CA6
- input.placeholderForeground#3D4D67
- list.activeSelectionBackground#4B76CF
- list.activeSelectionForeground#ffffff
- list.focusBackground#3D4D67
- list.hoverBackground#141820
- list.inactiveSelectionBackground#303B50
- list.inactiveSelectionForeground#D5D9E2
- panel.background#1C212E
- panel.border#1A1F2E
- pickerGroup.foreground#FFE792
- scrollbar.shadow#11141a11
- scrollbarSlider.activeBackground#ffffff22
- scrollbarSlider.background#ffffff11
- scrollbarSlider.hoverBackground#ffffff22
- sideBar.background#1C212E
- sideBarSectionHeader.background#141820
- sideBarTitle.foreground#fff
- statusBar.background#212836
- statusBar.border#1A1F2E
- statusBar.foreground#818CA6
- statusBar.noFolderBackground#212836
- tab.activeBackground#212836
- tab.activeBorder#fff
- tab.border#1C212E
- tab.inactiveBackground#212836
- tab.inactiveForeground#818CA6
- tab.unfocusedInactiveForeground#818CA6
- terminal.background#1C212E
- titleBar.activeBackground#1C212E
- titleBar.activeForeground#818CA6
- titleBar.inactiveBackground#1C212E
- titleBar.inactiveForeground#818CA6
- widget.shadow#11141ab3
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| Global settings | #97a7c8ff | — |
| comment | #667fa3 | — |
| string, meta.object-literal.key.tsx | #d9dfeb | — |
| support.variable.dom.js, support.variable.dom.ts | #59f2f7 | — |
| punctuation.separator.key-value | #e5e9f1 | — |
| variable.other.constant.js, variable.other.constant.object.js, variable.other.constant.property.js, variable.other.constant.ts, variable.other.constant.object.ts, variable.other.constant.property.ts | #969eba | — |
| constant.numeric | #58b4ff | — |
| constant.language | #edc1f9 | — |
| constant.character, constant.other | #9485e0 | — |
| variable | #B7C6DA | — |
| keyword | #E95293 | — |
| storage | #FF5BA2 | — |
| storage.type | #a68192 | — |
| storage.type.function.arrow | #a69c14 | — |
| entity.name.class | #82C600 | — |
| entity.other.inherited-class | #e2c6a5 | — |
| variable.parameter | #fac0f1 | — |
| entity.name.tag | #bdf5de | — |
| string.quoted.double.json, | #CFCDB8 | — |
| entity.other.attribute-name.class.css, keyword.other.unit.px.css, | #748CAB | — |
| entity.other.attribute-name.html | #CFCDB8 | — |
| entity.other.attribute-name.js, entity.other.attribute-name.ts | #efc79de0 | — |
| entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element | #efc79de0 | — |
| meta.tag.other, entity.name.tag.style, entity.name.tag.script, meta.tag.block.script, source.js.embedded punctuation.definition.tag.html, source.ts.embedded punctuation.definition.tag.html, source.css.embedded punctuation.definition.tag.html | #E26674 | — |
| punctuation.definition.template-expression.begin.js, punctuation.definition.template-expression.begin.ts | #e9a9e4e8 | — |
| variable.language.this.js, variable.language.this.ts, | #eab780 | — |
| variable.argument | #e36085 | — |
| entity.other.attribute-name.id.css | #e87d9b | — |
| entity.name.function.js, entity.name.function.ts, entity.name.function.method.js, entity.name.function.method.ts, entity.name.accessor.js, entity.name.accessor.ts, entity.name.class.js, entity.name.class.ts, entity.name.function.tsx, entity.name.function.method.tsx, entity.name.accessor.tsx, entity.name.class.tsx | #b3bbc9 | — |
| support.class.builtin.js, entity.name.type.class.js, support.class.builtin.ts, entity.name.type.class.ts | #adaefc | — |
| variable.parameter.js, constant.other.object.key.js, variable.other.readwrite.js, punctuation.definition.parameters.begin.js, punctuation.definition.parameters.end.js, meta.object-literal.key.js, meta.array.literal.js, meta.brace.round.js, punctuation.definition.block.js, meta.objectliteral.js, variable.parameter.ts, constant.other.object.key.ts, variable.other.readwrite.ts, punctuation.definition.parameters.begin.ts, punctuation.definition.parameters.end.ts, meta.object-literal.key.ts, meta.array.literal.ts, meta.brace.round.ts, punctuation.definition.block.ts, meta.objectliteral.ts | #79B6C1 | — |
| variable.parameter.js, variable.parameter.ts | #ffc078 | — |
| variable.parameter.js, constant.other.object.key.js, variable.other.readwrite.js, punctuation.definition.parameters.begin.js, punctuation.definition.parameters.end.js, meta.array.literal.js, meta.brace.round.js, punctuation.definition.block.js, meta.objectliteral.js, variable.parameter.ts, constant.other.object.key.ts, variable.other.readwrite.alias.ts, variable.other.readwrite.alias.tsx, punctuation.definition.parameters.begin.ts, punctuation.definition.parameters.end.ts, meta.array.literal.ts, meta.brace.round.ts, meta.objectliteral.ts, variable.other.constant.tsx, variable.other.readwrite.tsx, variable.other.object.tsx | #6dccafc0 | — |
| constant.language.boolean.false.js, constant.language.boolean.true.js, constant.language.boolean.false.ts, constant.language.boolean.true.ts, constant.language.boolean.false.tsx | #eab780 | — |
| support.variable.property.dom.js, entity.name.type.new.js, support.variable.property.dom.ts, entity.name.type.new.ts | #e76572 | — |
| punctuation.definition.tag.html, punctuation.definition.tag.begin, punctuation.definition.tag.end | #C48FB1 | — |
| meta.tag string -source -punctuation, text source text meta.tag string -punctuation | #82BAF2 | — |
| punctuation.section.embedded -(source string source punctuation.section.embedded), meta.brace.erb.html | #D0B344 | — |
| meta.toc-list.id | #88F2AF | — |
| string.quoted.double.html, punctuation.definition.string.begin.html, punctuation.definition.string.end.html, string.quoted.double.handlebars | #79b6c1 | — |
| entity.other.attribute-name.id | #85AC3A | — |
| support.type.property-name.css | #c6ccd8 | — |
| punctuation.section.property-list.begin.bracket.curly.scss | #D9DFEB | — |
| support.type.object.module | #A6588A | — |
| entity.other.attribute-name.id | #F2BCC2 | — |
| meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css | #ffffff | — |
| support.constant.vendored.property-value.css | #f184f1 | — |
| support.function | #C48FB1 | — |
| keyword.operator.new | #f7b2f1 | — |
| keyword.control.from | #e9baf5 | — |
| keyword.other.important | #e9baf5 | — |
| keyword.other.unit | #748CAB | — |
| keyword.control.at-rule.media.scss | #4a83ce | — |
| support.constant.media.css | #e765cb | — |
| keyword.operator.logical.scss | #e4b6da | — |
| keyword.control.operator.css.scss | #9dc3f5 | — |
| entity.name.tag.reference.scss | #9dc3f5 | — |
| entity.name.tag.css | #b7c2cf | — |
| variable.parameter.url.css | #f9f6fc73 | — |
| support.constant | #E76572 | — |
| support.type, support.class, | #93d0e7 | — |
| entity.name.type.module.tsx | #42b0cc | — |
| meta.type.annotation.tsx | #82c8da | — |
| meta.type.parameters.tsx | #afccd3 | — |
| punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array | #d8d8d8 | — |
| none | #d8d8d8 | — |
| keyword.operator | #d0d8e3 | — |
| variable, meta.selector.css | #e7838e | — |
| variable.other.env | #da69b8 | — |
| source.env | #758bb7 | — |
| keyword.operator.assignment. | #D0D8E3 | — |
| keyword.operator.logical | #f2bcc2 | — |
| keyword.control.export | #a6588a | — |
| keyword.control.default | #c48fb1 | — |
| entity.name.function, meta.require, support.function.any-method | #79B6C1 | — |
| support.class, entity.name.class, entity.name.type.class | #E76572 | — |
| support.class.component, meta.tag.without-attributes.js, meta.block.js, meta.function.js, source.js, meta.tag.without-attributes.ts, meta.block.ts, meta.function.ts, source.ts | #5887a6 | — |
| entity.name.tag.js, meta.tag.without-attributes.js, meta.block.js, meta.function.js, source.js, entity.name.tag.ts, meta.tag.without-attributes.ts, meta.block.ts, meta.function.expression.tsx, source.ts, punctuation.definition.tag.begin.tsx, punctuation.definition.tag.end.tsx, punctuation.definition.block.ts, variable.object.property.ts, variable.object.property.tsx, entity.other.attribute-name.tsx | #bfe1e1 | — |
| meta.jsx.children.js, meta.jsx.children.tsx, meta.tsx.children.ts, meta.tsx.children.tsx, | #e7e7e7 | — |
| variable.other.object.property | #748cab | — |
| variable.other.property | #efaeb5 | — |
| meta.class | #f8f8f8 | — |
| keyword.other.special-method | #7cafc2 | — |
| storage | #ba8baf | — |
| constant.numeric | #EAB780 | — |
| constant.numeric.decimal | #e7acff | — |
| none | #dc9656 | — |
| none | #dc9656 | — |
| constant | #dc9656 | — |
| invalid.deprecated | #ffffff | — |
| meta.diff, meta.diff.header | #655c2d | — |
| markup.deleted | #FF5BA2 | — |
| markup.inserted | #82C600 | — |
| markup.changed | #ffff63 | — |
| entity.name.filename.find-in-files | #ffff63 | — |
| token.info-token | #6796e6 | — |
| token.warn-token | #cd9731 | — |
| token.error-token | #f44747 | — |
| token.debug-token | #b267e6 | — |
| keyword, keyword.control.export.tsx, keyword.control.default.tsx, keyword.control.from.ts, keyword.control.from.tsx, keyword.control.export.ts, keyword.control.default.ts, keyword.control.from.ts | #ffcad4 | — |