Pink Pixel Sweet Themes
Publisher: Pink PixelThemes in package: 10
Candy-coated and contrast-heavy dark themes for Visual Studio Code by Pink Pixel.
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#212022fc
- activityBar.border#ff6eb1
- activityBar.foreground#02ffc0
- activityBar.inactiveForeground#81f1d5
- activityBarBadge.background#ff6eb1
- activityBarBadge.foreground#ffffff
- badge.background#ff6eb1
- badge.foreground#ffffff
- button.background#af3a70
- button.foreground#ffffff
- button.hoverBackground#6F2c32
- dropdown.background#212022fc
- dropdown.border#ff6eb1
- dropdown.foreground#dce8e9
- editor.background#1c1b1dfc
- editor.foreground#dce8e9
- editor.lineHighlightBackground#353030
- editor.selectionBackground#6F2c32
- editor.selectionHighlightBackground#af3a7040
- editorCursor.foreground#FFFFFF
- editorGroup.border#ff6eb1
- editorGroupHeader.tabsBackground#212022fc
- editorGroupHeader.tabsBorder#ff6eb1
- editorGutter.addedBackground#ff6eb1
- editorGutter.background#212022fc
- editorGutter.deletedBackground#ff6eb1
- editorGutter.foldingControlForeground#ff6eb1
- editorGutter.modifiedBackground#ff6eb1
- editorIndentGuide.activeBackground1#353030
- editorIndentGuide.background1#353030
- editorLineNumber.activeForeground#ffffff
- editorLineNumber.foreground#ac88ff
- editorWhitespace.foreground#3F2D2D
- input.background#211e1e
- input.border#ff6eb1
- input.foreground#dce8e9
- inputOption.activeBorder#ff6eb1
- list.activeSelectionBackground#af3a70
- list.activeSelectionForeground#ffffff
- list.focusBackground#af3a70
- list.hoverBackground#353030
- list.inactiveSelectionBackground#6F2c32
- menu.background#212022fc
- menu.foreground#dce8e9
- menu.selectionBackground#af3a70
- menu.selectionForeground#ffffff
- menu.separatorBackground#02ffc0
- menubar.selectionBackground#af3a70
- menubar.selectionForeground#ffffff
- panel.background#212022fc
- panel.border#ffff63
- panelTitle.activeForeground#ffffff
- panelTitle.inactiveForeground#81f1d5
- progressBar.background#02ffc0
- scrollbar.shadow#00000000
- scrollbarSlider.activeBackground#02ffc080
- scrollbarSlider.background#02ffc040
- scrollbarSlider.hoverBackground#02ffc060
- sideBar.background#212022fc
- sideBar.border#ff6eb1
- sideBar.foreground#dce8e9
- sideBarSectionHeader.background#2a2a2a
- sideBarSectionHeader.border#ff6eb1
- sideBarSectionHeader.foreground#02ffc0
- sideBarTitle.foreground#02ffc0
- statusBar.background#212022fc
- statusBar.border#ff6eb1
- statusBar.debuggingBackground#af3a70
- statusBar.foreground#ffff63
- statusBar.noFolderBackground#212022fc
- statusBarItem.prominentBackground#af3a70
- statusBarItem.prominentHoverBackground#6F2c32
- tab.activeBackground#211e1efc
- tab.activeBorder#ff6eb1
- tab.activeForeground#02ffc0
- tab.border#ff6eb1
- tab.inactiveBackground#2a2a2a
- tab.inactiveForeground#ac88ff
- titleBar.activeBackground#212022fc
- titleBar.activeForeground#ffff63
- titleBar.border#ff6eb1
- titleBar.inactiveBackground#2a2a2a
- titleBar.inactiveForeground#ac88ff
- widget.shadow#00000040
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment | #ac88ff | — |
| string | #32d9ff | — |
| constant.numeric | #CCCCCC | — |
| keyword, keyword.control.js | #02ffc0 | — |
| meta.preprocessor | #ffff63 | — |
| keyword.control.import | #dce8e9 | bold |
| support.function | #02ffc0 | — |
| declaration.function function-result | #ffff63 | — |
| declaration.function function-name | #dce8e9 | bold |
| declaration.function argument-name | #dce8e9 | bold |
| declaration.function function-arg-type | #ffff63 | — |
| declaration.function function-argument | #dce8e9 | italic |
| declaration.class class-name | #dce8e9 | underline |
| declaration.class class-inheritance | #dce8e9 | italic underline |
| comment.merge-marker.yours, comment.merge-marker.end, comment.merge-marker.theirs | #32d9ff | — |
| invalid.warning | #ffffff | — |
| invalid | #FFF9F9 | bold |
| invalid.deprecated.trailing-whitespace | #dce8e9 | — |
| declaration.section section-name | #dce8e9 | italic |
| string.interpolation | #ff6268 | — |
| string.regexp | #666666 | — |
| variable | #ff6eb1 | — |
| constant, support.constant | #ac88ff | — |
| constant.character | #32d9ff | — |
| constant.language | #ffff63 | bold |
| embedded | #dce8e9 | underline |
| keyword.markup.element-name | #ac88ff | — |
| keyword.markup.attribute-name, entity.name.type.attribute-name | #ff6eb1 | — |
| meta.attribute-with-value | #ff6eb1 | — |
| keyword.exception | #C82255 | bold |
| keyword.operator | #30ffc1 | — |
| keyword.control | #ffff63 | bold |
| support.constant.tm-language-def, support.constant.name.tm-language-def | #ac88ff | — |
| meta.tag.preprocessor.xml | #68685B | — |
| meta.tag.sgml.doctype | #888888 | — |
| string.quoted.docinfo.doctype.DTD | #dce8e9 | italic |
| comment.other.server-side-include.xhtml, comment.other.server-side-include.html | #909090 | — |
| text.html declaration.tag, text.html meta.tag, source.scss entity.name.tag, text.html entity.name.tag.xhtml | #02ffc0 | — |
| keyword.other.phpdoc.php | #777777 | — |
| keyword.other.include.php | #C82255 | — |
| support.constant.core.php | #ffba5a | bold |
| support.constant.std.php | #ffba5a | bold |
| variable.other.global.php | #B72E1D | — |
| variable.other.global.safer.php | #02ffc0 | — |
| string.quoted.single.php | #bef4f8 | — |
| keyword.storage.php | #ac88ff | — |
| string.quoted.double.php | #bef4f8 | — |
| entity.other.attribute-name.id.css | #ffba5a | — |
| entity.name.tag.css | #bfff3e | bold |
| entity.other.attribute-name.class.css | #ffff63 | — |
| entity.other.attribute-name.pseudo-class.css | #32d9ff | — |
| invalid.bad-comma.css | #FFFFFF | — |
| support.constant.property-value.css | #d2679a | — |
| support.type.property-name.css, storage.modifier | #ffff63 | — |
| support.constant.font-name.css | #bef4f8 | — |
| keyword.other.unit.css | #ac88ff | — |
| string.quoted.single.js | #32d9ff | — |
| string.quoted.double.js | #C1538A | — |
| keyword.operator.new.js | #02ffc0 | — |
| storage.type | #02ffc0 | — |
| comment.line.number-sign.r | #32d9ff | italic |
| comment.line.number-sign-tick.r | #ff6268 | italic |
| comment.line.number-sign-plus.r | #ac88ff | italic |
| markup.raw.block.markdown | #dce8e9 | — |
Shiki preview
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...