Oriole Themes

Name: Oriole Themes
Author: ZushiH

Publisher: ZushiHThemes in package: 4

Warm amber/honey theme family — Light, Light Contrast, Night, Honey. Tuned for Ruby/Rails, Vue, JS and Svelte.

Open in VS Code GitHub

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Oriole Themes — Oriole Light Contrast

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.ts

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#eeab46
activityBar.border#d49a30
activityBar.foreground#3a2c14
activityBar.inactiveForeground#00000066
activityBarBadge.background#8f3f00
activityBarBadge.foreground#fff4dd
badge.background#8f3f00
badge.foreground#fff4dd
button.background#8f3f00
button.foreground#fff4dd
button.hoverBackground#8f3f00
contrastBorder#d49a30
diffEditor.insertedTextBackground#4a6a1c22
diffEditor.removedTextBackground#b03a1a22
dropdown.background#f4b850
dropdown.border#d49a30
editor.background#fec95c
editor.foreground#3a2c14
editor.lineHighlightBackground#0000001a
editor.selectionBackground#b57d2966
editor.selectionHighlightBackground#0000000d
editor.wordHighlightBackground#0000000d
editorBracketMatch.background#00000012
editorBracketMatch.border#8f3f00
editorCursor.foreground#8f3f00
editorError.foreground#8f2d12
editorGroupHeader.tabsBackground#f7bd52
editorGroupHeader.tabsBorder#d49a30
editorGutter.addedBackground#3a5613
editorGutter.deletedBackground#8f2d12
editorGutter.modifiedBackground#2d4653
editorHoverWidget.background#f4b850
editorHoverWidget.border#d49a30
editorIndentGuide.activeBackground1#8f3f00
editorIndentGuide.background1#00000014
editorInfo.foreground#2d4653
editorLineNumber.activeForeground#6f4519
editorLineNumber.foreground#c8912f
editorSuggestWidget.background#f4b850
editorSuggestWidget.selectedBackground#d4942f
editorWarning.foreground#6d4310
editorWhitespace.foreground#0000001a
editorWidget.background#f4b850
editorWidget.border#d49a30
errorForeground#8f2d12
focusBorder#8f3f00
foreground#3a2c14
gitDecoration.conflictingResourceForeground#8f3f00
gitDecoration.deletedResourceForeground#8f2d12
gitDecoration.ignoredResourceForeground#00000055
gitDecoration.modifiedResourceForeground#6d4310
gitDecoration.untrackedResourceForeground#3a5613
input.background#f4b850
input.border#d49a30
input.foreground#3a2c14
input.placeholderForeground#00000066
list.activeSelectionBackground#d4942f
list.activeSelectionForeground#3a2c14
list.focusBackground#d4942f
list.highlightForeground#8f3f00
list.hoverBackground#f2b85266
list.inactiveSelectionBackground#f2b85266
minimap.background#fec95c
minimapSlider.background#00000014
panel.background#f1b34e
panel.border#d49a30
panelTitle.activeBorder#8f3f00
panelTitle.activeForeground#3a2c14
peekViewEditor.background#f7bd52
peekViewResult.background#f1b34e
progressBar.background#8f3f00
scrollbarSlider.activeBackground#00000044
scrollbarSlider.background#00000020
scrollbarSlider.hoverBackground#00000033
selection.background#b57d2966
sideBar.background#f1b34e
sideBar.border#d49a30
sideBar.foreground#3a2c14
sideBarSectionHeader.background#f7bd52
sideBarTitle.foreground#3a2c14
statusBar.background#f0ad48
statusBar.border#d49a30
statusBar.debuggingBackground#8f3f00
statusBar.debuggingForeground#fff4dd
statusBar.foreground#3a2c14
statusBar.noFolderBackground#f0ad48
tab.activeBackground#fec95c
tab.activeBorderTop#8f3f00
tab.activeForeground#3a2c14
tab.border#d49a30
tab.inactiveBackground#f1b34e
tab.inactiveForeground#00000099
terminal.ansiBlack#4a3a1e
terminal.ansiBlue#2d4653
terminal.ansiBrightBlack#6e5a2a
terminal.ansiBrightBlue#2d4653
terminal.ansiBrightCyan#2d4653
terminal.ansiBrightGreen#3a5613
terminal.ansiBrightMagenta#6f4519
terminal.ansiBrightRed#8f2d12
terminal.ansiBrightWhite#3a2c14
terminal.ansiBrightYellow#8f3f00
terminal.ansiCyan#2d4653
terminal.ansiGreen#3a5613
terminal.ansiMagenta#6f4519
terminal.ansiRed#8f2d12
terminal.ansiWhite#3a2c14
terminal.ansiYellow#6d4310
terminal.background#fec95c
terminal.foreground#3a2c14
textLink.activeForeground#8f3f00
textLink.foreground#2d4653
titleBar.activeBackground#eeab46
titleBar.activeForeground#3a2c14
titleBar.border#d49a30
titleBar.inactiveBackground#eeab46

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
keyword, keyword.control, storage, storage.type, storage.modifier, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, variable.language, keyword.other.special-method, keyword.control.directive, entity.name.tag, meta.tag.sgml, punctuation.definition.tag, keyword.control.svelte, entity.other.keyword.directive, punctuation.section.embedded	#8f3f00	—
string, string.quoted, string.template, string.interpolated, string.regexp, constant.other.symbol, constant.other.symbol.ruby, punctuation.definition.string	#3a5613	—
entity.name.function, entity.name.method, support.function, meta.function-call, variable.function, meta.definition.method	#2d4653	—
entity.name.type, entity.name.class, entity.name.type.class, entity.other.inherited-class, support.class, support.type, entity.name.namespace, entity.name.type.module, variable.other.constant.ruby, entity.name.tag.component	#6f4519	—
constant.numeric, constant.language, constant.language.boolean, constant.language.null, support.constant, variable.other.constant	#6d4310	—
variable, variable.other, variable.parameter, variable.other.readwrite, variable.other.property, variable.other.object.property, variable.other.readwrite.instance.ruby, meta.object-literal.key, entity.other.attribute-name, support.type.property-name	#463514	—
comment, punctuation.definition.comment, string.comment	#585129	italic
punctuation, meta.brace, keyword.operator, punctuation.separator, punctuation.terminator, punctuation.definition.template-expression	#3a2c14	—