Vercel Docs Theme
Publisher: aurorascharffThemes in package: 2
Dark and light themes for VSCode/Cursor matching the Vercel docs syntax highlighting
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#fafafa
- activityBar.foreground#171717
- activityBarBadge.background#0070f3
- badge.background#0070f3
- badge.foreground#ffffff
- button.background#0070f3
- button.foreground#ffffff
- button.hoverBackground#0761d1
- dropdown.background#ffffff
- dropdown.border#eaeaea
- editor.background#ffffff
- editor.foreground#171717
- editor.lineHighlightBackground#f5f5f5
- editor.selectionBackground#d1e5ff
- editor.selectionHighlightBackground#d1e5ff80
- editorBracketHighlight.foreground1#171717
- editorBracketHighlight.foreground2#171717
- editorBracketHighlight.foreground3#171717
- editorBracketHighlight.foreground4#171717
- editorBracketHighlight.foreground5#171717
- editorBracketHighlight.foreground6#171717
- editorBracketHighlight.unexpectedBracket.foreground#171717
- editorBracketMatch.background#d1e5ff80
- editorBracketMatch.border#d1e5ff
- editorCursor.foreground#171717
- editorGroupHeader.tabsBackground#fafafa
- editorGutter.background#ffffff
- editorGutter.modifiedBackground#9a7b2d
- editorIndentGuide.activeBackground#c0c0c0
- editorIndentGuide.background#e0e0e0
- editorLineNumber.activeForeground#171717
- editorLineNumber.foreground#a0a0a0
- editorWhitespace.foreground#d4d4d4
- gitDecoration.addedResourceForeground#067a3d
- gitDecoration.modifiedResourceForeground#9a7b2d
- gitDecoration.stageDeletedResourceForeground#d6336c
- gitDecoration.stageModifiedResourceForeground#9a7b2d
- gitDecoration.untrackedResourceForeground#067a3d
- input.background#fafafa
- input.border#eaeaea
- input.foreground#171717
- list.activeSelectionBackground#d1e5ff
- list.activeSelectionForeground#171717
- list.errorForeground#d6336c
- list.hoverBackground#f0f0f0
- list.inactiveSelectionBackground#f0f0f0
- list.warningForeground#c27800
- panel.background#ffffff
- panel.border#eaeaea
- scrollbarSlider.activeBackground#909090
- scrollbarSlider.background#d4d4d480
- scrollbarSlider.hoverBackground#b0b0b0
- sideBar.background#fafafa
- sideBar.border#eaeaea
- sideBar.foreground#171717
- sideBarSectionHeader.background#fafafa
- sideBarTitle.foreground#171717
- statusBar.background#fafafa
- statusBar.debuggingBackground#fafafa
- statusBar.foreground#171717
- statusBar.noFolderBackground#fafafa
- statusBarItem.remoteBackground#0070f3
- statusBarItem.remoteForeground#ffffff
- tab.activeBackground#ffffff
- tab.activeForeground#171717
- tab.activeModifiedBorder#9a7b2d
- tab.border#eaeaea
- tab.inactiveBackground#fafafa
- tab.inactiveForeground#a0a0a0
- tab.inactiveModifiedBorder#9a7b2d
- terminal.ansiBlack#171717
- terminal.ansiBlue#0070f3
- terminal.ansiBrightBlack#666666
- terminal.ansiBrightBlue#0070f3
- terminal.ansiBrightCyan#0070f3
- terminal.ansiBrightGreen#067a3d
- terminal.ansiBrightMagenta#7c3aed
- terminal.ansiBrightRed#d6336c
- terminal.ansiBrightWhite#ffffff
- terminal.ansiBrightYellow#c27800
- terminal.ansiCyan#0070f3
- terminal.ansiGreen#067a3d
- terminal.ansiMagenta#7c3aed
- terminal.ansiRed#d6336c
- terminal.ansiWhite#fafafa
- terminal.ansiYellow#c27800
- terminal.background#ffffff
- terminal.foreground#171717
- terminal.selectionBackground#d1e5ff
- terminalCursor.background#ffffff
- terminalCursor.foreground#171717
- titleBar.activeBackground#fafafa
- titleBar.activeForeground#171717
- titleBar.inactiveBackground#fafafa
- titleBar.inactiveForeground#a0a0a0
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment | #6b7280 | — |
| keyword, storage.modifier, storage.type, keyword.control | #d6336c | |
| keyword.operator | #d6336c | — |
| string, string.quoted, punctuation.definition.string.begin, punctuation.definition.string.end | #067a3d | — |
| constant.character, variable.language.this | #4f46e5 | — |
| constant.language | #111111 | — |
| variable.other.constant | #0070f3 | — |
| variable.other.readwrite | #171717 | — |
| variable.other.object | #0070f3 | — |
| variable.other.readwrite.alias | #171717 | — |
| entity.name.function, support.function, meta.function-call | #0070f3 | |
| variable.parameter | #171717 | |
| entity.name.tag | #067a3d | — |
| support.class.component | #0070f3 | — |
| entity.other.attribute-name | #7c3aed | |
| string.regexp, string.interpolated | #067a3d | — |
| punctuation, meta.brace, punctuation.definition.tag.begin, punctuation.definition.tag.end, punctuation.definition.tag | #171717 | — |
| constant.numeric, constant.numeric.decimal | #111111 | — |
| support.variable.property, variable.other.property | #171717 | — |
| support.type.primitive, support.type | #0070f3 | |
| entity.name.type, entity.name.class, entity.other.inherited-class | #7c3aed | — |
| punctuation.separator.key-value | #d6336c | — |
| meta.object-literal.key.tsx | #171717 | — |
| meta.jsx.children.tsx | #171717 | — |
| punctuation.definition.string.template.begin, punctuation.definition.string.template.end, string.template | #067a3d | — |
| punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end | #d6336c | — |
| markup.underline.link, string.other.link | #067a3d | — |
| markup.bold | #d6336c | bold |
| markup.italic | — | italic |
| markup.heading, entity.name.section | #7c3aed | bold |
| markup.deleted | #d6336c | — |
| markup.inserted | #067a3d | — |
| invalid, invalid.illegal | #ff0000 | — |
| meta.tag.sgml.doctype, meta.tag.metadata | #a0a0a0 | — |
| support.type.property-name.json | #d6336c | — |
| entity.name.tag.yaml | #d6336c | — |
| string.unquoted.plain.out.yaml, string.unquoted.plain.in.yaml, string.unquoted.block.yaml | #067a3d | — |
| constant.language.boolean.yaml, constant.language.null.yaml, constant.language.merge.yaml | #111111 | — |
| constant.numeric.integer.yaml, constant.numeric.float.yaml | #111111 | — |
| punctuation.definition.block.sequence.item.yaml | #171717 | — |
| entity.other.document.begin.yaml, entity.other.document.end.yaml | #6b7280 | — |
| variable.other.alias.yaml, punctuation.definition.alias.yaml | #7c3aed | — |
| entity.name.type.anchor.yaml, punctuation.definition.anchor.yaml, keyword.control.property.anchor.yaml | #7c3aed | — |
| keyword.control.flow.block-scalar.literal.yaml, keyword.control.flow.block-scalar.folded.yaml | #d6336c | — |
| storage.type.tag-handle.yaml, constant.other.tag.yaml | #0070f3 | — |
| punctuation.separator.key-value.mapping.yaml | #d6336c | — |
| comment.line.number-sign.yaml | #6b7280 | — |