Jellybean Theme
Publisher: neon moonThemes in package: 2
A VS Code theme inspired by jellybeans — vivid, playful colors with dark and light variants.
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#0f1023
- activityBar.border#13141f
- activityBar.foreground#e8e8f0
- activityBar.inactiveForeground#3a3c58
- activityBarBadge.background#FF8500
- activityBarBadge.foreground#0f1023
- badge.background#FF8500
- badge.foreground#0f1023
- breadcrumb.activeSelectionForeground#e8e8f0
- breadcrumb.focusForeground#e8e8f0
- breadcrumb.foreground#5a5c78
- breadcrumbPicker.background#13141f
- button.background#8B5CF6
- button.foreground#ffffff
- button.hoverBackground#7C3AED
- button.secondaryBackground#23253a
- button.secondaryForeground#e8e8f0
- button.secondaryHoverBackground#2d2f47
- charts.blue#60A5FA
- charts.foreground#e8e8f0
- charts.green#22C55E
- charts.lines#3a3c58
- charts.orange#FF8500
- charts.purple#8B5CF6
- charts.red#EF4444
- charts.yellow#FFD700
- debugIcon.breakpointCurrentStackframeForeground#FFD700
- debugIcon.breakpointForeground#EF4444
- debugIcon.startForeground#22C55E
- debugToolBar.background#13141f
- descriptionForeground#7a7c98
- diffEditor.insertedLineBackground#22C55E10
- diffEditor.insertedTextBackground#22C55E15
- diffEditor.removedLineBackground#EF444410
- diffEditor.removedTextBackground#EF444415
- dropdown.background#13141f
- dropdown.border#3a3c58
- dropdown.foreground#e8e8f0
- editor.background#0f1023
- editor.findMatchBackground#FFD70040
- editor.findMatchHighlightBackground#FFD70020
- editor.foreground#e8e8f0
- editor.lineHighlightBackground#1a1b2e80
- editor.rangeHighlightBackground#8B5CF610
- editor.selectionBackground#8B5CF630
- editor.selectionHighlightBackground#8B5CF618
- editor.wordHighlightBackground#14B8A620
- editor.wordHighlightStrongBackground#14B8A640
- editorBracketHighlight.foreground1#60A5FA
- editorBracketHighlight.foreground2#EC4899
- editorBracketHighlight.foreground3#22C55E
- editorBracketHighlight.foreground4#FFD700
- editorBracketHighlight.foreground5#8B5CF6
- editorBracketHighlight.foreground6#14B8A6
- editorBracketMatch.background#14B8A620
- editorBracketMatch.border#14B8A680
- editorCursor.foreground#FFD700
- editorError.foreground#EF4444
- editorGroupHeader.tabsBackground#13141f
- editorGroupHeader.tabsBorder#13141f
- editorGutter.addedBackground#16A34A
- editorGutter.background#0f1023
- editorGutter.deletedBackground#EF4444
- editorGutter.modifiedBackground#60A5FA
- editorHint.foreground#22C55E
- editorIndentGuide.activeBackground1#3a3c58
- editorIndentGuide.background1#1a1b2e
- editorInfo.foreground#60A5FA
- editorLineNumber.activeForeground#7a7c98
- editorLineNumber.foreground#2d2f47
- editorOverviewRuler.addedForeground#16A34A
- editorOverviewRuler.border#0f1023
- editorOverviewRuler.deletedForeground#EF4444
- editorOverviewRuler.errorForeground#EF4444
- editorOverviewRuler.findMatchForeground#FFD700
- editorOverviewRuler.modifiedForeground#60A5FA
- editorOverviewRuler.selectionHighlightForeground#8B5CF6
- editorOverviewRuler.warningForeground#FFD700
- editorWarning.foreground#FFD700
- editorWhitespace.foreground#3a3c58
- errorForeground#EF4444
- focusBorder#8B5CF660
- foreground#e8e8f0
- gitDecoration.addedResourceForeground#22C55E
- gitDecoration.conflictingResourceForeground#EC4899
- gitDecoration.deletedResourceForeground#EF4444
- gitDecoration.ignoredResourceForeground#3a3c58
- gitDecoration.modifiedResourceForeground#60A5FA
- gitDecoration.stageAddedResourceForeground#22C55E
- gitDecoration.stageDeletedResourceForeground#EF4444
- gitDecoration.stageModifiedResourceForeground#60A5FA
- gitDecoration.untrackedResourceForeground#FFD700
- icon.foreground#7a7c98
- input.background#13141f
- input.border#3a3c58
- input.foreground#e8e8f0
- input.placeholderForeground#5a5c78
- inputOption.activeBackground#FFD70020
- inputOption.activeBorder#FFD700
- inputOption.activeForeground#FFD700
- inputValidation.errorBackground#EF444420
- inputValidation.errorBorder#EF4444
- inputValidation.infoBackground#60A5FA20
- inputValidation.infoBorder#60A5FA
- inputValidation.warningBackground#FFD70020
- inputValidation.warningBorder#FFD700
- list.activeSelectionBackground#23253a
- list.activeSelectionForeground#e8e8f0
- list.errorForeground#EF4444
- list.focusBackground#23253a
- list.highlightForeground#FFD700
- list.hoverBackground#1a1b2e80
- list.inactiveSelectionBackground#1a1b2e
- list.warningForeground#FFD700
- menu.background#13141f
- menu.foreground#e8e8f0
- menu.selectionBackground#23253a
- menu.selectionForeground#e8e8f0
- menu.separatorBackground#3a3c58
- menubar.selectionBackground#1a1b2e
- menubar.selectionForeground#e8e8f0
- notificationLink.foreground#FF8500
- notifications.background#13141f
- notifications.border#3a3c58
- notifications.foreground#e8e8f0
- panel.background#0f1023
- panel.border#1a1b2e
- panelTitle.activeBorder#FFD700
- panelTitle.activeForeground#e8e8f0
- panelTitle.inactiveForeground#5a5c78
- peekView.border#8B5CF6
- peekViewEditor.background#13141f
- peekViewEditor.matchHighlightBackground#FFD70030
- peekViewResult.background#0f1023
- peekViewResult.fileForeground#e8e8f0
- peekViewResult.lineForeground#7a7c98
- peekViewResult.matchHighlightBackground#FFD70030
- peekViewResult.selectionBackground#1a1b2e
- peekViewResult.selectionForeground#e8e8f0
- peekViewTitle.background#0f1023
- peekViewTitleDescription.foreground#7a7c98
- peekViewTitleLabel.foreground#e8e8f0
- progressBar.background#8B5CF6
- scrollbar.shadow#0f1023
- scrollbarSlider.activeBackground#8B5CF640
- scrollbarSlider.background#3a3c5860
- scrollbarSlider.hoverBackground#3a3c5890
- selection.background#8B5CF630
- sideBar.background#13141f
- sideBar.border#1a1b2e
- sideBar.foreground#e8e8f0
- sideBarSectionHeader.background#13141f
- sideBarSectionHeader.border#1a1b2e
- sideBarSectionHeader.foreground#5a5c78
- sideBarTitle.foreground#5a5c78
- statusBar.background#0f1023
- statusBar.border#1a1b2e
- statusBar.debuggingBackground#FF8500
- statusBar.debuggingForeground#0f1023
- statusBar.foreground#7a7c98
- statusBar.noFolderBackground#0f1023
- statusBarItem.hoverBackground#1a1b2e
- statusBarItem.remoteBackground#8B5CF6
- statusBarItem.remoteForeground#ffffff
- tab.activeBackground#0f1023
- tab.activeBorder#FFD700
- tab.activeForeground#e8e8f0
- tab.border#13141f
- tab.hoverBackground#1a1b2e
- tab.inactiveBackground#13141f
- tab.inactiveForeground#5a5c78
- terminal.ansiBlack#13141f
- terminal.ansiBlue#60A5FA
- terminal.ansiBrightBlack#5a5c78
- terminal.ansiBrightBlue#93C5FD
- terminal.ansiBrightCyan#5EEAD4
- terminal.ansiBrightGreen#4ADE80
- terminal.ansiBrightMagenta#F472B6
- terminal.ansiBrightRed#FCA5A5
- terminal.ansiBrightWhite#f0f0f8
- terminal.ansiBrightYellow#FDE047
- terminal.ansiCyan#14B8A6
- terminal.ansiGreen#22C55E
- terminal.ansiMagenta#EC4899
- terminal.ansiRed#EF4444
- terminal.ansiWhite#e8e8f0
- terminal.ansiYellow#FFD700
- terminal.background#0f1023
- terminal.foreground#e8e8f0
- terminal.selectionBackground#8B5CF630
- terminalCursor.foreground#FFD700
- textLink.activeForeground#FFB347
- textLink.foreground#FF8500
- titleBar.activeBackground#0f1023
- titleBar.activeForeground#7a7c98
- titleBar.border#13141f
- titleBar.inactiveBackground#0f1023
- titleBar.inactiveForeground#3a3c58
- widget.shadow#0f102380
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #5a5c78 | italic |
| string, string.quoted, string.template | #FFD700 | — |
| constant.character.escape, string.regexp | #FF8500 | — |
| constant.numeric | #EC4899 | — |
| constant.language | #EC4899 | italic |
| keyword, keyword.control, keyword.operator.new, keyword.operator.delete, keyword.operator.typeof, keyword.operator.void, keyword.operator.in, keyword.operator.of, storage, storage.type | #60A5FA | — |
| keyword.operator, punctuation.separator | #7a7c98 | — |
| entity.name.function, meta.function-call.generic, support.function | #22C55E | — |
| variable.parameter | #14B8A6 | italic |
| entity.name.class, entity.name.type, entity.other.inherited-class, support.class | #8B5CF6 | — |
| entity.name.type.alias, entity.name.type.interface, meta.type.annotation, support.type | #14B8A6 | — |
| meta.decorator, punctuation.decorator, entity.name.function.decorator | #FF8500 | — |
| variable, variable.other | #e8e8f0 | — |
| variable.other.object.property, meta.object-literal.key, support.variable.property | #9898b8 | — |
| variable.other.constant, variable.other.enummember | #EC4899 | — |
| entity.name.namespace, entity.name.module, variable.other.module | #60A5FA | — |
| keyword.control.import, keyword.control.export | #60A5FA | — |
| variable.other.readwrite.alias | #e8e8f0 | — |
| entity.name.tag | #EC4899 | — |
| entity.other.attribute-name | #14B8A6 | — |
| string.quoted.double.html, string.quoted.single.html | #FFD700 | — |
| punctuation.definition.tag, meta.tag.sgml | #5a5c78 | — |
| entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css | #22C55E | — |
| support.type.property-name.css | #60A5FA | — |
| support.constant.property-value.css, constant.other.color.rgb-value.css | #FFD700 | — |
| keyword.other.unit.css | #EC4899 | — |
| keyword.control.at-rule | #8B5CF6 | — |
| support.type.property-name.json | #60A5FA | — |
| string.quoted.double.json | #FFD700 | — |
| constant.language.json | #EC4899 | italic |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown | #60A5FA | bold |
| markup.bold | #FFD700 | bold |
| markup.italic | #EC4899 | italic |
| markup.inline.raw, markup.fenced_code.block | #22C55E | — |
| string.other.link.title.markdown | #8B5CF6 | — |
| markup.underline.link.markdown | #14B8A6 | — |
| markup.quote | #5a5c78 | italic |
| punctuation.definition.list.begin.markdown | #8B5CF6 | — |
| punctuation.definition.block, punctuation.section, meta.brace | #7a7c98 | — |
| invalid | #EF4444 | underline |
| markup.inserted | #22C55E | — |
| markup.deleted | #EF4444 | — |
| markup.changed | #60A5FA | — |