Skip to main content
Coding Theme

Syntax on the Rocks

Publisher: Devam SharmaThemes in package: 1

Pour a smooth, late-night coding experience. Syntax on the Rocks brings the vibrant yet relaxed energy of local nightlife straight to your editor. Inspired by the moody atmospheres and neon accents of evening happy hours, this theme delivers a perfectly balanced dark mode. It features deep, muted b

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#0B0C10
  • activityBar.foreground#c4b8b0
  • activityBar.inactiveForeground#8a7d75
  • activityBarBadge.background#fb923c
  • activityBarBadge.foreground#020617
  • badge.background#f973162e
  • badge.foreground#fdba74
  • button.background#fdba74
  • button.foreground#020617
  • button.hoverBackground#fb923c
  • dropdown.background#020617
  • dropdown.border#f973162e
  • dropdown.foreground#ffffff
  • editor.background#0f172a
  • editor.foreground#ffffff
  • editor.inactiveSelectionBackground#f9731626
  • editor.lineHighlightBackground#ffffff0f
  • editor.selectionBackground#f9731640
  • editorCursor.foreground#fdba74
  • editorGroup.border#f973162e
  • editorIndentGuide.activeBackground#f9731652
  • editorIndentGuide.background#f9731626
  • editorLineNumber.activeForeground#fdba74
  • editorLineNumber.foreground#8a7d75
  • editorLink.foreground#fdba74
  • editorWhitespace.foreground#334155
  • editorWidget.background#020617
  • editorWidget.border#f973162e
  • focusBorder#fdba74
  • input.background#ffffff0f
  • input.border#f973162e
  • input.foreground#ffffff
  • inputOption.activeBorder#fdba74
  • list.activeSelectionBackground#fdba74
  • list.activeSelectionForeground#020617
  • list.focusForeground#fdba74
  • list.hoverBackground#ffffff12
  • list.inactiveSelectionBackground#f973162e
  • list.inactiveSelectionForeground#ffffff
  • minimap.background#0f172a
  • notificationCenterHeader.background#020617
  • notifications.background#020617
  • notifications.border#f973162e
  • peekView.border#f9731640
  • peekViewTitle.background#020617
  • scrollbarSlider.activeBackground#fb923c
  • scrollbarSlider.background#f9731633
  • scrollbarSlider.hoverBackground#f9731652
  • sideBar.background#0B0C10
  • sideBar.foreground#c4b8b0
  • sideBarTitle.foreground#fdba74
  • statusBar.background#fb923c
  • statusBar.debuggingBackground#fdba74
  • statusBar.debuggingForeground#020617
  • statusBar.foreground#020617
  • statusBar.noFolderBackground#fb923c
  • tab.activeBackground#0f172a
  • tab.activeBorderTop#fdba74
  • tab.activeForeground#ffffff
  • tab.border#f9731626
  • tab.inactiveBackground#020617
  • tab.inactiveForeground#c4b8b0
  • terminal.background#0f172a
  • terminal.foreground#ffffff
  • terminalCursor.foreground#fdba74
  • titleBar.activeBackground#020617
  • titleBar.activeForeground#ffffff
  • titleBar.inactiveBackground#0B0C10
  • titleBar.inactiveForeground#c4b8b0
  • widget.shadow#00000066

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8a7d75italic
keyword, storage.type, storage.modifier#fdba74
string, punctuation.definition.string#fed7aa
entity.name.function, support.function#ffffff
entity.name.type, entity.name.class, support.type#fb923c
variable, meta.definition.variable#e2e8f0
constant.numeric, constant.language#fed7aa
Syntax on the Rocks by Devam Sharma - VS Code Theme