Dark Plus Darcula Themes

Name: Dark Plus Darcula Themes
Author: Oasin Lyu

Publisher: Oasin LyuThemes in package: 2

Ports the flavor of JetBrains Darcula into Code

Open in VS Code GitHub

Color themes

VS Code preview

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

Dark Plus Darcula Themes — Dark Plus Darcula (IntelliJ imitation)

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#2D2F30
activityBar.activeBorder#3C3F41
activityBar.activeFocusBorder#3C3F41
activityBar.background#3C3F41
activityBar.border#00000030
activityBar.dropBorder#BBBBBB
activityBar.foreground#E8E8E8
activityBar.inactiveForeground#BBBBBB
activityBarBadge.background#3C3F41
activityBarBadge.foreground#E8E8E8
badge.background#FFFFFF30
badge.foreground#E8E8E8
banner.background#3C3F41
breadcrumb.background#3C3F41
debugToolBar.background#3C3F41
editor.background#2B2B2B
editor.foreground#A9B7C6
editor.lineHighlightBackground#A0CCFF0B
editor.selectionBackground#007FD450
editorGroup.emptyBackground#3C3F41
editorGroupHeader.noTabsBackground#3C3F41
editorGroupHeader.tabsBackground#3C3F41
editorGutter.background#313335
editorHoverWidget.border#00000030
editorIndentGuide.activeBackground#FFFFFF20
editorIndentGuide.background#FFFFFF10
editorLineNumber.activeForeground#A4A3A3
editorLineNumber.foreground#606366
editorSuggestWidget.border#00000030
editorSuggestWidget.foreground#C0C1C2
editorSuggestWidget.selectedBackground#FFFFFF1A
editorSuggestWidget.selectedForeground#E8E8E8
editorSuggestWidget.selectedIconForeground#C0C1C2
editorWidget.background#313335
icon.foreground#BBBBBB
input.background#FFFFFF10
list.activeSelectionBackground#FFFFFF1A
list.activeSelectionForeground#E8E8E8
list.activeSelectionIconForeground#E8E8E8
list.hoverBackground#00000000
list.inactiveSelectionBackground#FFFFFF1A
list.inactiveSelectionForeground#C0C1C2
list.inactiveSelectionIconForeground#BBBBBB
menu.background#3C3F41
menu.foreground#BBBBBB
menu.selectionBackground#1177BBCC
menu.separatorBackground#FFFFFF30
menubar.selectionBackground#FFFFFF0B
menubar.selectionForeground#E8E8E8
notebook.cellBorderColor#E8E8E8
notebook.selectedCellBackground#BBBBBB
scrollbar.shadow#00000030
scrollbarSlider.activeBackground#FFFFFF30
scrollbarSlider.background#FFFFFF1A
scrollbarSlider.hoverBackground#FFFFFF2A
sideBar.background#3C3F41
sideBar.border#00000030
sideBar.dropBackground#FFFFFF30
sideBar.foreground#BBBBBB
sideBarSectionHeader.background#3C3F41
sideBarSectionHeader.border#00000030
sideBarSectionHeader.foreground#C0C1C2
sideBarTitle.foreground#C0C1C2
statusBar.background#3C3F41
statusBar.border#00000030
statusBar.debuggingBackground#3C3F41
statusBar.debuggingBorder#00000030
statusBar.debuggingForeground#BBBBBB
statusBar.foreground#BBBBBB
statusBar.noFolderBackground#3C3F41
statusBar.noFolderBorder#00000030
statusBar.noFolderForeground#BBBBBB
tab.activeBackground#4E5254
tab.activeBorder#1177BB
tab.activeForeground#BBBBBB
tab.border#3C3F41
tab.hoverBackground#0000005A
tab.hoverForeground#BBBBBB
tab.inactiveBackground#3C3F41
tab.inactiveForeground#BBBBBB
tab.lastPinnedBorder#FFFFFF1A
terminal.tab.activeBorder#35DB35
titleBar.activeBackground#3C3F41
titleBar.activeForeground#BBBBBB
titleBar.border#00000030
titleBar.inactiveBackground#3C3F41
titleBar.inactiveForeground#D8D8D850
widget.shadow#00000030

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
emphasis	—	italic
strong	—	bold
markup.underline	—	underline
markup.bold, markup.heading	—	bold
markup.italic	—	italic
markup.inserted	#A5C261	—
markup.deleted	#D16969	—
markup.changed	#6897BB	—
markup.inline.raw	#719161	—
meta.embedded, source.groovy.embedded, header	#A9B7C6	—
entity.name.function.preprocessor, entity.name.variable.preprocessor.symbol	#CC7832	—
meta.preprocessor.numeric	#6897BB	—
meta.diff.header	#A9B7C6	—
invalid	#CF4444	—
comment	#808080	—
comment.block.documentation, string.quoted.docstring.multi.python	#629755	—
string, string.value, string.tag, meta.embedded.assembly	#719161	—
keyword, keyword.language	#CC7832	—
keyword.operator	#A9B7C6	—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator	#CC7832	—
storage.type.function, storage.type.var, storage.type.const	#CC7832	—
keyword.other.unit	#A5C261	—
variable.language	#CC7832	—
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike, keyword.operator.noexcept	#CC7832	—
keyword.type, storage.type.built-in, storage.type.built-in.primitive, storage.type.basic, storage.type.primitive, storage.modifier, storage.type.modifier	#CC7832	—
keyword.other	#CC7832	—
punctuation.definition.decorator	#A9B7C6	—
punctuation.section.embedded.begin, punctuation.section.embedded.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.definition.interpolation.begin, punctuation.definition.interpolation.end, storage.type.function.arrow	#A9B7C6	—
variable.other.property, entity.name.variable.field, entity.name.variable.property, entity.name.variable.event	#9876AA	—
constant.numeric, constant.language, constant.character	#6897BB	—
variable.other.constant, variable.other.enummember, constant.other.enum, support.constant	#9876AA	italic
constant.character.escape	#CC7832	—
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal	#DAAE67	—
string.regexp, constant.regexp	#719161	—
keyword.operator.quantifier.regexp	#6897BB	—
keyword.operator.or.regexp, keyword.operator.negation.regexp, keyword.operator.disjunction.regexp, keyword.control.anchor.regexp	#CC7832	—
support.other.match.begin.regexp, support.other.match.end.regexp	#CC7832	—
keyword.operator.lookbehind.regexp, keyword.operator.lookahead.regexp, keyword.operator.lookbehind.negative.regexp, keyword.operator.lookahead.negative.regexp	#E8BF6A	—
punctuation.parenthesis.begin.regexp, punctuation.parenthesis.end.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, punctuation.definition.character-class.regexp	#E8BF6A	—
punctuation.terminator, punctuation.separator.comma, punctuation.separator.list.comma, punctuation.separator.delimiter	#CC7832	—
punctuation.separator.colon	#A9B7C6	—
variable.argument	#A9B7C6	—
entity.name.label, entity.name.tag	#E8BF6A	—
punctuation.definition.tag	#E8BF6A	—
entity.other.attribute-name	#BABABA	—
source.cpp storage.type.extern, source.cpp storage.type.struct, source.cpp storage.type.union, source.cpp storage.type.enum, source.cpp storage.type.template, source.cpp storage.type.asm, source.cpp storage.type.decltype	#CC7832	—
source.cpp entity.name.other.preprocessor.macro	#CC7832	—
variable.parameter.function.language.special.python	#9876AA	—
variable.parameter.function-call.python	#AF5635	—
support.variable.magic.python, support.function.magic.python	#A552A5	—
source.python support.type, source.python meta.function-call.arguments support.type, source.python meta.function-call support.function.builtin, source.python meta.item-access meta.item-access.arguments support.type	#8888C6	—
source.python punctuation.section.function.begin, source.python meta.function-call.python, constant.character.format.placeholder.other.python	#A9B7C6	—
source.python string.quoted.binary.single, source.python string.quoted.binary.single punctuation.definition.string.begin, source.python string.quoted.binary.single punctuation.definition.string.end, source.python string.quoted.binary.single storage.type.string	#A5C261	—
source.python support.type.exception, source.python meta.class.inheritance support.type.exception, source.python meta.class.inheritance support.type.metaclass	#8888C6	—
storage.type.is.gdscript, variable.language.gdscript	#CC7832	—
meta.signal.gdscript entity.name.function	#DAAE67	bold
meta.literal.nodepath.gdscript, meta.literal.nodepath.gdscript keyword.control.flow, meta.literal.nodepath.gdscript constant.character.escape	#78acaa	—
meta.literal.nodepath.gdscript constant.character.escape variable.other.enummember	#CC7832	—
entity.name.function.decorator.gdscript	#CC7832	italic
meta.preprocessor.cs	#CC7832	—
string.unquoted.preprocessor.message.cs	#A9B7C6	—
source.go entity.name.type, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go	#CC7832	—
entity.name.package.go	#AFBF7E	—
punctuation.other.comma.go	#CC7832	—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java	#A9B7C6	—
meta.tag string.unquoted.html, meta.tag string.quoted.single.html, meta.tag string.quoted.double.html, meta.tag punctuation.separator.key-value.html	#A5C261	—
meta.tag.custom entity.name.tag.html, meta.tag.other.unrecognized entity.name.tag.html	#26BDA4	—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php	#E8BF6A	—
storage.type.js	#CC7832	—
storage.type.ts, storage.type.type.ts, storage.type.class, storage.type.interface.ts, storage.type.enum.ts, storage.type.namespace.ts, storage.modifier.ts	#CC7832	—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, entity.other.inherited-class	#A9B7C6	—
storage.type.tsx	#CC7832	—
storage.type.glsl, storage.type.basic.hlsl, storage.type.structured.hlsl, storage.type.structure.shaderlab	#CC7832	—
support.type.basic.shaderlab	#DAAE67	—
source.css entity.other.attribute-name	#E8BF6A	—
entity.other.attribute-name.class.css	#E8BF6A	—
entity.other.attribute-name.id.css	#E8BF6A	bold
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css	#E8BF6A	italic
source.css meta.selector keyword.operator, source.css meta.selector punctuation.definition.entity	#A9B7C6	—
meta.property-name.css	#BABABA	—
support.type.vendored.property-name.css	—	italic
meta.property-value.css	#A9B7C6	—
source.css constant.other.color.rgb-value, source.css constant.other.rgb-value	#6897BB	—
constant.other.unicode-range.css	#6897BB	—
variable.parameter.url.css	#287BDE	—
keyword.other.important.css	—	bold
support.type.property-name.json	#9876AA	—
support.constant.json	#A9B7C6	—
source.json punctuation.separator	#CC7832	—
entity.name.tag.yaml	#9876AA	—
storage.type.tag-handle.yaml, storage.type.tag-handle.yaml	#BBB529	—
source.yaml punctuation.separator, source.yaml punctuation.definition.directive	#CC7832	—
source.yaml entity.name.type.anchor, source.yaml variable.other.alias	#D0D0FF	—
constant.numeric.yaml-version.yaml	#A9B7C6	—
punctuation.definition.quote.begin.markdown	#719161	—
punctuation.definition.list.begin.markdown	#E8BF6A	—
markup.fenced_code.block.markdown	#808080	—

Shiki preview

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

export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id  
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}