diff --git a/crates/zed/assets/themes/dark.json b/crates/zed/assets/themes/dark.json index da7fa4650e..1334a65727 100644 --- a/crates/zed/assets/themes/dark.json +++ b/crates/zed/assets/themes/dark.json @@ -18,7 +18,7 @@ }, "highlight_text": { "family": "Zed Sans", - "color": "#2db4f3", + "color": "#1096d3", "weight": "bold", "size": 14 } @@ -38,7 +38,7 @@ }, "highlight_text": { "family": "Zed Sans", - "color": "#2db4f3", + "color": "#1096d3", "weight": "bold", "size": 14 }, @@ -70,8 +70,8 @@ "size": 14 }, "selection": { - "cursor": "#4287f6", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#103063" }, "text": { "family": "Zed Mono", @@ -111,8 +111,8 @@ "background": "#1c1c1c", "icon_close": "#555555", "icon_close_active": "#ffffff", - "icon_conflict": "#f7b241", - "icon_dirty": "#4287f6", + "icon_conflict": "#f6a724", + "icon_dirty": "#135acd", "icon_width": 8, "spacing": 10, "text": { @@ -137,8 +137,8 @@ "background": "#000000", "icon_close": "#555555", "icon_close_active": "#ffffff", - "icon_conflict": "#f7b241", - "icon_dirty": "#4287f6", + "icon_conflict": "#f6a724", + "icon_dirty": "#135acd", "icon_width": 8, "spacing": 10, "text": { @@ -289,7 +289,7 @@ }, "outdated_warning": { "family": "Zed Sans", - "color": "#f8c570", + "color": "#f7bb57", "size": 13 } }, @@ -297,7 +297,7 @@ "height": 34, "background": "#000000", "border": { - "color": "#070707", + "color": "#151515", "width": 1, "bottom": true }, @@ -325,54 +325,54 @@ } }, "editor": { - "text_color": "#f1f1f1", + "text_color": "#d5d5d5", "background": "#000000", "active_line_background": "#0e0e0e", "code_actions_indicator": "#9c9c9c", - "diff_background_deleted": "#f78c8c", - "diff_background_inserted": "#22c55e", - "document_highlight_read_background": "#777af4", - "document_highlight_write_background": "#777af4", - "error_color": "#f78c8c", + "diff_background_deleted": "#f15656", + "diff_background_inserted": "#1b9447", + "document_highlight_read_background": "#2b2b2b", + "document_highlight_write_background": "#2b2b2b", + "error_color": "#f15656", "gutter_background": "#000000", - "gutter_padding_factor": 2.5, + "gutter_padding_factor": 3.5, "highlighted_line_background": "#070707", "line_number": "#636363", "line_number_active": "#ffffff", "rename_fade": 0.6, "unnecessary_code_fade": 0.5, "selection": { - "cursor": "#4287f6", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#103063" }, "guest_selections": [ { - "cursor": "#87d116", - "selection": "#dbf9ac" + "cursor": "#79ba16", + "selection": "#38530f" }, { - "cursor": "#777af4", - "selection": "#d4d5fd" + "cursor": "#484bed", + "selection": "#121269" }, { - "cursor": "#f98a3d", - "selection": "#fde0cd" + "cursor": "#ee670a", + "selection": "#5d2f0e" }, { - "cursor": "#b671f8", - "selection": "#e9d4fd" + "cursor": "#993bf3", + "selection": "#3e1169" }, { - "cursor": "#16ddc7", - "selection": "#b4faf2" + "cursor": "#16d6c1", + "selection": "#0e4f48" }, { - "cursor": "#f58ac0", - "selection": "#fcd4e8" + "cursor": "#ef59a3", + "selection": "#fbc6e1" }, { - "cursor": "#f6bc09", - "selection": "#fceabc" + "cursor": "#f7bf17", + "selection": "#fce9b7" } ], "autocomplete": { @@ -406,7 +406,7 @@ "left": -14 }, "match_highlight": { - "color": "#59c3f5", + "color": "#4f8ff7", "weight": "normal" }, "selected_item": { @@ -481,12 +481,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#f78c8c", + "color": "#f15656", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#f78c8c", + "color": "#f15656", "size": 14, "weight": "bold" } @@ -504,12 +504,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#f8c570", + "color": "#f7bb57", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#f8c570", + "color": "#f7bb57", "size": 14, "weight": "bold" } @@ -527,12 +527,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14, "weight": "bold" } @@ -550,12 +550,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14, "weight": "bold" } @@ -653,7 +653,35 @@ } } }, - "syntax": {} + "syntax": { + "keyword": "#4f8ff7", + "function": "#f9da82", + "string": "#f99d5f", + "type": "#3eeeda", + "number": "#aeef4b", + "comment": "#aaaaaa", + "property": "#4f8ff7", + "variant": "#53c1f5", + "constant": "#d5d5d5", + "title": { + "color": "#de900c", + "weight": "bold" + }, + "emphasis": "#1096d3", + "emphasis_strong": { + "color": "#1096d3", + "weight": "bold" + }, + "link_uri": { + "color": "#79ba16", + "underline": true + }, + "link_text": { + "color": "#ee670a", + "italic": true + }, + "list_marker": "#20b0f2" + } }, "project_diagnostics": { "tab_icon_spacing": 4, @@ -929,8 +957,8 @@ "size": 14 }, "selection": { - "cursor": "#4287f6", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#103063" }, "border": { "color": "#151515", @@ -1067,7 +1095,7 @@ } }, "search": { - "match_background": "#87d116", + "match_background": "#0a2633", "tab_icon_spacing": 4, "tab_icon_width": 14, "active_hovered_option_button": { @@ -1123,8 +1151,8 @@ "size": 16 }, "selection": { - "cursor": "#4287f6", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#103063" }, "text": { "family": "Zed Mono", @@ -1177,8 +1205,8 @@ "size": 16 }, "selection": { - "cursor": "#4287f6", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#103063" }, "text": { "family": "Zed Mono", @@ -1186,7 +1214,7 @@ "size": 16 }, "border": { - "color": "#f47171", + "color": "#eb2d2d", "width": 1 }, "margin": { diff --git a/crates/zed/assets/themes/light.json b/crates/zed/assets/themes/light.json index dcff3352f7..283b3b10b3 100644 --- a/crates/zed/assets/themes/light.json +++ b/crates/zed/assets/themes/light.json @@ -18,7 +18,7 @@ }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "weight": "bold", "size": 14 } @@ -38,7 +38,7 @@ }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "weight": "bold", "size": 14 }, @@ -70,8 +70,8 @@ "size": 14 }, "selection": { - "cursor": "#6099f7", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#c5dafc" }, "text": { "family": "Zed Mono", @@ -111,8 +111,8 @@ "background": "#f1f1f1", "icon_close": "#555555", "icon_close_active": "#000000", - "icon_conflict": "#f6bc09", - "icon_dirty": "#4287f6", + "icon_conflict": "#f7bf17", + "icon_dirty": "#135acd", "icon_width": 8, "spacing": 10, "text": { @@ -137,8 +137,8 @@ "background": "#ffffff", "icon_close": "#555555", "icon_close_active": "#000000", - "icon_conflict": "#f6bc09", - "icon_dirty": "#4287f6", + "icon_conflict": "#f7bf17", + "icon_dirty": "#135acd", "icon_width": 8, "spacing": 10, "text": { @@ -289,7 +289,7 @@ }, "outdated_warning": { "family": "Zed Sans", - "color": "#e5af09", + "color": "#d3a20b", "size": 13 } }, @@ -297,7 +297,7 @@ "height": 34, "background": "#ffffff", "border": { - "color": "#c6c6c6", + "color": "#e3e3e3", "width": 1, "bottom": true }, @@ -327,52 +327,52 @@ "editor": { "text_color": "#2b2b2b", "background": "#ffffff", - "active_line_background": "#e3e3e3", + "active_line_background": "#f1f1f1", "code_actions_indicator": "#717171", - "diff_background_deleted": "#fdd4d4", - "diff_background_inserted": "#befad2", - "document_highlight_read_background": "#e3e3e3", - "document_highlight_write_background": "#e3e3e3", - "error_color": "#f47171", + "diff_background_deleted": "#fcc6c6", + "diff_background_inserted": "#b7f9ce", + "document_highlight_read_background": "#f1f1f1", + "document_highlight_write_background": "#f1f1f1", + "error_color": "#eb2d2d", "gutter_background": "#ffffff", - "gutter_padding_factor": 2.5, - "highlighted_line_background": "#e3e3e3", - "line_number": "#808080", + "gutter_padding_factor": 3.5, + "highlighted_line_background": "#f1f1f1", + "line_number": "#aaaaaa", "line_number_active": "#000000", "rename_fade": 0.6, "unnecessary_code_fade": 0.5, "selection": { - "cursor": "#6099f7", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#c5dafc" }, "guest_selections": [ { - "cursor": "#87d116", - "selection": "#dbf9ac" + "cursor": "#79ba16", + "selection": "#dffab5" }, { - "cursor": "#777af4", - "selection": "#d4d5fd" + "cursor": "#484bed", + "selection": "#cdcdfc" }, { - "cursor": "#f98a3d", - "selection": "#fde0cd" + "cursor": "#ee670a", + "selection": "#fcd6bd" }, { - "cursor": "#b671f8", - "selection": "#e9d4fd" + "cursor": "#993bf3", + "selection": "#e4cbfc" }, { - "cursor": "#16ddc7", - "selection": "#b4faf2" + "cursor": "#16d6c1", + "selection": "#b1faf2" }, { - "cursor": "#f58ac0", - "selection": "#fcd4e8" + "cursor": "#ef59a3", + "selection": "#fbc6e1" }, { - "cursor": "#f6bc09", - "selection": "#fceabc" + "cursor": "#f7bf17", + "selection": "#fce9b7" } ], "autocomplete": { @@ -400,13 +400,13 @@ "right": 6, "top": 2 }, - "background": "#f1f1f1" + "background": "#f8f8f8" }, "margin": { "left": -14 }, "match_highlight": { - "color": "#59c3f5", + "color": "#103063", "weight": "normal" }, "selected_item": { @@ -417,7 +417,7 @@ "right": 6, "top": 2 }, - "background": "#e3e3e3" + "background": "#f1f1f1" } }, "diagnostic_header": { @@ -453,7 +453,7 @@ } }, "diagnostic_path_header": { - "background": "#e3e3e3", + "background": "#f1f1f1", "text_scale_factor": 0.857, "filename": { "family": "Zed Mono", @@ -481,12 +481,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#f47171", + "color": "#eb2d2d", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#f47171", + "color": "#eb2d2d", "size": 14, "weight": "bold" } @@ -504,12 +504,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#e5af09", + "color": "#d3a20b", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#e5af09", + "color": "#d3a20b", "size": 14, "weight": "bold" } @@ -527,12 +527,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14, "weight": "bold" } @@ -550,12 +550,12 @@ "message": { "text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14 }, "highlight_text": { "family": "Zed Sans", - "color": "#6099f7", + "color": "#2472f2", "size": 14, "weight": "bold" } @@ -653,7 +653,35 @@ } } }, - "syntax": {} + "syntax": { + "keyword": "#103063", + "function": "#1b9447", + "string": "#bb550e", + "type": "#138a7d", + "number": "#14a898", + "comment": "#555555", + "property": "#134697", + "variant": "#1179a8", + "constant": "#393939", + "title": { + "color": "#1096d3", + "weight": "bold" + }, + "emphasis": "#2472f2", + "emphasis_strong": { + "color": "#2472f2", + "weight": "bold" + }, + "link_uri": { + "color": "#14a898", + "underline": true + }, + "link_text": { + "color": "#ee670a", + "italic": true + }, + "list_marker": "#20b0f2" + } }, "project_diagnostics": { "tab_icon_spacing": 4, @@ -929,8 +957,8 @@ "size": 14 }, "selection": { - "cursor": "#6099f7", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#c5dafc" }, "border": { "color": "#e3e3e3", @@ -1022,7 +1050,7 @@ "padding": { "left": 8 }, - "background": "#e3e3e3", + "background": "#f1f1f1", "corner_radius": 6 }, "unshared_project": { @@ -1062,7 +1090,7 @@ "padding": { "left": 8 }, - "background": "#e3e3e3", + "background": "#f1f1f1", "corner_radius": 6 } }, @@ -1123,8 +1151,8 @@ "size": 16 }, "selection": { - "cursor": "#6099f7", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#c5dafc" }, "text": { "family": "Zed Mono", @@ -1177,8 +1205,8 @@ "size": 16 }, "selection": { - "cursor": "#6099f7", - "selection": "#d0e2fd" + "cursor": "#2472f2", + "selection": "#c5dafc" }, "text": { "family": "Zed Mono", @@ -1186,7 +1214,7 @@ "size": 16 }, "border": { - "color": "#fbbdbd", + "color": "#f9a0a0", "width": 1 }, "margin": { diff --git a/styles/styleTree/editor.ts b/styles/styleTree/editor.ts index e760ecec6a..23c1e67ac6 100644 --- a/styles/styleTree/editor.ts +++ b/styles/styleTree/editor.ts @@ -49,7 +49,7 @@ export default function editor(theme: Theme) { documentHighlightWriteBackground: theme.editor.highlight.occurrence.value, errorColor: theme.textColor.error.value, gutterBackground: backgroundColor(theme, 500), - gutterPaddingFactor: 2.5, + gutterPaddingFactor: 3.5, highlightedLineBackground: theme.editor.line.highlighted.value, lineNumber: theme.editor.gutter.primary.value, lineNumberActive: theme.editor.gutter.active.value, @@ -129,7 +129,21 @@ export default function editor(theme: Theme) { invalidInformationDiagnostic: diagnostic(theme, "muted"), invalidWarningDiagnostic: diagnostic(theme, "muted"), syntax: { - - } + keyword: theme.syntax.keyword.color.value, + function: theme.syntax.function.color.value, + string: theme.syntax.string.color.value, + type: theme.syntax.type.color.value, + number: theme.syntax.number.color.value, + comment: theme.syntax.comment.color.value, + property: theme.syntax.property.color.value, + variant: theme.syntax.variant.color.value, + constant: theme.syntax.constant.color.value, + title: { color: theme.syntax.title.color.value, weight: "bold" }, + emphasis: theme.textColor.feature.value, + "emphasis.strong": { color: theme.textColor.feature.value, weight: "bold" }, + link_uri: { color: theme.syntax.linkUrl.color.value, underline: true }, + link_text: { color: theme.syntax.linkText.color.value, italic: true }, + list_marker: theme.syntax.listMarker.color.value, + }, }; } diff --git a/styles/styleTree/workspace.ts b/styles/styleTree/workspace.ts index 4349ba0ab6..030f8edc95 100644 --- a/styles/styleTree/workspace.ts +++ b/styles/styleTree/workspace.ts @@ -135,7 +135,7 @@ export default function workspace(theme: Theme) { toolbar: { height: 34, background: backgroundColor(theme, 500), - border: border(theme, "primary", { bottom: true }), + border: border(theme, "secondary", { bottom: true }), itemSpacing: 8, padding: { left: 16, right: 8, top: 4, bottom: 4 }, }, diff --git a/styles/themes/dark.ts b/styles/themes/dark.ts index 3cb3b653b4..3351d3d3fa 100644 --- a/styles/themes/dark.ts +++ b/styles/themes/dark.ts @@ -88,39 +88,39 @@ const iconColor = { const player = { 1: { - baseColor: colors.blue[600], - cursorColor: colors.blue[600], - selectionColor: colors.blue[100], - borderColor: colors.blue[600], + baseColor: colors.blue[500], + cursorColor: colors.blue[500], + selectionColor: colors.blue[800], + borderColor: colors.blue[800], }, 2: { baseColor: colors.lime[500], cursorColor: colors.lime[500], - selectionColor: colors.lime[100], + selectionColor: colors.lime[800], borderColor: colors.lime[500], }, 3: { baseColor: colors.indigo[500], cursorColor: colors.indigo[500], - selectionColor: colors.indigo[100], + selectionColor: colors.indigo[800], borderColor: colors.indigo[500], }, 4: { baseColor: colors.orange[500], cursorColor: colors.orange[500], - selectionColor: colors.orange[100], + selectionColor: colors.orange[800], borderColor: colors.orange[500], }, 5: { baseColor: colors.purple[500], cursorColor: colors.purple[500], - selectionColor: colors.purple[100], + selectionColor: colors.purple[800], borderColor: colors.purple[500], }, 6: { baseColor: colors.teal[400], cursorColor: colors.teal[400], - selectionColor: colors.teal[100], + selectionColor: colors.teal[800], borderColor: colors.teal[400], }, 7: { @@ -151,11 +151,11 @@ const editor = { }, highlight: { selection: player[1].selectionColor, - occurrence: colors.indigo[500], // TODO: Why does indigo[500], indigo[100], and indigo[900] all give me the same color? @kethku - activeOccurrence: colors.indigo[400], // TODO: We don't seem to be using this right now in rust + occurrence: colors.neutral[750], + activeOccurrence: colors.neutral[700], matchingBracket: backgroundColor[500].active, - match: colors.lime[500], - activeMatch: colors.lime[400], + match: colors.sky[900], + activeMatch: colors.sky[800], related: backgroundColor[500].focused, }, gutter: { @@ -166,15 +166,15 @@ const editor = { const syntax: Syntax = { primary: { - color: textColor.primary, + color: colors.neutral[150], weight: fontWeights.normal, }, comment: { - color: colors.lime[200], + color: colors.neutral[300], weight: fontWeights.normal, }, punctuation: { - color: textColor.primary, + color: colors.neutral[200], weight: fontWeights.normal, }, constant: { @@ -182,7 +182,7 @@ const syntax: Syntax = { weight: fontWeights.normal, }, keyword: { - color: colors.sky[400], + color: colors.blue[400], weight: fontWeights.normal, }, function: { @@ -194,19 +194,19 @@ const syntax: Syntax = { weight: fontWeights.normal, }, variant: { - color: colors.teal[300], - weight: fontWeights.normal, - }, - property: { color: colors.sky[300], weight: fontWeights.normal, }, + property: { + color: colors.blue[400], + weight: fontWeights.normal, + }, enum: { - color: colors.sky[400], + color: colors.orange[500], weight: fontWeights.normal, }, operator: { - color: colors.sky[400], + color: colors.orange[500], weight: fontWeights.normal, }, string: { @@ -214,11 +214,11 @@ const syntax: Syntax = { weight: fontWeights.normal, }, number: { - color: colors.neutral[150], + color: colors.lime[300], weight: fontWeights.normal, }, boolean: { - color: colors.neutral[150], + color: colors.lime[300], weight: fontWeights.normal, }, predictive: { @@ -226,7 +226,7 @@ const syntax: Syntax = { weight: fontWeights.normal, }, title: { - color: colors.sky[500], + color: colors.amber[500], weight: fontWeights.bold, }, emphasis: { diff --git a/styles/themes/light.ts b/styles/themes/light.ts index ee94e18b19..649fd719a8 100644 --- a/styles/themes/light.ts +++ b/styles/themes/light.ts @@ -18,9 +18,9 @@ const backgroundColor = { }, 500: { base: colors.neutral[0], - hovered: colors.neutral[50], - active: colors.neutral[100], - focused: colors.neutral[50], + hovered: colors.neutral[25], + active: colors.neutral[50], + focused: colors.neutral[75], }, ok: { base: colors.green[100], @@ -159,66 +159,66 @@ const editor = { related: colors.neutral[0], }, gutter: { - primary: textColor.muted, + primary: colors.neutral[300], active: textColor.active, }, }; const syntax: Syntax = { primary: { - color: textColor.primary, + color: colors.neutral[750], weight: fontWeights.normal, }, comment: { - color: colors.lime[200], + color: colors.neutral[600], weight: fontWeights.normal, }, punctuation: { - color: textColor.primary, + color: colors.neutral[700], weight: fontWeights.normal, }, constant: { - color: colors.neutral[150], + color: colors.neutral[700], weight: fontWeights.normal, }, keyword: { - color: colors.sky[400], + color: colors.blue[800], weight: fontWeights.normal, }, function: { - color: colors.yellow[200], + color: colors.green[600], weight: fontWeights.normal, }, type: { - color: colors.teal[300], + color: colors.teal[600], weight: fontWeights.normal, }, variant: { - color: colors.teal[300], + color: colors.sky[600], weight: fontWeights.normal, }, property: { - color: colors.sky[300], + color: colors.blue[700], weight: fontWeights.normal, }, enum: { - color: colors.sky[400], + color: colors.orange[600], weight: fontWeights.normal, }, operator: { - color: colors.sky[400], + color: colors.orange[600], weight: fontWeights.normal, }, string: { - color: colors.orange[300], + color: colors.orange[600], weight: fontWeights.normal, }, number: { - color: colors.neutral[150], + color: colors.teal[500], weight: fontWeights.normal, }, boolean: { - color: colors.neutral[150], + color: colors.amber[600], weight: fontWeights.normal, }, predictive: { @@ -238,7 +238,7 @@ const syntax: Syntax = { weight: fontWeights.bold, }, linkUrl: { - color: colors.lime[500], + color: colors.teal[500], weight: fontWeights.normal, // TODO: add underline }, diff --git a/styles/utils/color.ts b/styles/utils/color.ts index 156fc5ba41..e69d903a43 100644 --- a/styles/utils/color.ts +++ b/styles/utils/color.ts @@ -17,14 +17,14 @@ export function colorRamp( } else { let hue = Math.round(chroma(color).hsl()[0]); let startColor = chroma.hsl(hue, 0.88, 0.96); - let endColor = chroma.hsl(hue, 0.68, 0.32); + let endColor = chroma.hsl(hue, 0.68, 0.12); scale = chroma .scale([startColor, color, endColor]) .domain([0, 0.5, 1]) .mode("hsl") .gamma(1) - .correctLightness(true) - .padding([0, 0.15]); + // .correctLightness(true) + .padding([0, 0]); } const ramp: ColorRamp = {};