Gruvbox Themes
Publisher: Tom PhilbinThemes in package: 6
All gruvbox themes for Visual Studio Code.
All gruvbox themes for Visual Studio Code.
Full workbench mockup using this variant's colors and tokenColors.
Loading...
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #ebdbb280 | — |
| meta.group, meta.method-call.source.cs, meta.method.attribute.source.cs, meta.method.body.java, meta.method.body.source.cs, meta.method.source.cs, none, source, text | #f2e5bc | — |
| entity.quasi.element meta.group.braces, keyword.operator keyword.operator.neon, keyword.operator operator.neon, keyword.operator.accessor, keyword.other.accessor, meta.attribute-selector keyword.operator.stylus, meta.brace, meta.delimiter, meta.group.braces, meta.punctuation.separator, meta.separator, punctuation | #f2e5bc | — |
| comment, comment text, markup.strikethrough, punctuation.definition.comment, punctuation.whitespace.comment, string.comment, text.cancelled | #928374 | italic |
| comment.keyword, comment.keyword.punctuation | #d5c4a1 | — |
| comment.parameter, comment.punctuation, comment.string, comment.type, keyword.other.phpdoc.php, punctuation.definition.keyword.javadoc, source.groovy keyword.other.documentation, source.java keyword.other.documentation, storage.type.annotation.coffeescript, storage.type.class.jsdoc | #bdae93 | — |
| constant.language.name, entity.name.type, entity.other.inherited-class | #fabd2f | — |
| constant.other.placeholder, entity.name.tag.mustache, entity.tag.tagbraces, punctuation.definition.string.template, punctuation.definition.template-expression, punctuation.quasi, punctuation.section.embedded, string.interpolated, variable.other.interpolation.scss | #8ec07c | — |
| js.embedded.control.flow keyword.operator.js, keyword, keyword.control, keyword.operator.logical.python, meta.at-rule.media support.function.misc, meta.prolog.haml, meta.tag.sgml.doctype.html, storage.type.function.jade, storage.type.function.pug, storage.type.import.haxe, storage.type.import.include.jade, storage.type.import.include.pug, support.keyword.timing-direction, variable.documentroot | #fb4934 | — |
| keyword.control.at-rule support.type.property-vendor, punctuation.definition.keyword | #cc241d | — |
| keyword.control.new, keyword.control.operator, keyword.operator, keyword.other.arrow, keyword.other.double-colon, punctuation.operator | #8ec07c | — |
| constant.other.color punctuation.definition.constant, constant.other.symbol punctuation.definition.constant, constant.other.unit, keyword.other.unit, punctuation.section.flowtype, support.constant.unicode-range.prefix | #b16286 | — |
| storage, storage.type.annotation, storage.type.primitive | #fb4934 | — |
| storage.modifier.import, storage.modifier.package, storage.type.import, variable.import, variable.package | #f2e5bc | — |
| entity.quasi.tag.name, meta.function storage.type.matlab, storage.type.function | #8ec07c | — |
| entity.name.val.declaration, entity.name.variable, meta.definition.variable, storage.type.variable, support.type.custom-property, support.type.variable-name, variable, variable.interpolation variable, variable.other.interpolation variable, variable.parameter.dosbatch, variable.parameter.output.function.matlab, variable.parameter.sass | #83a598 | — |
| keyword.other.custom-property.prefix, punctuation.definition.custom-property, punctuation.definition.variable, support.constant.custom-property-name.prefix, variable.interpolation, variable.other.dollar punctuation.dollar, variable.other.object.dollar punctuation.dollar | #458588 | — |
| entity.name.function punctuation.dollar | #98971a | — |
| meta.property.object | #f2e5bc | — |
| constant.other.object.key string, meta.object-literal.key | #f2e5bc | — |
| meta.parameters, variable.parameter | #f2e5bc | — |
| variable.parameter.url | #b8bb26 | — |
| constant, constant.numeric, constant.other, constant.other.color, constant.other.symbol, support.constant, support.constant.color, support.constant.font-name, support.constant.media, support.constant.prototype, variable.language | #d3869b | — |
| variable.language punctuation.definition.variable | #b16286 | — |
| entity.name.constant, variable.other.constant | #fabd2f | — |
| constant.character.escape, constant.character.escaped, constant.character.quoted, constant.other.character-class.escape | #fb4934 | — |
| invalid | #f2e5bc | — |
| invalid keyword.other.custom-property.prefix, invalid support.type.custom-property.name | #f2e5bc | — |
| message.error | #fb4934 | — |
| meta.object-literal.key string, string | #b8bb26 | — |
| source.regexp, string.regexp | #b8bb26 | — |
| string.regexp punctuation.definition.string | #bdae93 | — |
| keyword.control.set.regexp, punctuation.definition.character-class, string.regexp.character-class.ruby | #d3869b | — |
| string.regexp.group | #f2e5bc | — |
| constant.other.assertion.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.group.capture.regexp | #83a598 | — |
| constant.other.character-class.escape.backslash.regexp, keyword.control.character-class.regexp, string.regexp.character-class constant.character.escape | #fabd2f | — |
| string.regexp.arbitrary-repetition, string.regexp.arbitrary-repetition punctuation | #8ec07c | — |
| constant.other.reference.link, string.other.link | #8ec07c | — |
| meta.image.inline punctuation.definition.string, meta.link.inline punctuation.definition.string, meta.link.reference punctuation.definition.constant, meta.link.reference.literal punctuation.definition.constant, meta.link.reference.literal punctuation.definition.string | #689d6a | — |
| punctuation.definition.tag | #83a598 | — |
| markup.heading | #b8bb26 | — |
| punctuation.definition.heading, punctuation.definition.identity | #98971a | — |
| markup.bold | #fe8019 | bold |
| punctuation.definition.bold | #d65d0e | bold |
| markup.italic | #fb4934 | italic |
| punctuation.definition.italic | #cc241d | italic |
| markup.raw.inline | #fabd2f | — |
| markup.raw.inline punctuation.definition.raw | #d79921 | — |
| markup.quote | #d3869b | — |
| markup.quote punctuation.definition.blockquote | #b16286 | — |
| markup.list | #83a598 | — |
| markup.list punctuation.definition.list_item | #458588 | — |
| meta.separator.markdown | #928374 | — |
| meta.function-call.constructor variable.type, support.class, support.type, variable.other.class | #fabd2f | — |
| support.class punctuation.dollar | #d79921 | — |
| entity.name.function.jade, entity.name.function.pug, keyword.other.special-method, meta.function-call variable.function, meta.function-call variable.other.dollar.only punctuation.dollar, support.function | #8ec07c | — |
| meta.function-call.method support.function, meta.function-call.method variable.function, meta.function-call.static variable.function, meta.method-call, meta.method-call support.function, meta.method-call variable.function, support.function.mutator | #689d6a | — |
| support.module | #d3869b | — |
| entity.name.accessor, entity.name.function, entity.name.label, entity.name.section | #b8bb26 | — |
| entity.name.module | #fe8019 | — |
| constant.id.tag, entity.name.tag.id, entity.other.attribute-name.id | #fe8019 | — |
| entity.other.attribute-name.id punctuation.definition.entity | #d65d0e | — |
| entity.name.tag.class, entity.other.attribute-name.class | #fabd2f | — |
| entity.other.attribute-name.class punctuation.definition.entity | #d79921 | — |
| meta.attribute-selector entity.other.attribute-name | #d79921 | — |
| constant.character.entity punctuation.definition.constant, constant.character.entity punctuation.definition.entity | #b16286 | — |
| entity.name.class, entity.name.type.class | #fabd2f | — |
| entity.name.function.neon, entity.name.namespace.wildcard, entity.name.tag, entity.tag, keyword.control.untitled, keyword.doctype.xml, keyword.operator support.other.neon, punctuation.definition.prolog.haml, source.less keyword.control.html.elements | #83a598 | — |
| entity.name.attribute-name, entity.other.attribute-name, meta.section.attributes.haml constant.other.symbol.ruby | #fabd2f | — |
| entity.other.attribute-name.placeholder punctuation.definition.entity, entity.other.attribute-name.pseudo-class, entity.other.attribute-name.pseudo-element, entity.other.attribute-name.tag.pseudo-class, entity.other.attribute-name.tag.pseudo-element, entity.other.pseudo-class, entity.other.pseudo-element, support.type.vendor-prefix | #d79921 | — |
| entity.function-name.stylus, entity.other.animation-keyframe.stylus, entity.other.animation-name, keyword.language.function.misc.stylus, meta.at-rule.keyframes entity.name.function, variable.other.animation-name | #8ec07c | — |
| entity.other.namespace-prefix | #8ec07c | — |
| meta.class.body, meta.tag | #f2e5bc | — |
| meta.image, meta.link | #d3869b | — |
| meta.image punctuation.definition.metadata, meta.link punctuation.definition.metadata | #b16286 | — |
| meta.require | #b8bb26 | — |
| constant.name.attribute.tag.jade, constant.name.attribute.tag.pug, meta.brace.round, meta.function-call meta.group punctuation.definition.group, punctuation.definition.method-parameters, punctuation.definition.parameters | #bdae93 | — |
| meta.property-name, support.type.property-name, support.type.shape.definition support.constant.property-value | #b8bb26 | — |
| meta.property-name support.type.vendor-prefix, support.type.property-name.media support.type.vendor-prefix | #98971a | — |
| constant.string.sass, meta.property-value, support.constant.property-value | #f2e5bc | — |
| meta.property-value support.type.vendor-prefix | #bdae93 | — |
| source.diff | #a89984 | — |
| meta.diff.header.from-file | #83a598 | — |
| punctuation.definition.from-file | #458588 | — |
| meta.diff.header.to-file | #d3869b | — |
| punctuation.definition.to-file | #b16286 | — |
| meta.diff.range, meta.toc-list.line-number | #fabd2f | — |
| punctuation.definition.range.diff | #d79921 | — |
| constant.numeric.line-number | #928374 | — |
| constant.numeric.line-number.match | #8ec07c | — |
| entity.name.filename | #b8bb26 | — |
| markup.deleted, punctuation.definition.deleted | #fb4934 | — |
| markup.inserted, punctuation.definition.inserted | #b8bb26 | — |
| markup.changed, punctuation.definition.changed | #fabd2f | — |
| markup.ignored | #928374 | — |
| markup.untracked | #928374 | — |
| brackethighlighter.tag | #bdae93 | — |
| brackethighlighter.curly | #bdae93 | — |
| brackethighlighter.round | #bdae93 | — |
| brackethighlighter.square | #bdae93 | — |
| brackethighlighter.angle | #bdae93 | — |
| brackethighlighter.quote | #bdae93 | — |
| brackethighlighter.unmatched | #fb4934 | — |
| sublimelinter.mark.error | #fb4934 | — |
| sublimelinter.gutter-mark | #928374 | — |
| sublimelinter.mark.warning | #fabd2f | — |
| raw.nibble.upper | #f2e5bc | — |
| raw.nibble.lower | #f2e5bc | — |
| hexviewer.highlight | #32302f | — |
| hexviewer.highlight.edited | #32302f | — |
| glyph.carriage-return | #ebdbb226 | — |
| glyph.new-line | #ebdbb226 | — |
| keyword.control.header.todo | #b8bb26 | — |
| notes.todo | #bdae93 | — |
| text.todo punctuation.definition.bold, text.todo punctuation.definition.italic | #7c6f64 | — |
| meta.item.todo.pending | #f2e5bc | — |
| punctuation.definition.bullet.pending.todo | #928374 | — |
| punctuation.definition.bullet.completed.todo | #8ec07c | — |
| punctuation.definition.bullet.cancelled.todo | #fb4934 | — |
| string.other.tag.todo.critical | #fb4934 | bold |
| string.other.tag.todo.high | #fe8019 | bold |
| string.other.tag.todo.low | #83a598 | bold |
| string.other.tag.todo.today | #fabd2f | bold |
| meta.tag.todo | #d3869b | — |
| punctuation.definition.url, todo.url | #83a598 | — |
| meta.punctuation.archive.todo, meta.punctuation.separator.todo | #928374 | italic |
TypeScript sample highlighted with this variant's colors and tokenColors.
Loading...
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}!`;
}
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}!`;
}