diff --git a/README.md b/README.md index e2e743d..92153d2 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # Pierre Theme -Light and dark themes for Visual Studio Code, Cursor, and Shiki. Built for [Diffs.com](https://diffs.com) by [The Pierre Computer Company](https://pierre.computer). +Light and dark themes for Visual Studio Code, Cursor, Zed, and Shiki. Built for [Diffs.com](https://diffs.com) by [The Pierre Computer Company](https://pierre.computer). ## Preview @@ -29,6 +29,14 @@ From the menu in Cursor: You can also install or download from the [Open VSX registry](https://open-vsx.org/extension/pierrecomputer/pierre-theme). +### Zed + +From the menu in Zed: + +- Zed > Extensions (or hit Command+Shift+X or Control+Shift+X) +- Search for `Pierre` +- Click install + ## Vibrant themes (Display P3) > [!NOTE] diff --git a/package-lock.json b/package-lock.json index 2fe858e..23951ed 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@pierre/theme", - "version": "0.0.20", + "version": "0.0.21", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@pierre/theme", - "version": "0.0.20", + "version": "0.0.21", "license": "MIT", "devDependencies": { "@vscode/vsce": "^3.2.2", diff --git a/package.json b/package.json index d3d816c..6fa3ba2 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "name": "@pierre/theme", "displayName": "Pierre Theme", "description": "Pierre theme for Shiki, VS Code, and more", - "version": "0.0.20", + "version": "0.0.21", "publisher": "pierrecomputer", "icon": "icon.png", "galleryBanner": { diff --git a/src/build.ts b/src/build.ts index f72d884..e1ffad8 100644 --- a/src/build.ts +++ b/src/build.ts @@ -2,22 +2,38 @@ import { writeFileSync, mkdirSync } from "node:fs"; import { light as rolesLight, dark as rolesDark } from "./palette"; import { makeTheme } from "./theme"; +import { makeZedThemeFamily } from "./zed-theme"; import { convertRolesToP3 } from "./color-p3"; mkdirSync("themes", { recursive: true }); +mkdirSync("zed/themes", { recursive: true }); // Convert palettes to Display P3 color space const rolesLightP3 = convertRolesToP3(rolesLight); const rolesDarkP3 = convertRolesToP3(rolesDark); -const out = [ +// ============================================ +// VS Code Themes +// ============================================ +const vscodeThemes = [ { file: "themes/pierre-light.json", theme: makeTheme("Pierre Light", "light", rolesLight) }, { file: "themes/pierre-dark.json", theme: makeTheme("Pierre Dark", "dark", rolesDark) }, { file: "themes/pierre-light-vibrant.json", theme: makeTheme("Pierre Light Vibrant", "light", rolesLightP3) }, { file: "themes/pierre-dark-vibrant.json", theme: makeTheme("Pierre Dark Vibrant", "dark", rolesDarkP3) } ]; -for (const {file, theme} of out) { +for (const {file, theme} of vscodeThemes) { writeFileSync(file, JSON.stringify(theme, null, 2), "utf8"); console.log("Wrote", file); } + +// ============================================ +// Zed Theme Family +// ============================================ +const zedTheme = makeZedThemeFamily("Pierre", "pierrecomputer", [ + { name: "Pierre Light", appearance: "light", roles: rolesLight }, + { name: "Pierre Dark", appearance: "dark", roles: rolesDark }, +]); + +writeFileSync("zed/themes/pierre.json", JSON.stringify(zedTheme, null, 2), "utf8"); +console.log("Wrote zed/themes/pierre.json"); diff --git a/src/palette.ts b/src/palette.ts index eb42fde..f773dc6 100644 --- a/src/palette.ts +++ b/src/palette.ts @@ -318,11 +318,11 @@ export const dark: Roles = { }, border: { window: gray["1040"], - editor: gray["920"], - indentGuide: gray["940"], + editor: gray["980"], + indentGuide: gray["980"], indentGuideActive: gray["960"], - inset: gray["920"], - elevated: gray["960"] + inset: gray["980"], + elevated: gray["980"] }, accent: { primary: blue["500"], diff --git a/src/zed-theme.ts b/src/zed-theme.ts new file mode 100644 index 0000000..bc350d0 --- /dev/null +++ b/src/zed-theme.ts @@ -0,0 +1,606 @@ +// src/zed-theme.ts +import type { Roles } from "./palette"; + +type ZedHighlightStyle = { + color?: string; + background_color?: string; + font_style?: "normal" | "italic" | "oblique"; + font_weight?: 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900; +}; + +type ZedPlayerColor = { + cursor?: string; + background?: string; + selection?: string; +}; + +type ZedThemeStyle = { + // Backgrounds + background: string; + "background.appearance"?: "opaque" | "transparent" | "blurred"; + "surface.background": string; + "elevated_surface.background": string; + "drop_target.background": string; + + // Editor + "editor.background": string; + "editor.foreground": string; + "editor.gutter.background": string; + "editor.active_line.background": string; + "editor.active_line_number": string; + "editor.line_number": string; + "editor.highlighted_line.background": string; + "editor.indent_guide": string; + "editor.indent_guide_active": string; + "editor.invisible": string; + "editor.wrap_guide": string; + "editor.active_wrap_guide": string; + "editor.document_highlight.read_background": string; + "editor.document_highlight.write_background": string; + "editor.document_highlight.bracket_background": string; + "editor.subheader.background": string; + + // Text + text: string; + "text.muted": string; + "text.placeholder": string; + "text.disabled": string; + "text.accent": string; + + // Borders + border: string; + "border.variant": string; + "border.focused": string; + "border.selected": string; + "border.transparent": string; + "border.disabled": string; + + // UI Elements + "element.background": string; + "element.hover": string; + "element.active": string; + "element.selected": string; + "element.disabled": string; + "ghost_element.background": string; + "ghost_element.hover": string; + "ghost_element.active": string; + "ghost_element.selected": string; + "ghost_element.disabled": string; + + // Icons & Links + icon: string; + "icon.muted": string; + "icon.disabled": string; + "icon.placeholder": string; + "icon.accent": string; + "link_text.hover": string; + + // Status colors + error: string; + "error.background": string; + "error.border": string; + warning: string; + "warning.background": string; + "warning.border": string; + success: string; + "success.background": string; + "success.border": string; + info: string; + "info.background": string; + "info.border": string; + hint: string; + "hint.background": string; + "hint.border": string; + predictive: string; + "predictive.background": string; + "predictive.border": string; + unreachable: string; + "unreachable.background": string; + "unreachable.border": string; + + // Git status + created: string; + "created.background": string; + "created.border": string; + modified: string; + "modified.background": string; + "modified.border": string; + deleted: string; + "deleted.background": string; + "deleted.border": string; + conflict: string; + "conflict.background": string; + "conflict.border": string; + hidden: string; + "hidden.background": string; + "hidden.border": string; + ignored: string; + "ignored.background": string; + "ignored.border": string; + renamed: string; + "renamed.background": string; + "renamed.border": string; + + // Search + "search.match_background": string; + + // Tabs + "tab_bar.background": string; + "tab.active_background": string; + "tab.inactive_background": string; + + // Toolbar & Title bar + "toolbar.background": string; + "title_bar.background": string; + "title_bar.inactive_background": string; + + // Panel & Status bar + "panel.background": string; + "panel.focused_border": string; + "status_bar.background": string; + + // Scrollbar + "scrollbar.thumb.background": string; + "scrollbar.thumb.hover_background": string; + "scrollbar.thumb.border": string; + "scrollbar.track.background": string; + "scrollbar.track.border": string; + + // Terminal + "terminal.background": string; + "terminal.foreground": string; + "terminal.bright_foreground": string; + "terminal.dim_foreground": string; + "terminal.ansi.black": string; + "terminal.ansi.red": string; + "terminal.ansi.green": string; + "terminal.ansi.yellow": string; + "terminal.ansi.blue": string; + "terminal.ansi.magenta": string; + "terminal.ansi.cyan": string; + "terminal.ansi.white": string; + "terminal.ansi.bright_black": string; + "terminal.ansi.bright_red": string; + "terminal.ansi.bright_green": string; + "terminal.ansi.bright_yellow": string; + "terminal.ansi.bright_blue": string; + "terminal.ansi.bright_magenta": string; + "terminal.ansi.bright_cyan": string; + "terminal.ansi.bright_white": string; + "terminal.ansi.dim_black"?: string; + "terminal.ansi.dim_red"?: string; + "terminal.ansi.dim_green"?: string; + "terminal.ansi.dim_yellow"?: string; + "terminal.ansi.dim_blue"?: string; + "terminal.ansi.dim_magenta"?: string; + "terminal.ansi.dim_cyan"?: string; + "terminal.ansi.dim_white"?: string; + + // Players (multiplayer cursors) + players: ZedPlayerColor[]; + + // Syntax highlighting + syntax: Record; +}; + +type ZedTheme = { + name: string; + appearance: "light" | "dark"; + style: ZedThemeStyle; +}; + +type ZedThemeFamilyContent = { + $schema: string; + name: string; + author: string; + themes: ZedTheme[]; +}; + +export type ZedThemeVariant = { + name: string; + appearance: "light" | "dark"; + roles: Roles; +}; + +export function makeZedThemeFamily( + familyName: string, + author: string, + variants: ZedThemeVariant[] +): ZedThemeFamilyContent { + return { + $schema: "https://zed.dev/schema/themes/v0.2.0.json", + name: familyName, + author, + themes: variants.map((v) => makeZedTheme(v.name, v.appearance, v.roles)), + }; +} + +function makeZedTheme( + name: string, + appearance: "light" | "dark", + c: Roles +): ZedTheme { + const isDark = appearance === "dark"; + + return { + name, + appearance, + style: { + // Backgrounds + background: c.bg.window, + "surface.background": c.bg.window, + "elevated_surface.background": c.bg.elevated, + "drop_target.background": alpha(c.accent.primary, 0.15), + + // Editor + "editor.background": c.bg.editor, + "editor.foreground": c.fg.base, + "editor.gutter.background": c.bg.editor, + "editor.active_line.background": alpha(c.accent.subtle, 0.55), + "editor.active_line_number": c.fg.fg2, + "editor.line_number": c.fg.fg3, + "editor.highlighted_line.background": alpha(c.accent.subtle, 0.35), + "editor.indent_guide": c.border.indentGuide, + "editor.indent_guide_active": c.border.indentGuideActive, + "editor.invisible": c.fg.fg4, + "editor.wrap_guide": c.border.indentGuide, + "editor.active_wrap_guide": c.border.indentGuideActive, + "editor.document_highlight.read_background": alpha(c.accent.primary, isDark ? 0.15 : 0.1), + "editor.document_highlight.write_background": alpha(c.accent.primary, isDark ? 0.25 : 0.18), + "editor.document_highlight.bracket_background": alpha(c.accent.primary, 0.2), + "editor.subheader.background": c.bg.window, + + // Text + text: c.fg.base, + "text.muted": c.fg.fg3, + "text.placeholder": c.fg.fg4, + "text.disabled": c.fg.fg4, + "text.accent": c.accent.primary, + + // Borders - use darker borders for dark themes + border: isDark ? c.border.indentGuide : c.border.editor, + "border.variant": isDark ? c.border.indentGuideActive : c.border.window, + "border.focused": c.accent.primary, + "border.selected": c.accent.primary, + "border.transparent": "transparent", + "border.disabled": isDark ? c.border.indentGuideActive : c.border.inset, + + // UI Elements + "element.background": c.bg.inset, + "element.hover": alpha(c.accent.subtle, 0.5), + "element.active": alpha(c.accent.subtle, 0.7), + "element.selected": alpha(c.accent.subtle, isDark ? 0.6 : 0.8), + "element.disabled": alpha(c.bg.inset, 0.5), + "ghost_element.background": "transparent", + "ghost_element.hover": alpha(c.accent.subtle, 0.35), + "ghost_element.active": alpha(c.accent.subtle, 0.55), + "ghost_element.selected": alpha(c.accent.subtle, isDark ? 0.5 : 0.65), + "ghost_element.disabled": "transparent", + + // Icons & Links + icon: c.fg.fg2, + "icon.muted": c.fg.fg3, + "icon.disabled": c.fg.fg4, + "icon.placeholder": c.fg.fg4, + "icon.accent": c.accent.primary, + "link_text.hover": c.accent.link, + + // Status colors + error: c.states.danger, + "error.background": alpha(c.states.danger, 0.1), + "error.border": alpha(c.states.danger, 0.3), + warning: c.accent.primary, + "warning.background": alpha(c.accent.primary, 0.1), + "warning.border": alpha(c.accent.primary, 0.3), + success: c.states.success, + "success.background": alpha(c.states.success, 0.1), + "success.border": alpha(c.states.success, 0.3), + info: c.states.info, + "info.background": alpha(c.states.info, 0.1), + "info.border": alpha(c.states.info, 0.3), + hint: c.fg.fg3, + "hint.background": alpha(c.fg.fg3, 0.1), + "hint.border": alpha(c.fg.fg3, 0.2), + predictive: c.fg.fg4, + "predictive.background": alpha(c.fg.fg4, 0.1), + "predictive.border": alpha(c.fg.fg4, 0.2), + unreachable: c.fg.fg4, + "unreachable.background": alpha(c.fg.fg4, 0.05), + "unreachable.border": alpha(c.fg.fg4, 0.1), + + // Git status + created: c.states.success, + "created.background": alpha(c.states.success, 0.1), + "created.border": alpha(c.states.success, 0.3), + modified: c.accent.primary, + "modified.background": alpha(c.accent.primary, 0.1), + "modified.border": alpha(c.accent.primary, 0.3), + deleted: c.states.danger, + "deleted.background": alpha(c.states.danger, 0.1), + "deleted.border": alpha(c.states.danger, 0.3), + conflict: c.accent.primary, + "conflict.background": alpha(c.accent.primary, 0.1), + "conflict.border": alpha(c.accent.primary, 0.3), + hidden: c.fg.fg4, + "hidden.background": alpha(c.fg.fg4, 0.05), + "hidden.border": alpha(c.fg.fg4, 0.1), + ignored: c.fg.fg3, + "ignored.background": alpha(c.fg.fg3, 0.05), + "ignored.border": alpha(c.fg.fg3, 0.1), + renamed: c.states.info, + "renamed.background": alpha(c.states.info, 0.1), + "renamed.border": alpha(c.states.info, 0.3), + + // Search + "search.match_background": alpha(c.states.warn, 0.3), + + // Tabs + "tab_bar.background": c.bg.window, + "tab.active_background": c.bg.window, + "tab.inactive_background": c.bg.window, + + // Toolbar & Title bar + "toolbar.background": c.bg.window, + "title_bar.background": c.bg.window, + "title_bar.inactive_background": c.bg.window, + + // Panel & Status bar + "panel.background": c.bg.window, + "panel.focused_border": c.accent.primary, + "status_bar.background": c.bg.window, + + // Scrollbar + "scrollbar.thumb.background": alpha(c.fg.fg4, 0.3), + "scrollbar.thumb.hover_background": alpha(c.fg.fg4, 0.5), + "scrollbar.thumb.border": "transparent", + "scrollbar.track.background": "transparent", + "scrollbar.track.border": "transparent", + + // Terminal + "terminal.background": c.bg.window, + "terminal.foreground": c.fg.fg2, + "terminal.bright_foreground": c.fg.base, + "terminal.dim_foreground": c.fg.fg3, + "terminal.ansi.black": c.ansi.black, + "terminal.ansi.red": c.ansi.red, + "terminal.ansi.green": c.ansi.green, + "terminal.ansi.yellow": c.ansi.yellow, + "terminal.ansi.blue": c.ansi.blue, + "terminal.ansi.magenta": c.ansi.magenta, + "terminal.ansi.cyan": c.ansi.cyan, + "terminal.ansi.white": c.ansi.white, + "terminal.ansi.bright_black": c.ansi.brightBlack, + "terminal.ansi.bright_red": c.ansi.brightRed, + "terminal.ansi.bright_green": c.ansi.brightGreen, + "terminal.ansi.bright_yellow": c.ansi.brightYellow, + "terminal.ansi.bright_blue": c.ansi.brightBlue, + "terminal.ansi.bright_magenta": c.ansi.brightMagenta, + "terminal.ansi.bright_cyan": c.ansi.brightCyan, + "terminal.ansi.bright_white": c.ansi.brightWhite, + + // Players (multiplayer cursors) - use colors from the palette + players: [ + { cursor: c.accent.primary, background: c.accent.primary, selection: alpha(c.accent.primary, 0.25) }, + { cursor: c.states.success, background: c.states.success, selection: alpha(c.states.success, 0.25) }, + { cursor: c.syntax.keyword, background: c.syntax.keyword, selection: alpha(c.syntax.keyword, 0.25) }, + { cursor: c.syntax.func, background: c.syntax.func, selection: alpha(c.syntax.func, 0.25) }, + { cursor: c.syntax.string, background: c.syntax.string, selection: alpha(c.syntax.string, 0.25) }, + { cursor: c.states.warn, background: c.states.warn, selection: alpha(c.states.warn, 0.25) }, + { cursor: c.syntax.type, background: c.syntax.type, selection: alpha(c.syntax.type, 0.25) }, + { cursor: c.states.info, background: c.states.info, selection: alpha(c.states.info, 0.25) }, + ], + + // Syntax highlighting + syntax: { + // Comments + comment: { color: c.syntax.comment }, + "comment.doc": { color: c.syntax.comment }, + + // Strings + string: { color: c.syntax.string }, + "string.escape": { color: c.syntax.escape }, + "string.regex": { color: c.syntax.regexp }, + "string.special": { color: c.syntax.escape }, + "string.special.symbol": { color: c.syntax.constant }, + + // Numbers & Constants + number: { color: c.syntax.number }, + constant: { color: c.syntax.constant }, + boolean: { color: c.syntax.number }, + + // Keywords + keyword: { color: c.syntax.keyword }, + "keyword.operator": { color: c.syntax.operator }, + + // Functions + function: { color: c.syntax.func }, + "function.method": { color: c.syntax.func }, + "function.builtin": { color: c.syntax.func }, + "function.special.definition": { color: c.syntax.func }, + // CSS/SCSS function calls like var(), calc(), light-dark() + "function.call": { color: c.syntax.func }, + + // Types + type: { color: c.syntax.type }, + "type.builtin": { color: c.syntax.type }, + constructor: { color: c.syntax.type }, + + // Variables + variable: { color: c.syntax.variable }, + "variable.builtin": { color: c.syntax.namespace }, // this, self, super + "variable.member": { color: c.syntax.variable }, + "variable.parameter": { color: c.syntax.parameter }, + "variable.special": { color: c.syntax.namespace }, + + // Properties - Used for JS object keys and property access + // Keep as variable color (orange) for JS compatibility + property: { color: c.syntax.variable }, + + // ======================================== + // CSS/SCSS SPECIFIC + // ======================================== + // CSS property names (e.g., position, display, margin) - blue + // These more specific scopes should override `property` for CSS + "property.css": { color: c.accent.primary }, + "property.definition": { color: c.accent.primary }, + property_name: { color: c.accent.primary }, + + // CSS property values that are keywords (e.g., relative, flex, auto, solid) + "value": { color: c.syntax.number }, + "constant.css": { color: c.syntax.constant }, + "string.plain": { color: c.syntax.number }, + plain_value: { color: c.syntax.number }, + + // CSS selectors - element/tag selectors (p, ul, ol, div, table) + "tag.css": { color: c.syntax.tag }, + tag_name: { color: c.syntax.tag }, + // Class selectors (.prose, .container) + "class": { color: c.syntax.attribute }, + class_name: { color: c.syntax.attribute }, + "selector.class": { color: c.syntax.attribute }, + // ID selectors (#main) + "selector.id": { color: c.syntax.func }, + id_name: { color: c.syntax.func }, + // Pseudo-elements and pseudo-classes (::before, :hover) + "selector.pseudo": { color: c.syntax.operator }, + pseudo_class_selector: { color: c.syntax.operator }, + pseudo_element_selector: { color: c.syntax.operator }, + + // @-rules (@use, @layer, @media, @mixin) + "keyword.directive": { color: c.syntax.keyword }, + "keyword.control.at-rule": { color: c.syntax.keyword }, + at_keyword: { color: c.syntax.keyword }, + + // SCSS/CSS variables - these should be orange (variable color) + // SCSS variables ($variable) + "variable.scss": { color: c.syntax.variable }, + // CSS custom properties (--custom-prop) - orange + "variable.css": { color: c.syntax.variable }, + "property.custom": { color: c.syntax.variable }, + + // Units (px, em, %, rem) + "unit": { color: c.syntax.number }, + "number.unit": { color: c.syntax.number }, + + // Colors + "color": { color: c.syntax.constant }, + "constant.color": { color: c.syntax.constant }, + + // Important + "keyword.important": { color: c.syntax.keyword }, + + // ======================================== + // END CSS/SCSS SPECIFIC + // ======================================== + + // ======================================== + // JAVASCRIPT/TYPESCRIPT SPECIFIC + // ======================================== + // `this`, `self`, `super` - namespace/yellow color + "variable.language": { color: c.syntax.namespace }, + this: { color: c.syntax.namespace }, + self: { color: c.syntax.namespace }, + + // Class/Type names (Dropdown, BaseComponent, TypeError) + "type.class": { color: c.syntax.type }, + // Note: class_name is defined in CSS section for CSS class selectors + + // Object literal keys + "property.object": { color: c.syntax.variable }, + property_identifier: { color: c.syntax.variable }, + shorthand_property_identifier: { color: c.syntax.variable }, + shorthand_property_identifier_pattern: { color: c.syntax.variable }, + + // Method definitions and calls + method_definition: { color: c.syntax.func }, + "function.method.call": { color: c.syntax.func }, + + // Template literal interpolation + "string.template": { color: c.syntax.string }, + template_string: { color: c.syntax.string }, + + // JSX + "tag.jsx": { color: c.syntax.tag }, + "tag.component": { color: c.syntax.type }, + + // ======================================== + // END JAVASCRIPT/TYPESCRIPT SPECIFIC + // ======================================== + + // Punctuation + punctuation: { color: c.syntax.punctuation }, + "punctuation.bracket": { color: c.syntax.punctuation }, + "punctuation.delimiter": { color: c.syntax.punctuation }, + "punctuation.list_marker": { color: c.syntax.punctuation }, + "punctuation.special": { color: c.syntax.keyword }, + + // Operators + operator: { color: c.syntax.operator }, + + // Tags (HTML/XML/JSX) + tag: { color: c.syntax.tag }, + attribute: { color: c.syntax.attribute }, + + // Labels & Namespaces + label: { color: c.syntax.namespace }, + namespace: { color: c.syntax.namespace }, + + // Embedded / Preprocessor + embedded: { color: c.fg.base }, + preproc: { color: c.syntax.keyword }, + + // Markup + "text.literal": { color: c.syntax.string }, + "markup.heading": { color: c.syntax.tag, font_weight: 700 }, + "markup.bold": { color: c.syntax.constant, font_weight: 700 }, + "markup.italic": { color: c.syntax.keyword, font_style: "italic" }, + "markup.strikethrough": { color: c.fg.fg3 }, + "markup.link.url": { color: c.accent.link }, + "markup.link.text": { color: c.syntax.func }, + "markup.quote": { color: c.syntax.comment, font_style: "italic" }, + "markup.list": { color: c.syntax.tag }, + "markup.list.numbered": { color: c.syntax.tag }, + "markup.list.unnumbered": { color: c.syntax.tag }, + "markup.raw": { color: c.syntax.string }, + "markup.raw.inline": { color: c.syntax.string }, + "markup.raw.block": { color: c.syntax.string }, + + // Diff + "diff.plus": { color: c.states.success }, + "diff.minus": { color: c.states.danger }, + "diff.delta": { color: c.states.warn }, + + // Links + link_text: { color: c.accent.link }, + link_uri: { color: c.syntax.keyword }, + + // Emphasis & Primary + emphasis: { font_style: "italic" }, + "emphasis.strong": { font_weight: 700 }, + primary: { color: c.accent.primary }, + title: { color: c.syntax.tag, font_weight: 700 }, + + // Predictive / AI suggestions + predictive: { color: c.fg.fg4, font_style: "italic" }, + }, + }, + }; +} + +// Helper: add alpha to hex color +function alpha(color: string, opacity: number): string { + // Handle Display P3 color format + if (color.startsWith("color(display-p3")) { + if (color.includes(" / ")) { + return color.replace(/ \/ [\d.]+\)$/, ` / ${opacity.toFixed(6)})`); + } else { + return color.replace(/\)$/, ` / ${opacity.toFixed(6)})`); + } + } + + // Handle hex color format + const alphaHex = Math.round(opacity * 255) + .toString(16) + .padStart(2, "0"); + return `${color}${alphaHex}`; +} diff --git a/themes/pierre-dark-vibrant.json b/themes/pierre-dark-vibrant.json index 584f5ce..7905c51 100644 --- a/themes/pierre-dark-vibrant.json +++ b/themes/pierre-dark-vibrant.json @@ -12,7 +12,7 @@ "editorCursor.foreground": "color(display-p3 0.308664 0.645271 1.000000)", "editorLineNumber.foreground": "color(display-p3 0.517647 0.517647 0.539124)", "editorLineNumber.activeForeground": "color(display-p3 0.678431 0.678431 0.692733)", - "editorIndentGuide.background": "color(display-p3 0.223529 0.223529 0.234269)", + "editorIndentGuide.background": "color(display-p3 0.121569 0.121569 0.128729)", "editorIndentGuide.activeBackground": "color(display-p3 0.180392 0.180392 0.187548)", "diffEditor.insertedTextBackground": "color(display-p3 0.309962 0.827620 0.725102 / 0.100000)", "diffEditor.deletedTextBackground": "color(display-p3 1.000000 0.250216 0.262337 / 0.100000)", @@ -61,11 +61,11 @@ "statusBarItem.remoteBackground": "color(display-p3 0.078431 0.078431 0.082008)", "statusBarItem.remoteForeground": "color(display-p3 0.678431 0.678431 0.692733)", "input.background": "color(display-p3 0.121569 0.121569 0.128729)", - "input.border": "color(display-p3 0.258824 0.258824 0.269560)", + "input.border": "color(display-p3 0.121569 0.121569 0.128729)", "input.foreground": "color(display-p3 0.984314 0.984314 0.984314)", "input.placeholderForeground": "color(display-p3 0.474510 0.474510 0.495991)", "dropdown.background": "color(display-p3 0.121569 0.121569 0.128729)", - "dropdown.border": "color(display-p3 0.258824 0.258824 0.269560)", + "dropdown.border": "color(display-p3 0.121569 0.121569 0.128729)", "dropdown.foreground": "color(display-p3 0.984314 0.984314 0.984314)", "button.background": "color(display-p3 0.308664 0.645271 1.000000)", "button.foreground": "color(display-p3 0.027451 0.027451 0.027451)", diff --git a/themes/pierre-dark.json b/themes/pierre-dark.json index fec6934..3c7abd7 100644 --- a/themes/pierre-dark.json +++ b/themes/pierre-dark.json @@ -12,7 +12,7 @@ "editorCursor.foreground": "#009fff", "editorLineNumber.foreground": "#84848A", "editorLineNumber.activeForeground": "#adadb1", - "editorIndentGuide.background": "#39393c", + "editorIndentGuide.background": "#1F1F21", "editorIndentGuide.activeBackground": "#2e2e30", "diffEditor.insertedTextBackground": "#00cab11a", "diffEditor.deletedTextBackground": "#ff2e3f1a", @@ -61,11 +61,11 @@ "statusBarItem.remoteBackground": "#141415", "statusBarItem.remoteForeground": "#adadb1", "input.background": "#1F1F21", - "input.border": "#424245", + "input.border": "#1F1F21", "input.foreground": "#fbfbfb", "input.placeholderForeground": "#79797F", "dropdown.background": "#1F1F21", - "dropdown.border": "#424245", + "dropdown.border": "#1F1F21", "dropdown.foreground": "#fbfbfb", "button.background": "#009fff", "button.foreground": "#070707", diff --git a/zed/README.md b/zed/README.md new file mode 100644 index 0000000..49afce5 --- /dev/null +++ b/zed/README.md @@ -0,0 +1,25 @@ +# Pierre Theme for Zed + +Custom themes for [Zed](https://zed.dev) from the team that built [Diffs.com](https://diffs.com), [The Pierre Computer Company]{https://pierre.computer}. + +## Variants + +- **Pierre Light** — Light theme with warm orange accents +- **Pierre Dark** — Dark theme with warm orange accents + +## Installation + +Search for "Pierre" in Zed's extension manager (`Cmd+Shift+X` or `Ctrl+Shift+X`). + +## Manual Installation + +Copy `themes/pierre.json` to your Zed themes directory: + +- **macOS/Linux:** `~/.config/zed/themes/` +- **Windows:** `%USERPROFILE%\AppData\Roaming\Zed\themes\` + +Then select the theme via the theme selector (`Cmd+K Cmd+T` or `Ctrl+K Ctrl+T`). + +## License + +MIT diff --git a/zed/extension.toml b/zed/extension.toml new file mode 100644 index 0000000..141dbd0 --- /dev/null +++ b/zed/extension.toml @@ -0,0 +1,7 @@ +id = "pierre" +name = "Pierre" +description = "A warm, orange-accented color theme with light and dark variants" +version = "0.0.1" +schema_version = 1 +authors = ["pierrecomputer"] +repository = "https://github.com/pierrecomputer/pierre-theme" diff --git a/zed/themes/pierre.json b/zed/themes/pierre.json new file mode 100644 index 0000000..812365d --- /dev/null +++ b/zed/themes/pierre.json @@ -0,0 +1,991 @@ +{ + "$schema": "https://zed.dev/schema/themes/v0.2.0.json", + "name": "Pierre", + "author": "pierrecomputer", + "themes": [ + { + "name": "Pierre Light", + "appearance": "light", + "style": { + "background": "#f8f8f8", + "surface.background": "#f8f8f8", + "elevated_surface.background": "#f9f9f9", + "drop_target.background": "#009fff26", + "editor.background": "#ffffff", + "editor.foreground": "#070707", + "editor.gutter.background": "#ffffff", + "editor.active_line.background": "#dfebff8c", + "editor.active_line_number": "#6C6C71", + "editor.line_number": "#84848A", + "editor.highlighted_line.background": "#dfebff59", + "editor.indent_guide": "#eeeeef", + "editor.indent_guide_active": "#dbdbdd", + "editor.invisible": "#8E8E95", + "editor.wrap_guide": "#eeeeef", + "editor.active_wrap_guide": "#dbdbdd", + "editor.document_highlight.read_background": "#009fff1a", + "editor.document_highlight.write_background": "#009fff2e", + "editor.document_highlight.bracket_background": "#009fff33", + "editor.subheader.background": "#f8f8f8", + "text": "#070707", + "text.muted": "#84848A", + "text.placeholder": "#8E8E95", + "text.disabled": "#8E8E95", + "text.accent": "#009fff", + "border": "#dbdbdd", + "border.variant": "#eeeeef", + "border.focused": "#009fff", + "border.selected": "#009fff", + "border.transparent": "transparent", + "border.disabled": "#dbdbdd", + "element.background": "#f2f2f3", + "element.hover": "#dfebff80", + "element.active": "#dfebffb3", + "element.selected": "#dfebffcc", + "element.disabled": "#f2f2f380", + "ghost_element.background": "transparent", + "ghost_element.hover": "#dfebff59", + "ghost_element.active": "#dfebff8c", + "ghost_element.selected": "#dfebffa6", + "ghost_element.disabled": "transparent", + "icon": "#6C6C71", + "icon.muted": "#84848A", + "icon.disabled": "#8E8E95", + "icon.placeholder": "#8E8E95", + "icon.accent": "#009fff", + "link_text.hover": "#009fff", + "error": "#ff2e3f", + "error.background": "#ff2e3f1a", + "error.border": "#ff2e3f4d", + "warning": "#009fff", + "warning.background": "#009fff1a", + "warning.border": "#009fff4d", + "success": "#00cab1", + "success.background": "#00cab11a", + "success.border": "#00cab14d", + "info": "#08c0ef", + "info.background": "#08c0ef1a", + "info.border": "#08c0ef4d", + "hint": "#84848A", + "hint.background": "#84848A1a", + "hint.border": "#84848A33", + "predictive": "#8E8E95", + "predictive.background": "#8E8E951a", + "predictive.border": "#8E8E9533", + "unreachable": "#8E8E95", + "unreachable.background": "#8E8E950d", + "unreachable.border": "#8E8E951a", + "created": "#00cab1", + "created.background": "#00cab11a", + "created.border": "#00cab14d", + "modified": "#009fff", + "modified.background": "#009fff1a", + "modified.border": "#009fff4d", + "deleted": "#ff2e3f", + "deleted.background": "#ff2e3f1a", + "deleted.border": "#ff2e3f4d", + "conflict": "#009fff", + "conflict.background": "#009fff1a", + "conflict.border": "#009fff4d", + "hidden": "#8E8E95", + "hidden.background": "#8E8E950d", + "hidden.border": "#8E8E951a", + "ignored": "#84848A", + "ignored.background": "#84848A0d", + "ignored.border": "#84848A1a", + "renamed": "#08c0ef", + "renamed.background": "#08c0ef1a", + "renamed.border": "#08c0ef4d", + "search.match_background": "#ffca004d", + "tab_bar.background": "#f8f8f8", + "tab.active_background": "#f8f8f8", + "tab.inactive_background": "#f8f8f8", + "toolbar.background": "#f8f8f8", + "title_bar.background": "#f8f8f8", + "title_bar.inactive_background": "#f8f8f8", + "panel.background": "#f8f8f8", + "panel.focused_border": "#009fff", + "status_bar.background": "#f8f8f8", + "scrollbar.thumb.background": "#8E8E954d", + "scrollbar.thumb.hover_background": "#8E8E9580", + "scrollbar.thumb.border": "transparent", + "scrollbar.track.background": "transparent", + "scrollbar.track.border": "transparent", + "terminal.background": "#f8f8f8", + "terminal.foreground": "#6C6C71", + "terminal.bright_foreground": "#070707", + "terminal.dim_foreground": "#84848A", + "terminal.ansi.black": "#1F1F21", + "terminal.ansi.red": "#ff2e3f", + "terminal.ansi.green": "#0dbe4e", + "terminal.ansi.yellow": "#ffca00", + "terminal.ansi.blue": "#009fff", + "terminal.ansi.magenta": "#c635e4", + "terminal.ansi.cyan": "#08c0ef", + "terminal.ansi.white": "#c6c6c8", + "terminal.ansi.bright_black": "#1F1F21", + "terminal.ansi.bright_red": "#ff2e3f", + "terminal.ansi.bright_green": "#0dbe4e", + "terminal.ansi.bright_yellow": "#ffca00", + "terminal.ansi.bright_blue": "#009fff", + "terminal.ansi.bright_magenta": "#c635e4", + "terminal.ansi.bright_cyan": "#08c0ef", + "terminal.ansi.bright_white": "#c6c6c8", + "players": [ + { + "cursor": "#009fff", + "background": "#009fff", + "selection": "#009fff40" + }, + { + "cursor": "#00cab1", + "background": "#00cab1", + "selection": "#00cab140" + }, + { + "cursor": "#fc2b73", + "background": "#fc2b73", + "selection": "#fc2b7340" + }, + { + "cursor": "#7b43f8", + "background": "#7b43f8", + "selection": "#7b43f840" + }, + { + "cursor": "#199f43", + "background": "#199f43", + "selection": "#199f4340" + }, + { + "cursor": "#ffca00", + "background": "#ffca00", + "selection": "#ffca0040" + }, + { + "cursor": "#c635e4", + "background": "#c635e4", + "selection": "#c635e440" + }, + { + "cursor": "#08c0ef", + "background": "#08c0ef", + "selection": "#08c0ef40" + } + ], + "syntax": { + "comment": { + "color": "#84848A" + }, + "comment.doc": { + "color": "#84848A" + }, + "string": { + "color": "#199f43" + }, + "string.escape": { + "color": "#1ca1c7" + }, + "string.regex": { + "color": "#17a5af" + }, + "string.special": { + "color": "#1ca1c7" + }, + "string.special.symbol": { + "color": "#d5a910" + }, + "number": { + "color": "#1ca1c7" + }, + "constant": { + "color": "#d5a910" + }, + "boolean": { + "color": "#1ca1c7" + }, + "keyword": { + "color": "#fc2b73" + }, + "keyword.operator": { + "color": "#08c0ef" + }, + "function": { + "color": "#7b43f8" + }, + "function.method": { + "color": "#7b43f8" + }, + "function.builtin": { + "color": "#7b43f8" + }, + "function.special.definition": { + "color": "#7b43f8" + }, + "function.call": { + "color": "#7b43f8" + }, + "type": { + "color": "#c635e4" + }, + "type.builtin": { + "color": "#c635e4" + }, + "constructor": { + "color": "#c635e4" + }, + "variable": { + "color": "#d47628" + }, + "variable.builtin": { + "color": "#d5a910" + }, + "variable.member": { + "color": "#d47628" + }, + "variable.parameter": { + "color": "#79797F" + }, + "variable.special": { + "color": "#d5a910" + }, + "property": { + "color": "#d47628" + }, + "property.css": { + "color": "#009fff" + }, + "property.definition": { + "color": "#009fff" + }, + "property_name": { + "color": "#009fff" + }, + "value": { + "color": "#1ca1c7" + }, + "constant.css": { + "color": "#d5a910" + }, + "string.plain": { + "color": "#1ca1c7" + }, + "plain_value": { + "color": "#1ca1c7" + }, + "tag.css": { + "color": "#d52c36" + }, + "tag_name": { + "color": "#d52c36" + }, + "class": { + "color": "#16a994" + }, + "class_name": { + "color": "#16a994" + }, + "selector.class": { + "color": "#16a994" + }, + "selector.id": { + "color": "#7b43f8" + }, + "id_name": { + "color": "#7b43f8" + }, + "selector.pseudo": { + "color": "#08c0ef" + }, + "pseudo_class_selector": { + "color": "#08c0ef" + }, + "pseudo_element_selector": { + "color": "#08c0ef" + }, + "keyword.directive": { + "color": "#fc2b73" + }, + "keyword.control.at-rule": { + "color": "#fc2b73" + }, + "at_keyword": { + "color": "#fc2b73" + }, + "variable.scss": { + "color": "#d47628" + }, + "variable.css": { + "color": "#d47628" + }, + "property.custom": { + "color": "#d47628" + }, + "unit": { + "color": "#1ca1c7" + }, + "number.unit": { + "color": "#1ca1c7" + }, + "color": { + "color": "#d5a910" + }, + "constant.color": { + "color": "#d5a910" + }, + "keyword.important": { + "color": "#fc2b73" + }, + "variable.language": { + "color": "#d5a910" + }, + "this": { + "color": "#d5a910" + }, + "self": { + "color": "#d5a910" + }, + "type.class": { + "color": "#c635e4" + }, + "property.object": { + "color": "#d47628" + }, + "property_identifier": { + "color": "#d47628" + }, + "shorthand_property_identifier": { + "color": "#d47628" + }, + "shorthand_property_identifier_pattern": { + "color": "#d47628" + }, + "method_definition": { + "color": "#7b43f8" + }, + "function.method.call": { + "color": "#7b43f8" + }, + "string.template": { + "color": "#199f43" + }, + "template_string": { + "color": "#199f43" + }, + "tag.jsx": { + "color": "#d52c36" + }, + "tag.component": { + "color": "#c635e4" + }, + "punctuation": { + "color": "#79797F" + }, + "punctuation.bracket": { + "color": "#79797F" + }, + "punctuation.delimiter": { + "color": "#79797F" + }, + "punctuation.list_marker": { + "color": "#79797F" + }, + "punctuation.special": { + "color": "#fc2b73" + }, + "operator": { + "color": "#08c0ef" + }, + "tag": { + "color": "#d52c36" + }, + "attribute": { + "color": "#16a994" + }, + "label": { + "color": "#d5a910" + }, + "namespace": { + "color": "#d5a910" + }, + "embedded": { + "color": "#070707" + }, + "preproc": { + "color": "#fc2b73" + }, + "text.literal": { + "color": "#199f43" + }, + "markup.heading": { + "color": "#d52c36", + "font_weight": 700 + }, + "markup.bold": { + "color": "#d5a910", + "font_weight": 700 + }, + "markup.italic": { + "color": "#fc2b73", + "font_style": "italic" + }, + "markup.strikethrough": { + "color": "#84848A" + }, + "markup.link.url": { + "color": "#009fff" + }, + "markup.link.text": { + "color": "#7b43f8" + }, + "markup.quote": { + "color": "#84848A", + "font_style": "italic" + }, + "markup.list": { + "color": "#d52c36" + }, + "markup.list.numbered": { + "color": "#d52c36" + }, + "markup.list.unnumbered": { + "color": "#d52c36" + }, + "markup.raw": { + "color": "#199f43" + }, + "markup.raw.inline": { + "color": "#199f43" + }, + "markup.raw.block": { + "color": "#199f43" + }, + "diff.plus": { + "color": "#00cab1" + }, + "diff.minus": { + "color": "#ff2e3f" + }, + "diff.delta": { + "color": "#ffca00" + }, + "link_text": { + "color": "#009fff" + }, + "link_uri": { + "color": "#fc2b73" + }, + "emphasis": { + "font_style": "italic" + }, + "emphasis.strong": { + "font_weight": 700 + }, + "primary": { + "color": "#009fff" + }, + "title": { + "color": "#d52c36", + "font_weight": 700 + }, + "predictive": { + "color": "#8E8E95", + "font_style": "italic" + } + } + } + }, + { + "name": "Pierre Dark", + "appearance": "dark", + "style": { + "background": "#141415", + "surface.background": "#141415", + "elevated_surface.background": "#0B0B0C", + "drop_target.background": "#009fff26", + "editor.background": "#070707", + "editor.foreground": "#fbfbfb", + "editor.gutter.background": "#070707", + "editor.active_line.background": "#19283c8c", + "editor.active_line_number": "#adadb1", + "editor.line_number": "#84848A", + "editor.highlighted_line.background": "#19283c59", + "editor.indent_guide": "#1F1F21", + "editor.indent_guide_active": "#2e2e30", + "editor.invisible": "#79797F", + "editor.wrap_guide": "#1F1F21", + "editor.active_wrap_guide": "#2e2e30", + "editor.document_highlight.read_background": "#009fff26", + "editor.document_highlight.write_background": "#009fff40", + "editor.document_highlight.bracket_background": "#009fff33", + "editor.subheader.background": "#141415", + "text": "#fbfbfb", + "text.muted": "#84848A", + "text.placeholder": "#79797F", + "text.disabled": "#79797F", + "text.accent": "#009fff", + "border": "#1F1F21", + "border.variant": "#2e2e30", + "border.focused": "#009fff", + "border.selected": "#009fff", + "border.transparent": "transparent", + "border.disabled": "#2e2e30", + "element.background": "#1F1F21", + "element.hover": "#19283c80", + "element.active": "#19283cb3", + "element.selected": "#19283c99", + "element.disabled": "#1F1F2180", + "ghost_element.background": "transparent", + "ghost_element.hover": "#19283c59", + "ghost_element.active": "#19283c8c", + "ghost_element.selected": "#19283c80", + "ghost_element.disabled": "transparent", + "icon": "#adadb1", + "icon.muted": "#84848A", + "icon.disabled": "#79797F", + "icon.placeholder": "#79797F", + "icon.accent": "#009fff", + "link_text.hover": "#009fff", + "error": "#ff2e3f", + "error.background": "#ff2e3f1a", + "error.border": "#ff2e3f4d", + "warning": "#009fff", + "warning.background": "#009fff1a", + "warning.border": "#009fff4d", + "success": "#00cab1", + "success.background": "#00cab11a", + "success.border": "#00cab14d", + "info": "#08c0ef", + "info.background": "#08c0ef1a", + "info.border": "#08c0ef4d", + "hint": "#84848A", + "hint.background": "#84848A1a", + "hint.border": "#84848A33", + "predictive": "#79797F", + "predictive.background": "#79797F1a", + "predictive.border": "#79797F33", + "unreachable": "#79797F", + "unreachable.background": "#79797F0d", + "unreachable.border": "#79797F1a", + "created": "#00cab1", + "created.background": "#00cab11a", + "created.border": "#00cab14d", + "modified": "#009fff", + "modified.background": "#009fff1a", + "modified.border": "#009fff4d", + "deleted": "#ff2e3f", + "deleted.background": "#ff2e3f1a", + "deleted.border": "#ff2e3f4d", + "conflict": "#009fff", + "conflict.background": "#009fff1a", + "conflict.border": "#009fff4d", + "hidden": "#79797F", + "hidden.background": "#79797F0d", + "hidden.border": "#79797F1a", + "ignored": "#84848A", + "ignored.background": "#84848A0d", + "ignored.border": "#84848A1a", + "renamed": "#08c0ef", + "renamed.background": "#08c0ef1a", + "renamed.border": "#08c0ef4d", + "search.match_background": "#ffca004d", + "tab_bar.background": "#141415", + "tab.active_background": "#141415", + "tab.inactive_background": "#141415", + "toolbar.background": "#141415", + "title_bar.background": "#141415", + "title_bar.inactive_background": "#141415", + "panel.background": "#141415", + "panel.focused_border": "#009fff", + "status_bar.background": "#141415", + "scrollbar.thumb.background": "#79797F4d", + "scrollbar.thumb.hover_background": "#79797F80", + "scrollbar.thumb.border": "transparent", + "scrollbar.track.background": "transparent", + "scrollbar.track.border": "transparent", + "terminal.background": "#141415", + "terminal.foreground": "#adadb1", + "terminal.bright_foreground": "#fbfbfb", + "terminal.dim_foreground": "#84848A", + "terminal.ansi.black": "#141415", + "terminal.ansi.red": "#ff2e3f", + "terminal.ansi.green": "#0dbe4e", + "terminal.ansi.yellow": "#ffca00", + "terminal.ansi.blue": "#009fff", + "terminal.ansi.magenta": "#c635e4", + "terminal.ansi.cyan": "#08c0ef", + "terminal.ansi.white": "#c6c6c8", + "terminal.ansi.bright_black": "#141415", + "terminal.ansi.bright_red": "#ff2e3f", + "terminal.ansi.bright_green": "#0dbe4e", + "terminal.ansi.bright_yellow": "#ffca00", + "terminal.ansi.bright_blue": "#009fff", + "terminal.ansi.bright_magenta": "#c635e4", + "terminal.ansi.bright_cyan": "#08c0ef", + "terminal.ansi.bright_white": "#c6c6c8", + "players": [ + { + "cursor": "#009fff", + "background": "#009fff", + "selection": "#009fff40" + }, + { + "cursor": "#00cab1", + "background": "#00cab1", + "selection": "#00cab140" + }, + { + "cursor": "#ff678d", + "background": "#ff678d", + "selection": "#ff678d40" + }, + { + "cursor": "#9d6afb", + "background": "#9d6afb", + "selection": "#9d6afb40" + }, + { + "cursor": "#5ecc71", + "background": "#5ecc71", + "selection": "#5ecc7140" + }, + { + "cursor": "#ffca00", + "background": "#ffca00", + "selection": "#ffca0040" + }, + { + "cursor": "#d568ea", + "background": "#d568ea", + "selection": "#d568ea40" + }, + { + "cursor": "#08c0ef", + "background": "#08c0ef", + "selection": "#08c0ef40" + } + ], + "syntax": { + "comment": { + "color": "#84848A" + }, + "comment.doc": { + "color": "#84848A" + }, + "string": { + "color": "#5ecc71" + }, + "string.escape": { + "color": "#68cdf2" + }, + "string.regex": { + "color": "#64d1db" + }, + "string.special": { + "color": "#68cdf2" + }, + "string.special.symbol": { + "color": "#ffd452" + }, + "number": { + "color": "#68cdf2" + }, + "constant": { + "color": "#ffd452" + }, + "boolean": { + "color": "#68cdf2" + }, + "keyword": { + "color": "#ff678d" + }, + "keyword.operator": { + "color": "#08c0ef" + }, + "function": { + "color": "#9d6afb" + }, + "function.method": { + "color": "#9d6afb" + }, + "function.builtin": { + "color": "#9d6afb" + }, + "function.special.definition": { + "color": "#9d6afb" + }, + "function.call": { + "color": "#9d6afb" + }, + "type": { + "color": "#d568ea" + }, + "type.builtin": { + "color": "#d568ea" + }, + "constructor": { + "color": "#d568ea" + }, + "variable": { + "color": "#ffa359" + }, + "variable.builtin": { + "color": "#ffca00" + }, + "variable.member": { + "color": "#ffa359" + }, + "variable.parameter": { + "color": "#adadb1" + }, + "variable.special": { + "color": "#ffca00" + }, + "property": { + "color": "#ffa359" + }, + "property.css": { + "color": "#009fff" + }, + "property.definition": { + "color": "#009fff" + }, + "property_name": { + "color": "#009fff" + }, + "value": { + "color": "#68cdf2" + }, + "constant.css": { + "color": "#ffd452" + }, + "string.plain": { + "color": "#68cdf2" + }, + "plain_value": { + "color": "#68cdf2" + }, + "tag.css": { + "color": "#ff6762" + }, + "tag_name": { + "color": "#ff6762" + }, + "class": { + "color": "#61d5c0" + }, + "class_name": { + "color": "#61d5c0" + }, + "selector.class": { + "color": "#61d5c0" + }, + "selector.id": { + "color": "#9d6afb" + }, + "id_name": { + "color": "#9d6afb" + }, + "selector.pseudo": { + "color": "#08c0ef" + }, + "pseudo_class_selector": { + "color": "#08c0ef" + }, + "pseudo_element_selector": { + "color": "#08c0ef" + }, + "keyword.directive": { + "color": "#ff678d" + }, + "keyword.control.at-rule": { + "color": "#ff678d" + }, + "at_keyword": { + "color": "#ff678d" + }, + "variable.scss": { + "color": "#ffa359" + }, + "variable.css": { + "color": "#ffa359" + }, + "property.custom": { + "color": "#ffa359" + }, + "unit": { + "color": "#68cdf2" + }, + "number.unit": { + "color": "#68cdf2" + }, + "color": { + "color": "#ffd452" + }, + "constant.color": { + "color": "#ffd452" + }, + "keyword.important": { + "color": "#ff678d" + }, + "variable.language": { + "color": "#ffca00" + }, + "this": { + "color": "#ffca00" + }, + "self": { + "color": "#ffca00" + }, + "type.class": { + "color": "#d568ea" + }, + "property.object": { + "color": "#ffa359" + }, + "property_identifier": { + "color": "#ffa359" + }, + "shorthand_property_identifier": { + "color": "#ffa359" + }, + "shorthand_property_identifier_pattern": { + "color": "#ffa359" + }, + "method_definition": { + "color": "#9d6afb" + }, + "function.method.call": { + "color": "#9d6afb" + }, + "string.template": { + "color": "#5ecc71" + }, + "template_string": { + "color": "#5ecc71" + }, + "tag.jsx": { + "color": "#ff6762" + }, + "tag.component": { + "color": "#d568ea" + }, + "punctuation": { + "color": "#79797F" + }, + "punctuation.bracket": { + "color": "#79797F" + }, + "punctuation.delimiter": { + "color": "#79797F" + }, + "punctuation.list_marker": { + "color": "#79797F" + }, + "punctuation.special": { + "color": "#ff678d" + }, + "operator": { + "color": "#08c0ef" + }, + "tag": { + "color": "#ff6762" + }, + "attribute": { + "color": "#61d5c0" + }, + "label": { + "color": "#ffca00" + }, + "namespace": { + "color": "#ffca00" + }, + "embedded": { + "color": "#fbfbfb" + }, + "preproc": { + "color": "#ff678d" + }, + "text.literal": { + "color": "#5ecc71" + }, + "markup.heading": { + "color": "#ff6762", + "font_weight": 700 + }, + "markup.bold": { + "color": "#ffd452", + "font_weight": 700 + }, + "markup.italic": { + "color": "#ff678d", + "font_style": "italic" + }, + "markup.strikethrough": { + "color": "#84848A" + }, + "markup.link.url": { + "color": "#009fff" + }, + "markup.link.text": { + "color": "#9d6afb" + }, + "markup.quote": { + "color": "#84848A", + "font_style": "italic" + }, + "markup.list": { + "color": "#ff6762" + }, + "markup.list.numbered": { + "color": "#ff6762" + }, + "markup.list.unnumbered": { + "color": "#ff6762" + }, + "markup.raw": { + "color": "#5ecc71" + }, + "markup.raw.inline": { + "color": "#5ecc71" + }, + "markup.raw.block": { + "color": "#5ecc71" + }, + "diff.plus": { + "color": "#00cab1" + }, + "diff.minus": { + "color": "#ff2e3f" + }, + "diff.delta": { + "color": "#ffca00" + }, + "link_text": { + "color": "#009fff" + }, + "link_uri": { + "color": "#ff678d" + }, + "emphasis": { + "font_style": "italic" + }, + "emphasis.strong": { + "font_weight": 700 + }, + "primary": { + "color": "#009fff" + }, + "title": { + "color": "#ff6762", + "font_weight": 700 + }, + "predictive": { + "color": "#79797F", + "font_style": "italic" + } + } + } + } + ] +} \ No newline at end of file