Skip to main content
Coding Theme

Fortnite VS Code Theme

Publisher: sarah.drasnerThemes in package: 1

A Fortnite-inspired color theme for childlike happiness even while doing serious programming

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#20122C
  • activityBar.foreground#b7aac1
  • activityBarBadge.background#1f6c74
  • activityBarBadge.foreground#ffffff
  • badge.background#1f6c74
  • badge.foreground#b7aac1
  • button.background#1f6c74
  • button.foreground#FFFFFF
  • button.hoverBackground#288b96
  • diffEditor.insertedTextBackground#00809B33
  • dropdown.background#353b45
  • dropdown.border#181A1F
  • editor.background#150621
  • editor.findMatchHighlightBackground#1f6c743D
  • editor.foreground#f0bbf5
  • editor.lineHighlightBackground#99BBFF0A
  • editor.selectionBackground#3E4451
  • editorCursor.foreground#1f6c74
  • editorGroup.background#12061A
  • editorGroup.border#181A1F
  • editorGroupHeader.tabsBackground#12061A
  • editorHoverWidget.background#12061A
  • editorHoverWidget.border#181A1F
  • editorIndentGuide.activeBackground#626772
  • editorIndentGuide.background#f0bbf526
  • editorLineNumber.activeForeground#f0bbf5
  • editorLineNumber.foreground#636D83
  • editorRuler.foreground#f0bbf526
  • editorSuggestWidget.background#12061A
  • editorSuggestWidget.border#181A1F
  • editorSuggestWidget.selectedBackground#36194D
  • editorWhitespace.foreground#f0bbf526
  • editorWidget.background#12061A
  • editorWidget.border#3A3F4B
  • extensionButton.prominentBackground#2BA143
  • extensionButton.prominentHoverBackground#37AF4E
  • focusBorder#1f6c74
  • input.background#36194d
  • input.border#181A1F
  • list.activeSelectionBackground#36194D
  • list.activeSelectionForeground#b7aac1
  • list.focusBackground#36194D
  • list.highlightForeground#9e8dac
  • list.hoverBackground#36194D66
  • list.inactiveSelectionBackground#36194D
  • list.inactiveSelectionForeground#b7aac1
  • notification.background#12061A
  • peekView.border#1f6c74
  • peekViewEditor.background#36194d
  • peekViewResult.background#12061A
  • peekViewResult.selectionBackground#36194D
  • peekViewTitle.background#36194d
  • pickerGroup.border#1f6c74
  • scrollbarSlider.activeBackground#747D9180
  • scrollbarSlider.background#4E566680
  • scrollbarSlider.hoverBackground#5A637580
  • sideBar.background#12061A
  • sideBarSectionHeader.background#20122C
  • statusBar.background#12061A
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#9DA5B4
  • statusBar.noFolderBackground#12061A
  • statusBarItem.hoverBackground#36194D
  • tab.activeBackground#150621
  • tab.activeForeground#b7aac1
  • tab.border#181A1F
  • tab.inactiveBackground#12061A
  • titleBar.activeBackground#12061A
  • titleBar.activeForeground#9DA5B4
  • titleBar.inactiveBackground#12061A
  • titleBar.inactiveForeground#9DA5B4

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#7684a0ccitalic
comment markup.link#7684a0
entity.name.type#8cefd8
entity.other.inherited-class#8cefd8
keyword#e66bfb
keyword.control#e66bfb
keyword.operator#e66bfb
keyword.other.special-method#8cefd8
keyword.other.unit#9dd65f
storage#e66bfb
storage.type.annotation, storage.type.primitive#e66bfb
storage.modifier.package, storage.modifier.import#f0bbf5
constant#9dd65f
constant.variable#9dd65f
constant.character.escape#5adfe0
constant.numeric#9dd65f
constant.other.color#5adfe0
constant.other.symbol#5adfe0
variable#8cefd8
variable.interpolation#BE5046
variable.parameter#f0bbf5
string#f9dea6
string > source, string embedded#f0bbf5
string.regexp#5adfe0
string.regexp source.ruby.embedded#deb581
string.other.link#8cefd8
punctuation.definition.comment#7684a0
punctuation.definition.method-parameters, punctuation.definition.function-parameters, punctuation.definition.parameters, punctuation.definition.separator, punctuation.definition.seperator, punctuation.definition.array#f0bbf5
punctuation.definition.heading, punctuation.definition.identity#8ec3ef
punctuation.definition.bold#8cefd8bold
punctuation.definition.italic#e66bfbitalic
punctuation.section.embedded#FFFFFF
punctuation.section.method, punctuation.section.class, punctuation.section.inner-class#f0bbf5
support.class#deb581
support.type#5adfe0
support.function#5adfe0
support.function.any-method#8cefd8
entity.name.function#8cefd8
entity.name.class, entity.name.type.class#deb581
entity.name.section#8ec3ef
entity.name.tag#8cefd8
entity.other.attribute-name#9dd65f
entity.other.attribute-name.id#8cefd8
meta.class#8cefd8
meta.class.body#f0bbf5
meta.method-call, meta.method#f0bbf5
meta.definition.variable#8cefd8
meta.link#9dd65f
meta.require#8ec3ef
meta.selector#e66bfb
meta.separator#f0bbf5
meta.tag#f0bbf5
underline
none#f0bbf5
invalid.deprecated#523D14
invalid.illegalwhite
markup.bold#9dd65fbold
markup.changed#e66bfb
markup.deleted#8cefd8
markup.italic#e66bfbitalic
markup.heading#8cefd8
markup.heading punctuation.definition.heading#8ec3ef
markup.link#5adfe0
markup.inserted#f9dea6
markup.quote#9dd65f
markup.raw#f9dea6
source.c keyword.operator#e66bfb
source.cpp keyword.operator#e66bfb
source.cs keyword.operator#e66bfb
source.css property-name, source.css property-value#828997
source.css property-name.support, source.css property-value.support#f0bbf5
source.elixir source.embedded.source#f0bbf5
source.elixir constant.language, source.elixir constant.numeric, source.elixir constant.definition#8ec3ef
source.elixir variable.definition, source.elixir variable.anonymous#e66bfb
source.elixir parameter.variable.function#9dd65fitalic
source.elixir quoted#f9dea6
source.elixir keyword.special-method, source.elixir embedded.section, source.elixir embedded.source.empty#8cefd8
source.elixir readwrite.module punctuation#8cefd8
source.elixir regexp.section, source.elixir regexp.string#BE5046
source.elixir separator, source.elixir keyword.operator#9dd65f
source.elixir variable.constant#8cefd8
source.elixir array, source.elixir scope, source.elixir section#828997
source.gfm markup
source.gfm link entity#8ec3ef
source.go storage.type.string#e66bfb
source.ini keyword.other.definition.ini#8cefd8
source.java storage.modifier.import#8cefd8
source.java storage.type#8cefd8
source.java keyword.operator.instanceof#e66bfb
source.java-properties meta.key-pair#8cefd8
source.java-properties meta.key-pair > punctuation#f0bbf5
source.js keyword.operator#5adfe0
source.js keyword.operator.delete, source.js keyword.operator.in, source.js keyword.operator.of, source.js keyword.operator.instanceof, source.js keyword.operator.new, source.js keyword.operator.typeof, source.js keyword.operator.void#e66bfb
source.ts keyword.operator#5adfe0
source.flow keyword.operator#5adfe0
source.json meta.structure.dictionary.json > string.quoted.json#8cefd8
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#8cefd8
source.json meta.structure.dictionary.json > value.json > string.quoted.json, source.json meta.structure.array.json > value.json > string.quoted.json, source.json meta.structure.dictionary.json > value.json > string.quoted.json > punctuation, source.json meta.structure.array.json > value.json > string.quoted.json > punctuation#f9dea6
source.json meta.structure.dictionary.json > constant.language.json, source.json meta.structure.array.json > constant.language.json#5adfe0
ng.interpolation#8cefd8
ng.interpolation.begin, ng.interpolation.end#8ec3ef
ng.interpolation function#8cefd8
ng.interpolation function.begin, ng.interpolation function.end#8ec3ef
ng.interpolation bool#9dd65f
ng.interpolation bracket#f0bbf5
ng.pipe, ng.operator#f0bbf5
ng.tag#5adfe0
ng.attribute-with-value attribute-name#8cefd8
ng.attribute-with-value string#e66bfb
ng.attribute-with-value string.begin, ng.attribute-with-value string.end#f0bbf5
source.ruby constant.other.symbol > punctuationinherit
source.php class.bracket#f0bbf5
source.python keyword.operator.logical.python#e66bfb
source.python variable.parameter#9dd65f
customrule#f0bbf5
support.type.property-name#f0bbf5
string.quoted.double punctuation#f9dea6
support.constant#9dd65f
support.type.property-name.json#8cefd8
support.type.property-name.json punctuation#8cefd8
punctuation.separator.key-value.ts, punctuation.separator.key-value.js, punctuation.separator.key-value.tsx#5adfe0
source.js.embedded.html keyword.operator, source.ts.embedded.html keyword.operator#5adfe0
variable.other.readwrite.js, variable.other.readwrite.ts, variable.other.readwrite.tsx#f0bbf5
support.variable.dom.js, support.variable.dom.ts#8cefd8
support.variable.property.dom.js, support.variable.property.dom.ts#8cefd8
meta.template.expression.js punctuation.definition, meta.template.expression.ts punctuation.definition#BE5046
source.ts punctuation.definition.typeparameters, source.js punctuation.definition.typeparameters, source.tsx punctuation.definition.typeparameters#f0bbf5
source.ts punctuation.definition.block, source.js punctuation.definition.block, source.tsx punctuation.definition.block#f0bbf5
source.ts punctuation.separator.comma, source.js punctuation.separator.comma, source.tsx punctuation.separator.comma#f0bbf5
support.variable.property.js, support.variable.property.ts, support.variable.property.tsx#8cefd8
keyword.control.default.js, keyword.control.default.ts, keyword.control.default.tsx#71d3e8
keyword.operator.expression.instanceof.js, keyword.operator.expression.instanceof.ts, keyword.operator.expression.instanceof.tsx#e66bfb
keyword.operator.expression.of.js, keyword.operator.expression.of.ts, keyword.operator.expression.of.tsx#e66bfb
meta.brace.round.js, meta.array-binding-pattern-variable.js, meta.brace.square.js, meta.brace.round.ts, meta.array-binding-pattern-variable.ts, meta.brace.square.ts, meta.brace.round.tsx, meta.array-binding-pattern-variable.tsx, meta.brace.square.tsx#f0bbf5
source.js punctuation.accessor, source.ts punctuation.accessor, source.tsx punctuation.accessor#f0bbf5
punctuation.terminator.statement.js, punctuation.terminator.statement.ts, punctuation.terminator.statement.tsx#f0bbf5
meta.array-binding-pattern-variable.js variable.other.readwrite.js, meta.array-binding-pattern-variable.ts variable.other.readwrite.ts, meta.array-binding-pattern-variable.tsx variable.other.readwrite.tsx#9dd65f
source.js support.variable, source.ts support.variable, source.tsx support.variable#71d3e8
variable.other.constant.property.js, variable.other.constant.property.ts, variable.other.constant.property.tsx#9dd65f
keyword.operator.new.ts, keyword.operator.new.j, keyword.operator.new.tsx#e66bfb
source.ts keyword.operator, source.tsx keyword.operator#5adfe0
punctuation.separator.parameter.js, punctuation.separator.parameter.ts, punctuation.separator.parameter.tsx #f0bbf5
constant.language.import-export-all.js, constant.language.import-export-all.ts#71d3e8
constant.language.import-export-all.jsx, constant.language.import-export-all.tsx#5adfe0
keyword.control.as.js, keyword.control.as.ts, keyword.control.as.jsx, keyword.control.as.tsx#f0bbf5
variable.other.readwrite.alias.js, variable.other.readwrite.alias.ts, variable.other.readwrite.alias.jsx, variable.other.readwrite.alias.tsx#8cefd8
variable.other.constant.js, variable.other.constant.ts, variable.other.constant.jsx, variable.other.constant.tsx#9dd65f
meta.export.default.js variable.other.readwrite.js, meta.export.default.ts variable.other.readwrite.ts#71d3e8
source.js meta.template.expression.js punctuation.accessor, source.ts meta.template.expression.ts punctuation.accessor, source.tsx meta.template.expression.tsx punctuation.accessor#f9dea6
source.js meta.import-equals.external.js keyword.operator, source.jsx meta.import-equals.external.jsx keyword.operator, source.ts meta.import-equals.external.ts keyword.operator, source.tsx meta.import-equals.external.tsx keyword.operator#f0bbf5
entity.name.type.module.js,entity.name.type.module.ts,entity.name.type.module.jsx,entity.name.type.module.tsx#f9dea6
meta.class.js,meta.class.ts,meta.class.jsx,meta.class.tsx#f0bbf5
meta.definition.property.js variable, meta.definition.property.ts variable, meta.definition.property.jsx variable, meta.definition.property.tsx variable#f0bbf5
meta.type.parameters.js support.type, meta.type.parameters.jsx support.type, meta.type.parameters.ts support.type, meta.type.parameters.tsx support.type#f0bbf5
source.js meta.tag.js keyword.operator, source.jsx meta.tag.jsx keyword.operator, source.ts meta.tag.ts keyword.operator, source.tsx meta.tag.tsx keyword.operator#f0bbf5
meta.tag.js punctuation.section.embedded, meta.tag.jsx punctuation.section.embedded, meta.tag.ts punctuation.section.embedded, meta.tag.tsx punctuation.section.embedded#f0bbf5
meta.array.literal.js variable, meta.array.literal.jsx variable, meta.array.literal.ts variable, meta.array.literal.tsx variable#8cefd8
support.type.object.module.js, support.type.object.module.jsx, support.type.object.module.ts, support.type.object.module.tsx#8cefd8
constant.language.json#5adfe0
variable.other.constant.object.js, variable.other.constant.object.jsx, variable.other.constant.object.ts, variable.other.constant.object.tsx#9dd65f
storage.type.property.js, storage.type.property.jsx, storage.type.property.ts, storage.type.property.tsx#5adfe0
meta.template.expression.js string.quoted punctuation.definition, meta.template.expression.jsx string.quoted punctuation.definition, meta.template.expression.ts string.quoted punctuation.definition, meta.template.expression.tsx string.quoted punctuation.definition#f9dea6
meta.template.expression.js string.template punctuation.definition.string.template, meta.template.expression.jsx string.template punctuation.definition.string.template, meta.template.expression.ts string.template punctuation.definition.string.template, meta.template.expression.tsx string.template punctuation.definition.string.template#f9dea6
keyword.operator.expression.in.js, keyword.operator.expression.in.jsx, keyword.operator.expression.in.ts, keyword.operator.expression.in.tsx#e66bfb
variable.other.object.js, variable.other.object.ts#f0bbf5
meta.object-literal.key.js, meta.object-literal.key.ts#cfe08a
source.python constant.other#f0bbf5
source.python constant#9dd65f
constant.character.format.placeholder.other.python storage#9dd65f
support.variable.magic.python#8cefd8
meta.function.parameters.python#9dd65f
punctuation.separator.annotation.python#f0bbf5
punctuation.separator.parameters.python#f0bbf5
entity.name.variable.field.cs#8cefd8
source.cs keyword.operator#f0bbf5
variable.other.readwrite.cs#f0bbf5
variable.other.object.cs#f0bbf5
variable.other.object.property.cs#f0bbf5
entity.name.variable.property.cs#8ec3ef
storage.type.cs#8cefd8
keyword.other.unsafe.rust#e66bfb
entity.name.type.rust#5adfe0
storage.modifier.lifetime.rust#f0bbf5
entity.name.lifetime.rust#9dd65f
storage.type.core.rust#5adfe0
meta.attribute.rust#9dd65f
storage.class.std.rust#5adfe0
markup.raw.block.markdown#f5dff7
punctuation.definition.variable.shell#8cefd8
support.constant.property-value.css#f0bbf5
punctuation.definition.constant.css#8cefd8
punctuation.separator.key-value.scss#8cefd8
punctuation.definition.constant.scss#f9dea6
entity.other.attribute-name.parent-selector.css#f9dea6
entity.other.attribute-name.class.css#f9dea6
meta.property-list.scss punctuation.separator.key-value.scss#f0bbf5
storage.type.primitive.array.java#8cefd8
entity.name.section.markdown#8cefd8
punctuation.definition.heading.markdown#8cefd8
markup.heading.setext#f0bbf5
punctuation.definition.bold.markdown#9dd65f
markup.inline.raw.markdown#f9dea6
beginning.punctuation.definition.list.markdown#8cefd8
markup.quote.markdown#7684a0italic
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#f0bbf5
punctuation.definition.metadata.markdown#e66bfb
markup.underline.link.markdown, markup.underline.link.image.markdown#e66bfb
string.other.link.title.markdown, string.other.link.description.markdown#8ec3ef
punctuation.separator.variable.ruby#8cefd8
variable.other.constant.ruby#9dd65f
keyword.operator.other.ruby#f9dea6
punctuation.definition.variable.php#8cefd8
meta.class.php#f0bbf5

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Fortnite VS Code Theme - Coding Theme