Vermilion Theme's
Publisher: arkikkyThemes in package: 1
A beautifully crafted dark theme inspired by deep red tones (#CF0C4D) with elegant contrasts and focus-driven design.
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#2F1F21
- activityBar.activeBorder#CF0C4D
- activityBar.activeFocusBorder#CF0C4D
- activityBar.activeForeground#FFFFFF
- activityBar.background#0F0E0E
- activityBar.border#6C6C6CCC
- activityBar.foreground#FFFFFF
- activityBarBadge.background#CF0C4D
- activityBarBadge.foreground#FFFFFF
- badge.background#CF0C4D
- badge.foreground#FFFFFF
- breadcrumb.activeSelectionForeground#FFFFFF
- breadcrumb.background#140C0E
- breadcrumb.focusForeground#FFFFFF
- breadcrumb.foreground#D8D8D8
- button.background#3A0F1F
- button.border#3A0F1F
- button.foreground#FFFFFF
- button.hoverBackground#6B1230
- button.secondaryBackground#3A0F1F
- button.secondaryForeground#FFFFFF
- button.secondaryHoverBackground#5b1830
- checkbox.background#3A0F1F
- checkbox.border#6B1230
- dropdown.background#2A0D15
- dropdown.border#6B1230
- dropdown.foreground#FFFFFF
- editor.background#160F10
- editor.findMatchBackground#CF0C4D55
- editor.findMatchHighlightBackground#FF799C33
- editor.findRangeHighlightBackground#6B123055
- editor.hoverHighlightBackground#6B123044
- editor.selectionBackground#CF0C4D
- editor.selectionForeground#FFFFFF
- editorBracketHighlight.foreground1#FFFFFF
- editorBracketHighlight.foreground2#FFFFFF
- editorBracketHighlight.foreground3#FFFFFF
- editorCursor.background#CF0C4D
- editorCursor.foreground#CF0C4D
- editorGroupHeader.tabsBackground#2F1F21
- editorHoverWidget.background#1C1011
- editorHoverWidget.border#4F021F
- editorIndentGuide.activeBackground1#7F7878
- editorIndentGuide.activeBackground2#7F7878
- editorIndentGuide.background1#3D3D3D
- editorInlayHint.background#4F021F
- editorInlayHint.foreground#FFFFFFAA
- editorLineNumber.foreground#656565
- editorOverviewRuler.border#2F1F21
- editorRuler.foreground#3A0F1F
- editorWhitespace.foreground#3A0F1F
- editorWidget.background#160F10
- editorWidget.border#7d0d32
- editorWidget.shadow#1F1F1F
- focusBorder#4F021F
- foreground#FFFFFF
- icon.foreground#FFFFFF
- input.background#282828
- input.border#4F021F
- inputOption.activeBackground#6B1230
- inputOption.activeBorder#CF0C4D
- inputOption.foreground#FFFFFF
- inputOption.hoverBackground#8E244A
- list.activeSelectionBackground#4F021F
- list.activeSelectionForeground#FFFFFF
- list.errorForeground#FFFFFF
- list.focusBackground#3A0F1F
- list.focusForeground#FFFFFF
- list.focusOutline#981E49
- list.highlightForeground#CF0C4D
- list.hoverBackground#3A0F1F
- list.hoverForeground#FFFFFF
- list.inactiveFocusOutline#981E49
- list.inactiveSelectionBackground#3A0F1F
- list.inactiveSelectionForeground#FFFFFF
- list.warningForeground#FFFFFF
- notificationCenterHeader.background#CF0C4D
- notificationCenterHeader.foreground#FFFFFF
- notificationLink.foreground#FF799C
- notificationLink.hoverForeground#FFA0C0
- notifications.background#4F021F
- notifications.foreground#FFFFFF
- notifications.hoverBackground#4F021F
- notificationToast.background#4F021F
- notificationToast.border#6B1230
- notificationToast.foreground#FFFFFF
- panel.background#160F10
- panel.border#6C6C6CCC
- panel.foreground#FFFFFF
- panelInput.border#6B1230
- panelSection.border#981E49
- panelSectionHeader.background#4F021F
- panelSectionHeader.foreground#FFFFFF
- panelTitle.activeBorder#CF0C4D
- panelTitle.activeForeground#FFFFFF
- panelTitle.inactiveForeground#858484
- peekViewEditor.background#160F10
- peekViewEditor.matchHighlightBackground#CF0C4D33
- peekViewResult.background#1A0D10
- peekViewResult.matchHighlightBackground#CF0C4D33
- peekViewResult.selectionBackground#4F021F
- peekViewTitle.background#4F021F
- peekViewTitleDescription.foreground#FFD9E2
- peekViewTitleLabel.foreground#FFFFFF
- scrollbarSlider.activeBackground#C6C6C6CC
- scrollbarSlider.background#636363cc
- scrollbarSlider.hoverBackground#C6C6C6CC
- searchEditor.findMatchBackground#CF0C4D66
- searchEditor.findMatchBorder#CF0C4D
- searchEditor.textInputBorder#6B1230
- settings.checkboxBackground#3A0F1F
- settings.checkboxBorder#6B1230
- settings.dropdownBackground#2A0D15
- settings.dropdownBorder#6B1230
- settings.dropdownForeground#FFFFFF
- settings.focusedRowBackground#3A0F1F
- settings.focusedRowBorder#CF0C4D
- settings.headerForeground#FFFFFF
- settings.modifiedItemIndicator#FF799C
- settings.rowHoverBackground#4F021F
- settings.textInputBackground#282828
- settings.textInputBorder#6B1230
- sideBar.background#160F10
- sideBar.border#6C6C6CCC
- sideBar.foreground#D9D9D9
- sideBarSectionHeader.background#4F021F
- sideBarTitle.background#4F021F
- statusBar.background#CF0C4D
- statusBar.debuggingBackground#4F021F
- statusBar.debuggingForeground#FFFFFF
- statusBar.foreground#FFFFFF
- statusBar.noFolderBackground#4F021F
- statusBar.noFolderForeground#FFFFFF
- statusBarItem.activeBackground#4F021F
- statusBarItem.hoverBackground#4F021F
- statusBarItem.prominentBackground#4F021F
- statusBarItem.prominentHoverBackground#4F021F
- statusBarItem.remoteBackground#4F021F
- statusBarItem.remoteForeground#FFFFFF
- tab.activeBackground#543236
- tab.activeBorderTop#7d5363
- tab.activeForeground#FFFFFF
- tab.border#2C1F21
- tab.hoverBackground#543236
- tab.hoverBorder#543236
- tab.inactiveBackground#2F1F21
- tab.inactiveForeground#858484
- terminal.ansiBlack#1F1F1F
- terminal.ansiBlue#29A9FF
- terminal.ansiCyan#38ffc3
- terminal.ansiGreen#4FE56D
- terminal.ansiMagenta#C832FF
- terminal.ansiRed#FF2869
- terminal.ansiWhite#D8D8D8
- terminal.ansiYellow#FFD931
- terminal.background#160F10
- terminal.foreground#FFFFFF
- terminalCursor.background#CF0C4D
- terminalCursor.foreground#CF0C4D
- textLink.activeForeground#CF0C4D
- textLink.foreground#CF0C4D
- titleBar.activeBackground#0F0E0E
- titleBar.activeForeground#FFFFFF
- titleBar.border#303030
- widget.shadow#14151A
- window.activeBorder#0F0E0E
- window.inactiveBorder#0F0E0E
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| modifier, this, comment, storage.modifier, entity.other.attribute-name, entity.other.attribute-name.html, punctuation.definition.comment, text.html.basic entity.other, entity.other.attribute-name, markup.quote.markdown meta.paragraph.markdown, markup.italic.markdown, text.jade entity.other.attribute-name.tag, keyword.control.from, entity.other.attribute-name.tag.pug | — | italic |
| modifier, this, comment, comment.line.double-slash, markup.quote.markdown, meta.diff, meta.diff.header, meta.function.expression, meta.structure.array.json.comments, meta.structure.dictionary.value.json.comments, meta.structure.dictionary.json.comments, meta.structure.dictionary.value.json.comments, meta.structure.dictionary.json.comments, variable.other.constant, variable.other.readwrite, source.json.comments | #959899 | — |
| source.jsx, source.json, source.php, source.sql, meta.block, meta.parameters, meta.tsx.children.tsx, meta.jsx.children.js, meta.type.parameters, meta.type.annotation, punctuation.accessor, punctuation.definition.tag, punctuation.separator.array.json, punctuation.separator.dictionary.key-value.json, punctuation.separator.dictionary.pair.json, punctuation.separator.comma, punctuation.separator.list.comma.css, punctuation.terminator.statement, punctuation.terminator.apply.tailwind, punctuation.separator.comma.js.jsx, punctuation.separator.key-value.ts, punctuation.definition.string.begin.go, punctuation.definition.string.end.go, punctuation.separator.period.java, punctuation.separator.arguments.python, punctuation.separator.parameters.python, punctuation.section.function.begin.python, punctuation.separator.colon.python, punctuation.separator.dict.python, punctuation.separator.element.python, punctuation.separator.period.python, punctuation.separator.delimiter.java, punctuation.terminator.java, keyword.operator.arithmetic.js, keyword.operator.arithmetic.jsx, keyword.operator.arithmetic.ts, keyword.operator.arithmetic.tsx, keyword.operator.arithmetic.java, keyword.operator.arithmetic.go, keyword.operator.arithmetic.php, keyword.operator.arithmetic.py, keyword.operator.assignment, keyword.operator.relational, keyword.operator, keyword.operator.type.annotation, storage.type.function.arrow, storage.type.function.arrow.js, storage.type.function.arrow.jsx, storage.type.function.arrow.tsx | #D3D3D3 | — |
| source.ignore, source.toml, source.python, support.function, support.type.primitive, support.type.property-name.json, support.type.primitive, support.constant.media, support.constant.property-value, entity.name.type, entity.other.attribute-name, variable.other.assignment.shell, variable.other.property, variable.other.constant.object, variable.other.readwrite, variable.other.readwrite.alias, keyword.other.unit, keyword.other.unit.percentage.css, keyword.other.definition.ini, keyword.other.unit.rem.css, constant.language.boolean, constant.character.escape, constant.character.escape.codepoint.css, constant.numeric.decimal, constant.numeric.css, constant.other.color.rgb-value.hex.css, meta.property-name.css, meta.property-value.css, meta.at-rule.apply.tailwind, punctuation.definition.template-expression, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.definition.block.tag.jsdoc, string.quoted.double.toml, storage.type.numeric.go, storage.type.string.go, storage.type.java, storage.type.numeric.java, storage.type.string.java, storage.type.primitive.java, constant.other.table-name.sql, storage.type.sql, constant.other.database-name.sql, storage.type.class.jsdoc, meta.definition.variable.java, meta.item-access.python, meta.item-access.arguments.python | #FF8E3C | — |
| source.ini, source.shell, constant.numeric, constant.language, variable.parameter, variable.other.constant.js.jsx, variable.other.constant.ts.tsx, entity.name.type.interface, entity.name.function.member, meta.objectliteral, meta.method.body.java, meta.method.java, meta.expression.assignment.shell, meta.structure.dictionary.json, meta.structure.dictionary.value.json, punctuation.definition.dictionary.begin.json, punctuation.definition.string.begin.php, punctuation.definition.string.end.php, support.class, support.class.component, storage.type.string.python, string.quoted.raw.go, string.quoted.double.php, entity.name.function.sql | #FFD931 | — |
| variable.css, storage.modifier.sql, constant.numeric.sql, keyword.operator.new, keyword.operator.expression, support.variable, support.type.builtin, support.type.property-name, support.variable.property, support.type.vendored.property-name, entity.name.function, entity.other.keyframe-offset.css, meta.object-literal.key, meta.object-literal.key.js, storage.modifier.async | #29A9FF | — |
| meta.create.sql, meta.objectliteral, support.constant.font-name, string.template, string.quoted.double, string.quoted.single, punctuation.definition.string, entity.other.attribute-name.class.css, entity.other.keyframe-offset.percentage.css, entity.other.attribute-name.pseudo-element.css | #5ADD74 | — |
| meta.objectliteral, punctuation.definition.block, support.type.object.module, keyword.control, keyword.control.flow, keyword.control.flow.python, keyword.other.sql, keyword.other.create.sql, keyword.other.DML.sql, keyword.other.DML.II.sql, keyword.other.DML.III.sql, storage.type, storage.type.function | #C832FF | — |
| entity.name.tag, entity.name.type.module, entity.name.tag.css, entity.other.attribute-name.pseudo-class.css, meta.tag.js, meta.selector.css, meta.indexed-name.python, meta.function-call.python, meta.item-access.python, meta.export.default, meta.template.expression, meta.function-call.tsx, meta.function.parameters.php, meta.function.parameter.no-default.php, meta.definition.variable.java, meta.object-literal.key.ts, variable.php, variable.js, variable.jsx, variable.tsx, variable.argument.css, variable.other.php, variable.other.go, variable.other.object, variable.other.assignment.go, variable.other.definition.java, variable.object.property, variable.other.constant, variable.other.property, variable.other.object.property, variable.other.global.safer.php, keyword.operator.logical, keyword.operator.arithmetic, keyword.other.DDL.create.II.sql, support.function.builtin.python, punctuation.section.embedded.begin.php, constant.character.escape.css, invalid.illegal.expected-array-separator.json.comments | #FF2869 | — |