DDLC Chibi Themes
Publisher: DDLC FanThemes in package: 4
DDLC themes, cute Literature Club product icons, and Doki chibis for code-editor IDEs.
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#070e18
- activityBar.border#36b0e610
- activityBar.foreground#54b0d6
- activityBar.inactiveForeground#36b0e64b
- activityBarBadge.background#36b0e6
- activityBarBadge.foreground#070e18
- badge.background#36b0e6
- badge.foreground#070e18
- breadcrumb.activeSelectionForeground#54b0d6
- breadcrumb.focusForeground#54b0d6
- breadcrumb.foreground#36b0e687
- breadcrumbPicker.background#0f1c2ef0
- button.background#36b0e6bf
- button.foreground#070e18
- button.hoverBackground#54b0d6
- button.secondaryBackground#36b0e61c
- button.secondaryForeground#8ccce8
- button.secondaryHoverBackground#36b0e62f
- dropdown.background#0f1c2ee6
- dropdown.border#36b0e628
- dropdown.foreground#d0ecff
- editor.background#0b1524
- editor.findMatchBackground#36b0e64b
- editor.findMatchHighlightBackground#36b0e623
- editor.foreground#d6eefc
- editor.inactiveSelectionBackground#36b0e623
- editor.lineHighlightBackground#36b0e612
- editor.lineHighlightBorder#00000000
- editor.selectionBackground#36b0e63d
- editor.selectionHighlightBackground#36b0e617
- editor.wordHighlightBackground#36b0e61e
- editor.wordHighlightStrongBackground#36b0e62f
- editorCursor.foreground#54b0d6
- editorGroup.border#36b0e613
- editorGroupHeader.tabsBackground#070e18
- editorGutter.background#0b1524
- editorHoverWidget.background#0f1c2ef0
- editorHoverWidget.border#36b0e628
- editorIndentGuide.activeBackground1#36b0e646
- editorIndentGuide.background1#36b0e615
- editorLineNumber.activeForeground#54b0d6
- editorLineNumber.foreground#36b0e638
- editorSuggestWidget.background#0f1c2ee6
- editorSuggestWidget.border#36b0e62f
- editorSuggestWidget.highlightForeground#54b0d6
- editorSuggestWidget.selectedBackground#36b0e623
- editorWhitespace.foreground#36b0e61c
- editorWidget.background#0f1c2ecc
- editorWidget.border#36b0e628
- focusBorder#36b0e65a
- input.background#36b0e612
- input.border#36b0e628
- input.foreground#f0f9ff
- input.placeholderForeground#36b0e65a
- inputOption.activeBackground#36b0e62a
- inputOption.activeBorder#54b0d6
- list.activeSelectionBackground#36b0e62a
- list.activeSelectionForeground#f0f9ff
- list.focusBackground#36b0e623
- list.focusOutline#36b0e631
- list.highlightForeground#54b0d6
- list.hoverBackground#36b0e615
- list.inactiveSelectionBackground#36b0e619
- minimap.background#0b1524cc
- notificationCenterHeader.background#09111c
- notificationCenterHeader.foreground#54b0d6
- notifications.background#0f1c2ef0
- notifications.border#36b0e628
- panel.background#09111cf2
- panel.border#36b0e61a
- panelTitle.activeBorder#36b0e6
- panelTitle.activeForeground#54b0d6
- panelTitle.inactiveForeground#36b0e65a
- peekView.border#36b0e631
- peekViewEditor.background#0b1524e6
- peekViewResult.background#09111cf2
- peekViewTitle.background#09111c
- progressBar.background#54b0d6
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#36b0e631
- scrollbarSlider.background#36b0e617
- scrollbarSlider.hoverBackground#36b0e628
- selection.background#36b0e63d
- sideBar.background#09111cf2
- sideBar.border#36b0e613
- sideBar.foreground#d0ecff
- sideBarSectionHeader.background#36b0e60e
- sideBarSectionHeader.border#36b0e615
- sideBarSectionHeader.foreground#8ccce8
- sideBarTitle.foreground#54b0d6
- statusBar.background#0a1e38cc
- statusBar.border#36b0e61a
- statusBar.debuggingBackground#1a9fffb4
- statusBar.debuggingForeground#ffffff
- statusBar.foreground#8ccce8
- statusBar.noFolderBackground#0a1e38cc
- statusBarItem.hoverBackground#36b0e623
- statusBarItem.remoteBackground#36b0e6
- statusBarItem.remoteForeground#070e18
- tab.activeBackground#0b1524
- tab.activeBorderTop#36b0e6
- tab.activeForeground#54b0d6
- tab.border#36b0e610
- tab.hoverBackground#36b0e612
- tab.inactiveBackground#070e18cc
- tab.inactiveForeground#36b0e65a
- terminal.ansiBlue#36b0e6
- terminal.ansiBrightBlue#54b0d6
- terminal.ansiCyan#26e0c8
- terminal.ansiGreen#38e08a
- terminal.background#0b1524
- terminal.foreground#f0f9ff
- titleBar.activeBackground#070e18e6
- titleBar.activeForeground#54b0d6
- titleBar.border#36b0e610
- titleBar.inactiveBackground#050a12
- titleBar.inactiveForeground#36b0e64b
- toolbar.hoverBackground#36b0e61c
- widget.shadow#00000055
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #54b0d6 | italic |
| keyword, storage.type, storage.modifier | #8ccce8 | — |
| string, string.quoted | #c5ebff | — |
| constant.numeric | #2aa8ff | — |
| entity.name.function, support.function | #c5e8f8 | — |
| variable, variable.other | #c5ebff | — |
| entity.name.type, entity.name.class, support.class | #36b0e6 | — |
| constant, constant.language | #26e0c8 | — |
| keyword.operator | #8ccce8 | — |
| entity.name.tag | #36b0e6 | — |
| entity.other.attribute-name | #c5ebff | — |
| support.type.property-name | #8ccce8 | — |
| support.type.property-name.json | #36b0e6 | — |
| punctuation | #54b0d6 | — |
| keyword.control.import, keyword.control.export | #26e0c8 | — |