Nature Syntax Theme
Publisher: Thiago GomesThemes in package: 5
A UI and syntax theme for VSCode based on the nature colors.
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#edd6c0
- activityBar.foreground#ad5600
- activityBarBadge.background#ff0000aa
- activityBarBadge.foreground#fff
- badge.background#ff000088
- button.background#ffaa00aa
- button.foreground#1b1b1b
- button.hoverBackground#00ccccaa
- contrastBorder#ff9900
- debugToolBar.background#e5e5e5
- diffEditor.insertedTextBackground#5cd69933
- dropdown.background#ededed
- dropdown.border#aaa
- dropdown.foreground#1b1b1b
- editor.actions#44cc00
- editor.background#f7f7d4
- editor.findMatchBackground#d6d65c55
- editor.findMatchHighlightBackground#3399ff55
- editor.findRangeHighlightBackground#e0525255
- editor.foreground#282800
- editor.hoverHighlightBackground#3399ff33
- editor.lineHighlightBackground#e5d5d588
- editor.selectionBackground#e5d5d5aa
- editor.selectionHighlightBackground#e5d5d5aa
- editor.wordHighlightBackground#5cd69955
- editor.wordHighlightStrongBackground#e0525255
- editorCursor.foreground#f0f
- editorError.foreground#e05252
- editorGroup.background#0066cc
- editorGroup.border#ff9900
- editorGroupHeader.tabsBackground#edd6c0
- editorHoverWidget.background#ededed
- editorHoverWidget.border#ff9900
- editorIndentGuide.background#1b1b1b33
- editorLineNumber.foreground#1b1b1b55
- editorMarkerNavigation.background#44cc0055
- editorRuler.foreground#1b1b1b33
- editorSuggestWidget.background#f7ecc8
- editorSuggestWidget.border#ff9900
- editorSuggestWidget.foreground#1b1b1b
- editorSuggestWidget.selectedBackground#44cc0055
- editorWhitespace.foreground#1b1b1b22
- editorWidget.background#f7ecc8
- editorWidget.foreground#1b1b1b
- errorForeground#e05252
- focusBorder#ff9900
- foreground#1b1b1b
- input.background#ededed
- input.border#ff9900
- input.foreground#1b1b1b
- input.placeholderForeground#ededed
- inputOption.activeBorder#5cd699
- inputValidation.errorBackground#ededed
- inputValidation.errorBorder#e05252
- inputValidation.infoBackground#ededed
- inputValidation.infoBorder#3399ff
- inputValidation.warningBackground#ededed
- inputValidation.warningBorder#d6d65c
- list.activeSelectionBackground#cc000044
- list.activeSelectionForeground#1b1b1b
- list.dropBackground#cc660033
- list.focusBackground#cccc0044
- list.focusForeground#1b1b1b
- list.highlightForeground#1b1b1b
- list.hoverBackground#0066cc44
- list.hoverForeground#1b1b1b
- list.inactiveSelectionBackground#44cc0044
- list.inactiveSelectionForeground#1b1b1b
- notification.background#efefef
- notification.buttonBackground#ffaa0088
- notification.buttonForeground#1b1b1b
- notification.buttonHoverBackground#00ccccaa
- notification.errorBackground#e05252aa
- notification.errorForeground#1b1b1b
- notification.foreground#1b1b1b
- notification.infoBackground#3399ffaa
- notification.infoForeground#1b1b1b
- notification.warningBackground#d6d65caa
- notification.warningForeground#1b1b1b
- panel.background#f9f0d4
- panel.border#ff9900
- panelTitle.activeBorder#ff9900
- panelTitle.activeForeground#1b1b1b
- panelTitle.inactiveForeground#9b9b9b
- peekViewEditor.matchHighlightBackground#fff
- progressBar.background#cccc00
- scrollbarSlider.activeBackground#888
- scrollbarSlider.background#aaa
- scrollbarSlider.hoverBackground#999
- selection.background#ffaa0033
- sideBar.background#f7ecc8
- sideBarSectionHeader.background#ffaa0055
- sideBarSectionHeader.foreground#1b1b1b
- statusBar.background#edd6c0
- statusBar.debuggingBackground#fff
- statusBar.foreground#ad5600
- statusBar.noFolderBackground#eee
- statusBarItem.hoverBackground#ff00ff22
- tab.activeBackground#f7f6b7
- tab.activeForeground#000
- tab.border#ff9900
- tab.inactiveBackground#f7f6b7aa
- tab.inactiveForeground#888
- titleBar.activeBackground#efefef
- titleBar.activeForeground#1b1b1b
- titleBar.inactiveBackground#f2bf8c
- titleBar.inactiveForeground#999
- widget.shadow#ffaa00
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| invalid.deprecated | #1b1b1bFFF | — |
| markup.changed.diff,token.warn-token | #d6d65c | — |
| meta.diff.header.from-file,punctuation.definition.from-file.diff | #3399ff | — |
| markup.inserted.diff | #5cd699 | — |
| markup.deleted.diff,invalid.illegal,invalid.broken,invalid.illegal.non-null-typehinted.php,token.error-token | #e05252 | — |
| invalid.unimplemented | #fff | — |
| support.type.object.console,support.variable.dom,support.variable.property.dom,source.java,meta.definition.variable.name.java,meta.function-call.arguments.python,meta.function-call.python,entity.name.type | #ba1414 | — |
| support.function.console,support.constant.property-value.scss,support.constant.property-value.css,support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss,support.constant.color.w3c-standard-color-name.css,support.token.decorator.python,meta.function.decorator.identifier.python, meta.require, support.function.any-method,keyword.other.special-method,support.constant.font-name,entity.other.attribute-name.id,source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json | #963 | — |
| support.type.map.key.scss,support.module.node,support.type.object.module,support.module.node,storage.type.annotation.java,meta.method.java,storage.modifier.import.java,storage.type.java,import.storage.java,meta.function-call.generic.python,keyword,control.elements,storage,token.storage.type.java,entity.other.attribute-name.class.css,keyword.other.unit,punctuation.definition.bold,entity.name.section.markdown,punctuation.definition.heading.markdown,punctuation.definition.string.begin.markdown,punctuation.definition.string.end.markdown,punctuation.definition.metadata.markdown,punctuation.definition.metadata.markdown,markup.underline.link.markdown,markup.underline.link.image.markdown,var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx,function.parameter.ruby,function.parameter.cs,function.parameter,function.parameter | #969600 | — |
| punctuation.definition.string.begin,punctuation.definition.string.end,token.package.keyword,string, entity.other.inherited-class,none | #0f990f | — |
| variable.parameter.function,variable.other.readwrite,support.variable.property,support.variable.object.process,support.variable.object.node,support.variable.property.process,punctuation.section.block.begin.java,punctuation.section.block.end.java,punctuation.definition.method-parameters.begin.java,punctuation.definition.method-parameters.end.java,meta.method.identifier.java,punctuation.section.method.begin.java,punctuation.section.method.end.java,punctuation.terminator.java,punctuation.section.class.begin.java,punctuation.section.class.end.java,punctuation.section.inner-class.begin.java,punctuation.section.inner-class.end.java,meta.method-call.java,storage.type.generic.java,punctuation.section.class.begin.bracket.curly.java,punctuation.section.class.end.bracket.curly.java,punctuation.section.method.begin.bracket.curly.java,punctuation.section.method.end.bracket.curly.java,punctuation.separator.period.java,meta.method.body.java,token.variable.parameter.java,meta.function.decorator.python,punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python,meta.function-call.arguments.python,variable,support.type.property-name,support.constant.property-value,meta.tag,entity.name.tag,beginning.punctuation.definition.list.markdown,markup.quote.markdown,punctuation.section.embedded, variable.interpolation,source.json meta.structure.dictionary.json > string.quoted.json,source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string,support.type.property-name.json,meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php,rgb-value,less rgb-value,support.type.primitive.ts,support.type.builtin.ts | #369 | — |
| punctuation.terminator.rule.scss,punctuation.definition.tag.begin.html,punctuation.definition.tag.end.html,support.constant.math,support.constant.property.math,variable.other.constant,support.constant.json,constant.other.symbol,constant,punctuation.definition.constant,entity.other.attribute-name,markup.italic,punctuation.definition.italic,todo.emphasis,emphasis md,punctuation.definition.variable.php,entity.name.goto-label.php,support.other.php,support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php,text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade,text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade,entity.name.variable.local.cs | #7e15b2 | — |
| punctuation.definition.template-expression.begin,punctuation.definition.template-expression.end,support.type.object.dom,support.type.vendored.property-name.css,support.type.python,token.package,support.function,constant.numeric,none,none,meta.selector,markup.inline.raw.markdown,inline-color-decoration rgb-value,support.type.property-name.json punctuation,support.other.namespace.use.php,support.other.namespace.use-as.php,support.other.namespace.php,selector.sass | #399 | — |
| meta.class.body.php,support.class.php,punctuation.definition.bold.markdown,punctuation.definition.metadata.markdown,markup.underline.link.markdown,markup.underline.link.image.markdown,function.parameter,function.parameter,function.parameter.ruby, function.parameter.cs,var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx | #c613a9 | — |
| source.env,text.html,text.html.basic,text.html.php.blade,text.html.php.laravel-blade,text.html.vue-html,meta.directive.vue | #282800 | — |
| variable.language.special.self.python,comment.line.number-sign.python,comment,punctuation.definition.comment,comment,comment markup.link,entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.parameter,variable.language.super,var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx | — | italic |
| invalid.unimplemented | #fff | — |
| string | #6ca83a | — |
| entity.name.function,meta.function,meta.function.python,meta.function.c,support.function,meta.function-call.generic.python | #ba2a71 | — |
| variable.other.readwrite, support.variable.dom,support.variable.property.dom | #269326 | — |
| entity.name.tag | #2269b5 | — |
| punctuation.definition.tag.begin.html,punctuation.definition.tag.end.html, | #007fff | — |
| entity.other.attribute-name.html | #b95ce8 | — |
| variable,support.type.object.module | #1571c1 | — |
| variable.other.property.js | #b75874 | — |
| keyword.control,keyword.control.cpp,variable.language.this.js | #00af6d | — |
| meta.object-literal.key | #2967a5 | — |
| punctuation,punctuation.definition.block,punctuation.separator.key-value,meta.brace,punctuation.section.array,punctuation.section.array.begin.php,punctuation.section.array.end.php,punctuation.terminator.expression.php,punctuation.separator.delimiter.php,punctuation.definition.class.begin.bracket.curly.php,punctuation.definition.class.end.bracket.curly.php,punctuation.definition.map.begin.bracket.round.scss,punctuation.definition.map.end.bracket.round.scss,punctuation.separator.key-value.scss,meta.structure.dictionary.json,function.brace,punctuation.section.block.begin.bracket.curly.cpp,punctuation.section.block.end.bracket.curly.cpp,punctuation.terminator.statement.c,punctuation.section.block.begin.bracket.curly.c,punctuation.section.block.end.bracket.curly.c,punctuation.section.parens.begin.bracket.round.c,punctuation.section.parens.end.bracket.round.c,punctuation.section.parameters.begin.bracket.round.c,punctuation.section.parameters.end.bracket.round.c,punctuation.definition.parameters.begin.bracket.round.php,punctuation.definition.parameters.end.bracket.round.php,punctuation.separator.delimiter.php,punctuation.section.scope.begin.php,punctuation.section.scope.end.php,punctuation.terminator.expression.php,punctuation.definition.arguments.begin.bracket.round.php,punctuation.definition.arguments.end.bracket.round.php,punctuation.definition.storage-type.begin.bracket.round.php,punctuation.definition.storage-type.end.bracket.round.php,punctuation.definition.array.begin.bracket.round.php,punctuation.definition.array.end.bracket.round.php,punctuation.definition.begin.bracket.round.php,punctuation.definition.end.bracket.round.php,punctuation.definition.begin.bracket.curly.php,punctuation.definition.end.bracket.curly.php,meta.method-call.php | #ff7f00 | — |
| comment,block.scope.end,block.scope.begin,punctuation.definition.comment,comment markup.link | #aaa | — |
| storage.modifier | #d19617 | — |
| keyword.other.namespace.php,keyword.other.use.php,keyword.control.import.python | #3764e8 | — |
| keyword.control.flow.python | #29b21c | — |
| variable.language.special.self.python | #ff4cf7 | — |
| keyword.operator.heredoc.php,keyword.operator.nowdoc.php,keyword.operator.type.php,keyword.operator.error-control.php,keyword.operator,keyword.operator.expression.import,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.ternary,keyword.operator.sizeof.c,keyword.operator.less,keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php,keyword.operator.logical.js,keyword.operator.bitwise,keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c,support.type.posix-reserved.c,keyword.operator.logical.python,token.storage,keyword.operator.expression.delete,keyword.operator.expression.in,keyword.operator.expression.of,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.expression.typeof,keyword.operator.expression.void,keyword.operator,,keyword.operator.comparison.php,keyword.operator.regexp.php | #ff4cf7 | — |
| entity.other.alias.php | #0f990f | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...