mirrors/zed
1
0
Fork 0
mirror of https://github.com/zed-industries/zed.git synced 2024-12-25 01:34:02 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 9

Merge pull request #1783 from zed-industries/add-new-internal-themes

Browse source 
Add new internal themes
This commit is contained in:
Nate Butler 2022-10-21 18:31:02 -04:00 committed by GitHub
commit ef5844bc79
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
36 changed files with 1054 additions and 403 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
.gitignore vendored
View file

@ -7,6 +7,6 @@
/crates/collab/static/styles.css
/vendor/bin
/assets/themes/*.json
/assets/themes/internal/*.json
/assets/themes/experiments/*.json
/assets/themes/Internal/*.json
/assets/themes/Experiments/*.json
**/venv

450
assets/settings/default.json
View file

@ -1,230 +1,230 @@
{
// The name of the Zed theme to use for the UI
"theme": "one-dark",
// The name of a font to use for rendering text in the editor
"buffer_font_family": "Zed Mono",
// The default font size for text in the editor
"buffer_font_size": 15,
// Whether to enable vim modes and key bindings
"vim_mode": false,
// Whether to show the informational hover box when moving the mouse
// over symbols in the editor.
"hover_popover_enabled": true,
// Whether the cursor blinks in the editor.
"cursor_blink": true,
// Whether to pop the completions menu while typing in an editor without
// explicitly requesting it.
"show_completions_on_input": true,
// Whether new projects should start out 'online'. Online projects
// appear in the contacts panel under your name, so that your contacts
// can see which projects you are working on. Regardless of this
// setting, projects keep their last online status when you reopen them.
"projects_online_by_default": true,
// Whether to use language servers to provide code intelligence.
"enable_language_server": true,
// When to automatically save edited buffers. This setting can
// take four values.
//
// 1. Never automatically save:
// "autosave": "off",
// 2. Save when changing focus away from the Zed window:
// "autosave": "on_window_change",
// 3. Save when changing focus away from a specific buffer:
// "autosave": "on_focus_change",
// 4. Save when idle for a certain amount of time:
// "autosave": { "after_delay": {"milliseconds": 500} },
"autosave": "off",
// Where to place the dock by default. This setting can take three
// values:
//
// 1. Position the dock attached to the bottom of the workspace
// "default_dock_anchor": "bottom"
// 2. Position the dock to the right of the workspace like a side panel
// "default_dock_anchor": "right"
// 3. Position the dock full screen over the entire workspace"
// "default_dock_anchor": "expanded"
"default_dock_anchor": "right",
// Whether or not to perform a buffer format before saving
"format_on_save": "on",
// How to perform a buffer format. This setting can take two values:
//
// 1. Format code using the current language server:
// "format_on_save": "language_server"
// 2. Format code using an external command:
// "format_on_save": {
// "external": {
// "command": "prettier",
// "arguments": ["--stdin-filepath", "{buffer_path}"]
// }
// The name of the Zed theme to use for the UI
"theme": "One Dark",
// The name of a font to use for rendering text in the editor
"buffer_font_family": "Zed Mono",
// The default font size for text in the editor
"buffer_font_size": 15,
// Whether to enable vim modes and key bindings
"vim_mode": false,
// Whether to show the informational hover box when moving the mouse
// over symbols in the editor.
"hover_popover_enabled": true,
// Whether the cursor blinks in the editor.
"cursor_blink": true,
// Whether to pop the completions menu while typing in an editor without
// explicitly requesting it.
"show_completions_on_input": true,
// Whether new projects should start out 'online'. Online projects
// appear in the contacts panel under your name, so that your contacts
// can see which projects you are working on. Regardless of this
// setting, projects keep their last online status when you reopen them.
"projects_online_by_default": true,
// Whether to use language servers to provide code intelligence.
"enable_language_server": true,
// When to automatically save edited buffers. This setting can
// take four values.
//
// 1. Never automatically save:
// "autosave": "off",
// 2. Save when changing focus away from the Zed window:
// "autosave": "on_window_change",
// 3. Save when changing focus away from a specific buffer:
// "autosave": "on_focus_change",
// 4. Save when idle for a certain amount of time:
// "autosave": { "after_delay": {"milliseconds": 500} },
"autosave": "off",
// Where to place the dock by default. This setting can take three
// values:
//
// 1. Position the dock attached to the bottom of the workspace
// "default_dock_anchor": "bottom"
// 2. Position the dock to the right of the workspace like a side panel
// "default_dock_anchor": "right"
// 3. Position the dock full screen over the entire workspace"
// "default_dock_anchor": "expanded"
"default_dock_anchor": "right",
// Whether or not to perform a buffer format before saving
"format_on_save": "on",
// How to perform a buffer format. This setting can take two values:
//
// 1. Format code using the current language server:
// "format_on_save": "language_server"
// 2. Format code using an external command:
// "format_on_save": {
// "external": {
// "command": "prettier",
// "arguments": ["--stdin-filepath", "{buffer_path}"]
// }
// }
"formatter": "language_server",
// How to soft-wrap long lines of text. This setting can take
// three values:
//
// 1. Do not soft wrap.
// "soft_wrap": "none",
// 2. Soft wrap lines that overflow the editor:
// "soft_wrap": "editor_width",
// 3. Soft wrap lines at the preferred line length
// "soft_wrap": "preferred_line_length",
"soft_wrap": "none",
// The column at which to soft-wrap lines, for buffers where soft-wrap
// is enabled.
"preferred_line_length": 80,
// Whether to indent lines using tab characters, as opposed to multiple
// spaces.
"hard_tabs": false,
// How many columns a tab should occupy.
"tab_size": 4,
// Git gutter behavior configuration.
"git": {
// Control whether the git gutter is shown. May take 2 values:
// 1. Show the gutter
// "git_gutter": "tracked_files"
// 2. Hide the gutter
// "git_gutter": "hide"
"git_gutter": "tracked_files"
},
// Settings specific to journaling
"journal": {
// The path of the directory where journal entries are stored
"path": "~",
// What format to display the hours in
// May take 2 values:
// 1. hour12
// 2. hour24
"hour_format": "hour12"
},
// Settings specific to the terminal
"terminal": {
// What shell to use when opening a terminal. May take 3 values:
// 1. Use the system's default terminal configuration (e.g. $TERM).
// "shell": "system"
// 2. A program:
// "shell": {
// "program": "sh"
// }
// 3. A program with arguments:
// "shell": {
// "with_arguments": {
// "program": "/bin/bash",
// "arguments": ["--login"]
// }
// }
"formatter": "language_server",
// How to soft-wrap long lines of text. This setting can take
// three values:
"shell": "system",
// What working directory to use when launching the terminal.
// May take 4 values:
// 1. Use the current file's project directory. Will Fallback to the
// first project directory strategy if unsuccessful
// "working_directory": "current_project_directory"
// 2. Use the first project in this workspace's directory
// "working_directory": "first_project_directory"
// 3. Always use this platform's home directory (if we can find it)
// "working_directory": "always_home"
// 4. Always use a specific directory. This value will be shell expanded.
// If this path is not a valid directory the terminal will default to
// this platform's home directory (if we can find it)
// "working_directory": {
// "always": {
// "directory": "~/zed/projects/"
// }
// }
//
// 1. Do not soft wrap.
// "soft_wrap": "none",
// 2. Soft wrap lines that overflow the editor:
// "soft_wrap": "editor_width",
// 3. Soft wrap lines at the preferred line length
// "soft_wrap": "preferred_line_length",
"soft_wrap": "none",
// The column at which to soft-wrap lines, for buffers where soft-wrap
// is enabled.
"preferred_line_length": 80,
// Whether to indent lines using tab characters, as opposed to multiple
// spaces.
"hard_tabs": false,
// How many columns a tab should occupy.
"tab_size": 4,
// Git gutter behavior configuration.
"git": {
// Control whether the git gutter is shown. May take 2 values:
// 1. Show the gutter
// "git_gutter": "tracked_files"
// 2. Hide the gutter
// "git_gutter": "hide"
"git_gutter": "tracked_files"
},
// Settings specific to journaling
"journal": {
// The path of the directory where journal entries are stored
"path": "~",
// What format to display the hours in
// May take 2 values:
// 1. hour12
// 2. hour24
"hour_format": "hour12"
},
// Settings specific to the terminal
"terminal": {
// What shell to use when opening a terminal. May take 3 values:
// 1. Use the system's default terminal configuration (e.g. $TERM).
// "shell": "system"
// 2. A program:
// "shell": {
// "program": "sh"
// }
// 3. A program with arguments:
// "shell": {
// "with_arguments": {
// "program": "/bin/bash",
// "arguments": ["--login"]
// }
// }
"shell": "system",
// What working directory to use when launching the terminal.
// May take 4 values:
// 1. Use the current file's project directory. Will Fallback to the
// first project directory strategy if unsuccessful
// "working_directory": "current_project_directory"
// 2. Use the first project in this workspace's directory
// "working_directory": "first_project_directory"
// 3. Always use this platform's home directory (if we can find it)
// "working_directory": "always_home"
// 4. Always use a specific directory. This value will be shell expanded.
// If this path is not a valid directory the terminal will default to
// this platform's home directory (if we can find it)
// "working_directory": {
// "always": {
// "directory": "~/zed/projects/"
// }
// }
//
//
"working_directory": "current_project_directory",
// Set the cursor blinking behavior in the terminal.
// May take 4 values:
// 1. Never blink the cursor, ignoring the terminal mode
// "blinking": "off",
// 2. Default the cursor blink to off, but allow the terminal to
// set blinking
// "blinking": "terminal_controlled",
// 3. Always blink the cursor, ignoring the terminal mode
// "blinking": "on",
"blinking": "terminal_controlled",
// Set whether Alternate Scroll mode (code: ?1007) is active by default.
// Alternate Scroll mode converts mouse scroll events into up / down key
// presses when in the alternate screen (e.g. when running applications
// like vim or less). The terminal can still set and unset this mode.
// May take 2 values:
// 1. Default alternate scroll mode to on
// "alternate_scroll": "on",
// 2. Default alternate scroll mode to off
// "alternate_scroll": "off",
"alternate_scroll": "off",
// Set whether the option key behaves as the meta key.
// May take 2 values:
// 1. Rely on default platform handling of option key, on macOS
// this means generating certain unicode characters
// "option_to_meta": false,
// 2. Make the option keys behave as a 'meta' key, e.g. for emacs
// "option_to_meta": true,
"option_as_meta": false,
// Whether or not selecting text in the terminal will automatically
// copy to the system clipboard.
"copy_on_select": false,
// Any key-value pairs added to this list will be added to the terminal's
// enviroment. Use `:` to seperate multiple values.
"env": {
// "KEY": "value1:value2"
}
// Set the terminal's font size. If this option is not included,
// the terminal will default to matching the buffer's font size.
// "font_size": "15"
// Set the terminal's font family. If this option is not included,
// the terminal will default to matching the buffer's font family.
// "font_family": "Zed Mono"
},
// Different settings for specific languages.
"languages": {
"Plain Text": {
"soft_wrap": "preferred_line_length"
},
"C": {
"tab_size": 2
},
"C++": {
"tab_size": 2
},
"Elixir": {
"tab_size": 2
},
"Go": {
"tab_size": 4,
"hard_tabs": true
},
"Markdown": {
"soft_wrap": "preferred_line_length"
},
"Rust": {
"tab_size": 4
},
"JavaScript": {
"tab_size": 2
},
"TypeScript": {
"tab_size": 2
},
"TSX": {
"tab_size": 2
}
},
// LSP Specific settings.
"lsp": {
// Specify the LSP name as a key here.
// As of 8/10/22, supported LSPs are:
// pyright
// gopls
// rust-analyzer
// typescript-language-server
// vscode-json-languageserver
// "rust_analyzer": {
// //These initialization options are merged into Zed's defaults
// "initialization_options": {
// "checkOnSave": {
// "command": "clippy"
// }
// }
// }
//
"working_directory": "current_project_directory",
// Set the cursor blinking behavior in the terminal.
// May take 4 values:
// 1. Never blink the cursor, ignoring the terminal mode
// "blinking": "off",
// 2. Default the cursor blink to off, but allow the terminal to
// set blinking
// "blinking": "terminal_controlled",
// 3. Always blink the cursor, ignoring the terminal mode
// "blinking": "on",
"blinking": "terminal_controlled",
// Set whether Alternate Scroll mode (code: ?1007) is active by default.
// Alternate Scroll mode converts mouse scroll events into up / down key
// presses when in the alternate screen (e.g. when running applications
// like vim or less). The terminal can still set and unset this mode.
// May take 2 values:
// 1. Default alternate scroll mode to on
// "alternate_scroll": "on",
// 2. Default alternate scroll mode to off
// "alternate_scroll": "off",
"alternate_scroll": "off",
// Set whether the option key behaves as the meta key.
// May take 2 values:
// 1. Rely on default platform handling of option key, on macOS
// this means generating certain unicode characters
// "option_to_meta": false,
// 2. Make the option keys behave as a 'meta' key, e.g. for emacs
// "option_to_meta": true,
"option_as_meta": false,
// Whether or not selecting text in the terminal will automatically
// copy to the system clipboard.
"copy_on_select": false,
// Any key-value pairs added to this list will be added to the terminal's
// enviroment. Use `:` to seperate multiple values.
"env": {
// "KEY": "value1:value2"
}
// Set the terminal's font size. If this option is not included,
// the terminal will default to matching the buffer's font size.
// "font_size": "15"
// Set the terminal's font family. If this option is not included,
// the terminal will default to matching the buffer's font family.
// "font_family": "Zed Mono"
},
// Different settings for specific languages.
"languages": {
"Plain Text": {
"soft_wrap": "preferred_line_length"
},
"C": {
"tab_size": 2
},
"C++": {
"tab_size": 2
},
"Elixir": {
"tab_size": 2
},
"Go": {
"tab_size": 4,
"hard_tabs": true
},
"Markdown": {
"soft_wrap": "preferred_line_length"
},
"Rust": {
"tab_size": 4
},
"JavaScript": {
"tab_size": 2
},
"TypeScript": {
"tab_size": 2
},
"TSX": {
"tab_size": 2
}
},
// LSP Specific settings.
"lsp": {
// Specify the LSP name as a key here.
// As of 8/10/22, supported LSPs are:
// pyright
// gopls
// rust-analyzer
// typescript-language-server
// vscode-json-languageserver
// "rust_analyzer": {
// //These initialization options are merged into Zed's defaults
// "initialization_options": {
// "checkOnSave": {
// "command": "clippy"
// }
// }
// }
}
}

0
assets/themes/experiments/.gitkeep
View file

0
assets/themes/internal/.gitkeep
View file

2
crates/settings/src/settings.rs
View file

@ -665,7 +665,7 @@ mod tests {
fn test_write_theme_into_settings_with_theme() {
let settings = r#"
{
"theme": "one-dark"
"theme": "One Dark"
}
"#
.unindent();

4
crates/theme/src/theme_registry.rs
View file

@ -28,14 +28,14 @@ impl ThemeRegistry {
if !internal {
dirs = dirs
.into_iter()
.filter(|path| !path.starts_with("themes/internal"))
.filter(|path| !path.starts_with("themes/Internal"))
.collect()
}
if !experiments {
dirs = dirs
.into_iter()
.filter(|path| !path.starts_with("themes/experiments"))
.filter(|path| !path.starts_with("themes/Experiments"))
.collect()
}

19
styles/src/buildThemes.ts
View file

@ -10,17 +10,22 @@ import snakeCase from "./utils/snakeCase";
import { ColorScheme } from "./themes/common/colorScheme";
const themeDirectory = `${__dirname}/../../assets/themes`;
const internalDirectory = `${themeDirectory}/internal`;
const experimentsDirectory = `${themeDirectory}/experiments`;
const internalDirectory = `${themeDirectory}/Internal`;
const experimentsDirectory = `${themeDirectory}/Experiments`;
const tempDirectory = fs.mkdtempSync(path.join(tmpdir(), "build-themes"));
// Clear existing themes
function clearThemes(themeDirectory: string) {
for (const file of fs.readdirSync(themeDirectory)) {
if (file.endsWith(".json")) {
const name = file.replace(/\.json$/, "");
if (!colorSchemes.find((colorScheme) => colorScheme.name === name)) {
fs.unlinkSync(path.join(themeDirectory, file));
if (!fs.existsSync(themeDirectory)) {
fs.mkdirSync(themeDirectory, { recursive: true });
} else {
for (const file of fs.readdirSync(themeDirectory)) {
if (file.endsWith(".json")) {
const name = file.replace(/\.json$/, "");
if (!colorSchemes.find((colorScheme) => colorScheme.name === name)) {
fs.unlinkSync(path.join(themeDirectory, file));
}
}
}
}

8
styles/src/themes/andromeda.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "andromeda";
const name = "Andromeda";
const author = "EliverLara";
const url = "https://github.com/EliverLara/Andromeda";
const license = {
type: "MIT",
url: "https://github.com/EliverLara/Andromeda/blob/master/LICENSE.md",
};
const ramps = {
neutral: chroma

17
styles/src/themes/cave.ts → styles/src/themes/atelier-cave.ts
View file

@ -1,9 +1,15 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "cave";
const name = "Atelier Cave";
const author = "atelierbram";
const url = "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave/";
const license = {
type: "MIT",
url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
};
export const dark = createColorScheme(`${name}-dark`, false, {
export const dark = createColorScheme(`${name} Dark`, false, {
neutral: chroma
.scale([
"#19171c",
@ -26,7 +32,7 @@ export const dark = createColorScheme(`${name}-dark`, false, {
magenta: colorRamp(chroma("#bf40bf")),
});
export const light = createColorScheme(`${name}-light`, true, {
export const light = createColorScheme(`${name} Light`, true, {
neutral: chroma
.scale([
"#19171c",
@ -37,7 +43,8 @@ export const light = createColorScheme(`${name}-light`, true, {
"#8b8792",
"#e2dfe7",
"#efecf4",
]).correctLightness(),
])
.correctLightness(),
red: colorRamp(chroma("#be4678")),
orange: colorRamp(chroma("#aa573c")),
yellow: colorRamp(chroma("#a06e3b")),
@ -46,4 +53,4 @@ export const light = createColorScheme(`${name}-light`, true, {
blue: colorRamp(chroma("#576ddb")),
violet: colorRamp(chroma("#955ae7")),
magenta: colorRamp(chroma("#bf40bf")),
});
});

12
styles/src/themes/sulphurpool.ts → styles/src/themes/atelier-sulphurpool.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "sulphurpool";
const name = "Atelier Sulphurpool";
const author = "atelierbram";
const url = "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune/";
const license = {
type: "MIT",
url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
};
const ramps = {
neutral: chroma
@ -26,5 +32,5 @@ const ramps = {
magenta: colorRamp(chroma("#9c637a")),
};
export const dark = createColorScheme(`${name}-dark`, false, ramps);
export const light = createColorScheme(`${name}-light`, true, ramps);
export const dark = createColorScheme(`${name} Dark`, false, ramps);
export const light = createColorScheme(`${name} Light`, true, ramps);

6
styles/src/themes/common/base16.ts
View file

@ -116,8 +116,8 @@ export function createTheme(
on500Ok: {
base: sample(ramps.green, 0.05),
hovered: sample(ramps.green, 0.1),
active: sample(ramps.green, 0.15)
}
active: sample(ramps.green, 0.15),
},
};
const borderColor = {
@ -186,7 +186,7 @@ export function createTheme(
weight: fontWeights.normal,
},
"variable.special": {
color: sample(ramps.blue, 0.80),
color: sample(ramps.blue, 0.8),
weight: fontWeights.normal,
},
comment: {

16
styles/src/themes/common/ramps.ts
View file

@ -142,9 +142,13 @@ function buildStyleSet(
ramp: Scale,
backgroundBase: number,
foregroundBase: number,
step: number = 0.08,
step: number = 0.08
): StyleSet {
let styleDefinitions = buildStyleDefinition(backgroundBase, foregroundBase, step);
let styleDefinitions = buildStyleDefinition(
backgroundBase,
foregroundBase,
step
);
function colorString(indexOrColor: number | Color): string {
if (typeof indexOrColor === "number") {
@ -172,7 +176,11 @@ function buildStyleSet(
};
}
function buildStyleDefinition(bgBase: number, fgBase: number, step: number = 0.08) {
function buildStyleDefinition(
bgBase: number,
fgBase: number,
step: number = 0.08
) {
return {
background: {
default: bgBase,
@ -199,4 +207,4 @@ function buildStyleDefinition(bgBase: number, fgBase: number, step: number = 0.0
inverted: bgBase + step * 2,
},
};
}
}

73
styles/src/themes/experiments/brushtrees.ts Normal file
View file

@ -0,0 +1,73 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Brush Trees";
const author = "Abraham White <abelincoln.white@gmail.com>";
const url = "https://github.com/WhiteAbeLincoln/base16-brushtrees-scheme";
const license = {
type: "MIT",
url: "https://github.com/WhiteAbeLincoln/base16-brushtrees-scheme/blob/master/LICENSE"
}
export const dark = createColorScheme(`${name} Dark`, false, {
neutral: chroma.scale([
"#485867",
"#5A6D7A",
"#6D828E",
"#8299A1",
"#98AFB5",
"#B0C5C8",
"#C9DBDC",
"#E3EFEF",
]),
red: colorRamp(chroma("#b38686")),
orange: colorRamp(chroma("#d8bba2")),
yellow: colorRamp(chroma("#aab386")),
green: colorRamp(chroma("#87b386")),
cyan: colorRamp(chroma("#86b3b3")),
blue: colorRamp(chroma("#868cb3")),
violet: colorRamp(chroma("#b386b2")),
magenta: colorRamp(chroma("#b39f9f")),
});
export const mirage = createColorScheme(`${name} Mirage`, false, {
neutral: chroma.scale([
"#485867",
"#5A6D7A",
"#6D828E",
"#8299A1",
"#98AFB5",
"#B0C5C8",
"#C9DBDC",
"#E3EFEF",
]),
red: colorRamp(chroma("#F28779")),
orange: colorRamp(chroma("#FFAD66")),
yellow: colorRamp(chroma("#FFD173")),
green: colorRamp(chroma("#D5FF80")),
cyan: colorRamp(chroma("#95E6CB")),
blue: colorRamp(chroma("#5CCFE6")),
violet: colorRamp(chroma("#D4BFFF")),
magenta: colorRamp(chroma("#F29E74")),
});
export const light = createColorScheme(`${name} Light`, true, {
neutral: chroma.scale([
"#1A1F29",
"#242936",
"#5C6773",
"#828C99",
"#ABB0B6",
"#F8F9FA",
"#F3F4F5",
"#FAFAFA",
]),
red: colorRamp(chroma("#b38686")),
orange: colorRamp(chroma("#d8bba2")),
yellow: colorRamp(chroma("#aab386")),
green: colorRamp(chroma("#87b386")),
cyan: colorRamp(chroma("#86b3b3")),
blue: colorRamp(chroma("#868cb3")),
violet: colorRamp(chroma("#b386b2")),
magenta: colorRamp(chroma("#b39f9f")),
});

34
styles/src/themes/internal/atelier-dune.ts Normal file
View file

@ -0,0 +1,34 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Atelier Dune";
const author = "atelierbram";
const url = "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune/";
const license = {
type: "MIT",
url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
};
const ramps = {
neutral: chroma.scale([
"#20201d",
"#292824",
"#6e6b5e",
"#7d7a68",
"#999580",
"#a6a28c",
"#e8e4cf",
"#fefbec",
]),
red: colorRamp(chroma("#d73737")),
orange: colorRamp(chroma("#b65611")),
yellow: colorRamp(chroma("#ae9513")),
green: colorRamp(chroma("#60ac39")),
cyan: colorRamp(chroma("#1fad83")),
blue: colorRamp(chroma("#6684e1")),
violet: colorRamp(chroma("#b854d4")),
magenta: colorRamp(chroma("#d43552")),
};
export const dark = createColorScheme(`${name} Dark`, false, ramps);
export const light = createColorScheme(`${name} Light`, true, ramps);

53
styles/src/themes/internal/atelier-heath.ts Normal file
View file

@ -0,0 +1,53 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Atelier Heath";
const author = "atelierbram";
const url = "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath/";
const license = {
type: "MIT",
url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name} Dark`, false, {
neutral: chroma.scale([
"#1b181b",
"#292329",
"#695d69",
"#776977",
"#9e8f9e",
"#ab9bab",
"#d8cad8",
"#f7f3f7",
]),
red: colorRamp(chroma("#ca402b")),
orange: colorRamp(chroma("#a65926")),
yellow: colorRamp(chroma("#bb8a35")),
green: colorRamp(chroma("#918b3b")),
cyan: colorRamp(chroma("#159393")),
blue: colorRamp(chroma("#516aec")),
violet: colorRamp(chroma("#7b59c0")),
magenta: colorRamp(chroma("#cc33cc")),
});
export const light = createColorScheme(`${name} Light`, true, {
neutral: chroma.scale([
"#161b1d",
"#1f292e",
"#516d7b",
"#5a7b8c",
"#7195a8",
"#7ea2b4",
"#c1e4f6",
"#ebf8ff",
]),
red: colorRamp(chroma("#d22d72")),
orange: colorRamp(chroma("#935c25")),
yellow: colorRamp(chroma("#8a8a0f")),
green: colorRamp(chroma("#568c3b")),
cyan: colorRamp(chroma("#2d8f6f")),
blue: colorRamp(chroma("#257fad")),
violet: colorRamp(chroma("#6b6bb8")),
magenta: colorRamp(chroma("#b72dd2")),
});

34
styles/src/themes/internal/atelier-seaside.ts Normal file
View file

@ -0,0 +1,34 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Atelier Seaside";
const author = "atelierbram";
const url = "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/";
const license = {
type: "MIT",
url: "https://github.com/atelierbram/syntax-highlighting/blob/master/LICENSE",
};
const ramps = {
neutral: chroma.scale([
"#131513",
"#242924",
"#5e6e5e",
"#687d68",
"#809980",
"#8ca68c",
"#cfe8cf",
"#f4fbf4",
]),
red: colorRamp(chroma("#e6193c")),
orange: colorRamp(chroma("#87711d")),
yellow: colorRamp(chroma("#98981b")),
green: colorRamp(chroma("#29a329")),
cyan: colorRamp(chroma("#1999b3")),
blue: colorRamp(chroma("#3d62f5")),
violet: colorRamp(chroma("#ad2bee")),
magenta: colorRamp(chroma("#e619c3")),
};
export const dark = createColorScheme(`${name} Dark`, false, ramps);
export const light = createColorScheme(`${name} Light`, true, ramps);

31
styles/src/themes/internal/ayu-mirage.ts Normal file
View file

@ -0,0 +1,31 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Ayu";
const author = "Konstantin Pschera <me@kons.ch>";
const url = "https://github.com/ayu-theme/ayu-colors";
const license = {
type: "MIT",
url: "https://github.com/ayu-theme/ayu-colors/blob/master/license"
}
export const dark = createColorScheme(`${name} Mirage`, false, {
neutral: chroma.scale([
"#171B24",
"#1F2430",
"#242936",
"#707A8C",
"#8A9199",
"#CCCAC2",
"#D9D7CE",
"#F3F4F5",
]),
red: colorRamp(chroma("#F28779")),
orange: colorRamp(chroma("#FFAD66")),
yellow: colorRamp(chroma("#FFD173")),
green: colorRamp(chroma("#D5FF80")),
cyan: colorRamp(chroma("#95E6CB")),
blue: colorRamp(chroma("#5CCFE6")),
violet: colorRamp(chroma("#D4BFFF")),
magenta: colorRamp(chroma("#F29E74")),
});

52
styles/src/themes/internal/ayu.ts Normal file
View file

@ -0,0 +1,52 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Ayu";
const author = "Konstantin Pschera <me@kons.ch>";
const url = "https://github.com/ayu-theme/ayu-colors";
const license = {
type: "MIT",
url: "https://github.com/ayu-theme/ayu-colors/blob/master/license"
}
export const dark = createColorScheme(`${name} Dark`, false, {
neutral: chroma.scale([
"#0F1419",
"#131721",
"#272D38",
"#3E4B59",
"#BFBDB6",
"#E6E1CF",
"#E6E1CF",
"#F3F4F5",
]),
red: colorRamp(chroma("#F07178")),
orange: colorRamp(chroma("#FF8F40")),
yellow: colorRamp(chroma("#FFB454")),
green: colorRamp(chroma("#B8CC52")),
cyan: colorRamp(chroma("#95E6CB")),
blue: colorRamp(chroma("#59C2FF")),
violet: colorRamp(chroma("#D2A6FF")),
magenta: colorRamp(chroma("#E6B673")),
});
export const light = createColorScheme(`${name} Light`, true, {
neutral: chroma.scale([
"#1A1F29",
"#242936",
"#5C6773",
"#828C99",
"#ABB0B6",
"#F8F9FA",
"#F3F4F5",
"#FAFAFA",
]),
red: colorRamp(chroma("#F07178")),
orange: colorRamp(chroma("#FA8D3E")),
yellow: colorRamp(chroma("#F2AE49")),
green: colorRamp(chroma("#86B300")),
cyan: colorRamp(chroma("#4CBF99")),
blue: colorRamp(chroma("#36A3D9")),
violet: colorRamp(chroma("#A37ACC")),
magenta: colorRamp(chroma("#E6BA7E")),
});

31
styles/src/themes/internal/dracula.ts Normal file
View file

@ -0,0 +1,31 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Dracula";
const author = "zenorocha";
const url = "https://github.com/dracula/dracula-theme";
const license = {
type: "MIT",
url: "https://github.com/dracula/dracula-theme/blob/master/LICENSE",
};
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#282A36",
"#3a3c4e",
"#4d4f68",
"#626483",
"#62d6e8",
"#e9e9f4",
"#f1f2f8",
"#f8f8f2",
]),
red: colorRamp(chroma("#ff5555")),
orange: colorRamp(chroma("#ffb86c")),
yellow: colorRamp(chroma("#f1fa8c")),
green: colorRamp(chroma("#50fa7b")),
cyan: colorRamp(chroma("#8be9fd")),
blue: colorRamp(chroma("#6272a4")),
violet: colorRamp(chroma("#bd93f9")),
magenta: colorRamp(chroma("#00f769")),
});

138
styles/src/themes/internal/gruvbox-medium.ts Normal file
View file

@ -0,0 +1,138 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Gruvbox";
const author = "Dawid Kurek (dawikur@gmail.com)";
const url = "https://github.com/morhetz/gruvbox";
const license = {
type: "MIT/X11",
url: "https://en.wikipedia.org/wiki/MIT_License",
};
export const dark = createColorScheme(`${name} Dark Medium`, false, {
neutral: chroma.scale([
"#282828",
"#3c3836",
"#504945",
"#665c54",
"#7C6F64",
"#928374",
"#A89984",
"#BDAE93",
"#D5C4A1",
"#EBDBB2",
"#FBF1C7",
]),
red: chroma.scale([
"#4D150F",
"#7D241A",
"#A31C17",
"#CC241D",
"#C83A29",
"#FB4934",
"#F06D61",
"#E6928E",
"#FFFFFF",
]),
orange: chroma.scale([
"#462307",
"#7F400C",
"#AB4A0B",
"#D65D0E",
"#CB6614",
"#FE8019",
"#F49750",
"#EBAE87",
"#FFFFFF",
]),
yellow: chroma.scale([
"#3D2C05",
"#7D5E17",
"#AC7A1A",
"#D79921",
"#E8AB28",
"#FABD2F",
"#F2C45F",
"#EBCC90",
"#FFFFFF",
]),
green: chroma.scale([
"#32330A",
"#5C5D13",
"#797814",
"#98971A",
"#93951E",
"#B8BB26",
"#C2C359",
"#CCCB8D",
"#FFFFFF",
]),
cyan: chroma.scale([
"#283D20",
"#47603E",
"#537D54",
"#689D6A",
"#719963",
"#8EC07C",
"#A1C798",
"#B4CEB5",
"#FFFFFF",
]),
blue: chroma.scale([
"#103738",
"#214C4D",
"#376A6C",
"#458588",
"#688479",
"#83A598",
"#92B3AE",
"#A2C2C4",
"#FFFFFF",
]),
violet: chroma.scale([
"#392228",
"#69434D",
"#8D4E6B",
"#B16286",
"#A86B7C",
"#D3869B",
"#D59BAF",
"#D8B1C3",
"#FFFFFF",
]),
magenta: chroma.scale([
"#48402C",
"#756D59",
"#867A69",
"#A89984",
"#BCAF8E",
"#EBDBB2",
"#DFD3BA",
"#D4CCC2",
"#FFFFFF",
]),
});
export const light = createColorScheme(`${name} Light Medium`, true, {
neutral: chroma.scale([
"#282828",
"#3c3836",
"#504945",
"#665c54",
"#7C6F64",
"#928374",
"#A89984",
"#BDAE93",
"#D5C4A1",
"#EBDBB2",
"#FBF1C7",
]),
red: colorRamp(chroma("#9d0006")),
orange: colorRamp(chroma("#af3a03")),
yellow: colorRamp(chroma("#b57614")),
green: colorRamp(chroma("#79740e")),
cyan: colorRamp(chroma("#427b58")),
blue: colorRamp(chroma("#076678")),
violet: colorRamp(chroma("#8f3f71")),
magenta: colorRamp(chroma("#d65d0e")),
});

32
styles/src/themes/internal/monokai.ts Normal file
View file

@ -0,0 +1,32 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Monokai";
const author = "Wimer Hazenberg (http://www.monokai.nl)";
const url = "https://base16.netlify.app/previews/base16-monokai.html";
const license = {
type: "?",
url: "?",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#272822",
"#383830",
"#49483e",
"#75715e",
"#a59f85",
"#f8f8f2",
"#f5f4f1",
"#f9f8f5",
]),
red: colorRamp(chroma("#f92672")),
orange: colorRamp(chroma("#fd971f")),
yellow: colorRamp(chroma("#f4bf75")),
green: colorRamp(chroma("#a6e22e")),
cyan: colorRamp(chroma("#a1efe4")),
blue: colorRamp(chroma("#66d9ef")),
violet: colorRamp(chroma("#ae81ff")),
magenta: colorRamp(chroma("#cc6633")),
});

32
styles/src/themes/internal/nord.ts Normal file
View file

@ -0,0 +1,32 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Nord";
const author = "arcticicestudio";
const url = "https://www.nordtheme.com/";
const license = {
type: "MIT",
url: "https://github.com/arcticicestudio/nord/blob/develop/LICENSE.md",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#2E3440",
"#3B4252",
"#434C5E",
"#4C566A",
"#D8DEE9",
"#E5E9F0",
"#ECEFF4",
"#8FBCBB",
]),
red: colorRamp(chroma("#88C0D0")),
orange: colorRamp(chroma("#81A1C1")),
yellow: colorRamp(chroma("#5E81AC")),
green: colorRamp(chroma("#BF616A")),
cyan: colorRamp(chroma("#D08770")),
blue: colorRamp(chroma("#EBCB8B")),
violet: colorRamp(chroma("#A3BE8C")),
magenta: colorRamp(chroma("#B48EAD")),
});

32
styles/src/themes/internal/seti-ui.ts Normal file
View file

@ -0,0 +1,32 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Seti UI";
const author = "jesseweed";
const url = "https://github.com/jesseweed/seti-ui";
const license = {
type: "MIT",
url: "https://github.com/jesseweed/seti-ui/blob/master/LICENSE.md",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#151718",
"#262B30",
"#1E2326",
"#41535B",
"#43a5d5",
"#d6d6d6",
"#eeeeee",
"#ffffff",
]),
red: colorRamp(chroma("#Cd3f45")),
orange: colorRamp(chroma("#db7b55")),
yellow: colorRamp(chroma("#e6cd69")),
green: colorRamp(chroma("#9fca56")),
cyan: colorRamp(chroma("#55dbbe")),
blue: colorRamp(chroma("#55b5db")),
violet: colorRamp(chroma("#a074c4")),
magenta: colorRamp(chroma("#8a553f")),
});

32
styles/src/themes/internal/tokyo-night-storm.ts Normal file
View file

@ -0,0 +1,32 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Tokyo Night Storm";
const author = "folke";
const url = "https://github.com/folke/tokyonight.nvim";
const license = {
type: "MIT",
url: "https://github.com/ghifarit53/tokyonight-vim/blob/master/LICENSE",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#24283B",
"#16161E",
"#343A52",
"#444B6A",
"#787C99",
"#A9B1D6",
"#CBCCD1",
"#D5D6DB",
]),
red: colorRamp(chroma("#C0CAF5")),
orange: colorRamp(chroma("#A9B1D6")),
yellow: colorRamp(chroma("#0DB9D7")),
green: colorRamp(chroma("#9ECE6A")),
cyan: colorRamp(chroma("#B4F9F8")),
blue: colorRamp(chroma("#2AC3DE")),
violet: colorRamp(chroma("#BB9AF7")),
magenta: colorRamp(chroma("#F7768E")),
});

53
styles/src/themes/internal/tokyo-night.ts Normal file
View file

@ -0,0 +1,53 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Tokyo";
const author = "folke";
const url = "https://github.com/folke/tokyonight.nvim";
const license = {
type: "Apache License 2.0",
url: "https://github.com/folke/tokyonight.nvim/blob/main/LICENSE",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name} Night`, false, {
neutral: chroma.scale([
"#1A1B26",
"#16161E",
"#2F3549",
"#444B6A",
"#787C99",
"#A9B1D6",
"#CBCCD1",
"#D5D6DB",
]),
red: colorRamp(chroma("#C0CAF5")),
orange: colorRamp(chroma("#A9B1D6")),
yellow: colorRamp(chroma("#0DB9D7")),
green: colorRamp(chroma("#9ECE6A")),
cyan: colorRamp(chroma("#B4F9F8")),
blue: colorRamp(chroma("#2AC3DE")),
violet: colorRamp(chroma("#BB9AF7")),
magenta: colorRamp(chroma("#F7768E")),
});
export const light = createColorScheme(`${name} Day`, true, {
neutral: chroma.scale([
"#1A1B26",
"#1A1B26",
"#343B59",
"#4C505E",
"#9699A3",
"#DFE0E5",
"#CBCCD1",
"#D5D6DB",
]),
red: colorRamp(chroma("#343B58")),
orange: colorRamp(chroma("#965027")),
yellow: colorRamp(chroma("#166775")),
green: colorRamp(chroma("#485E30")),
cyan: colorRamp(chroma("#3E6968")),
blue: colorRamp(chroma("#34548A")),
violet: colorRamp(chroma("#5A4A78")),
magenta: colorRamp(chroma("#8C4351")),
});

12
styles/src/themes/internal/zed-pro.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "zed-pro";
const name = "Zed Pro";
const author = "Nate Butler"
const url = "https://github.com/iamnbutler"
const license = {
type: "?",
url: "?",
};
const ramps = {
neutral: chroma
@ -26,5 +32,5 @@ const ramps = {
magenta: colorRamp(chroma("#DE9AB8")),
};
export const dark = createColorScheme(`${name}-dark`, false, ramps);
export const light = createColorScheme(`${name}-light`, true, ramps);
export const dark = createColorScheme(`${name} Dark`, false, ramps);
export const light = createColorScheme(`${name} Light`, true, ramps);

32
styles/src/themes/internal/zenburn.ts Normal file
View file

@ -0,0 +1,32 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "../common/ramps";
const name = "Zenburn";
const author = "elnawe";
const url = "https://github.com/elnawe/base16-zenburn-scheme";
const license = {
type: "None",
url: "",
};
// `name-[light|dark]`, isLight, color ramps
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma.scale([
"#383838",
"#404040",
"#606060",
"#6f6f6f",
"#808080",
"#dcdccc",
"#c0c0c0",
"#ffffff",
]),
red: colorRamp(chroma("#dca3a3")),
orange: colorRamp(chroma("#dfaf8f")),
yellow: colorRamp(chroma("#e0cf9f")),
green: colorRamp(chroma("#5f7f5f")),
cyan: colorRamp(chroma("#93e0e3")),
blue: colorRamp(chroma("#7cb8bb")),
violet: colorRamp(chroma("#dc8cc3")),
magenta: colorRamp(chroma("#000000")),
});

64
styles/src/themes/one-dark.ts
View file

@ -1,40 +1,34 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "one";
const author = "Chris Kempson (http://chriskempson.com)";
const url =
"https://github.com/chriskempson/base16-vim/blob/master/colors/base16-onedark.vim";
const base00 = "#282c34";
const base01 = "#353b45";
const base02 = "#3e4451";
const base03 = "#545862";
const base04 = "#565c64";
const base05 = "#abb2bf";
const base06 = "#b6bdca";
const base07 = "#c8ccd4";
const base08 = "#e06c75";
const base09 = "#d19a66";
const base0A = "#e5c07b";
const base0B = "#98c379";
const base0C = "#56b6c2";
const base0D = "#61afef";
const base0E = "#c678dd";
const base0F = "#be5046";
const ramps = {
neutral: chroma
.scale([base00, base01, base02, base03, base04, base05, base06, base07])
.domain([0.05, 0.22, 0.25, 0.45, 0.62, 0.8, 0.9, 1]),
red: colorRamp(chroma(base08)),
orange: colorRamp(chroma(base09)),
yellow: colorRamp(chroma(base0A)),
green: colorRamp(chroma(base0B)),
cyan: colorRamp(chroma(base0C)),
blue: colorRamp(chroma(base0D)),
violet: colorRamp(chroma(base0E)),
magenta: colorRamp(chroma(base0F)),
const name = "One Dark";
const author = "simurai";
const url = "https://github.com/atom/atom/tree/master/packages/one-dark-ui";
const license = {
type: "MIT",
url: "https://github.com/atom/atom/blob/master/packages/one-dark-ui/LICENSE.md",
};
export const dark = createColorScheme(`${name}-dark`, false, ramps);
export const dark = createColorScheme(`${name}`, false, {
neutral: chroma
.scale([
"#282c34",
"#353b45",
"#3e4451",
"#545862",
"#565c64",
"#abb2bf",
"#b6bdca",
"#c8ccd4",
])
.domain([0.05, 0.22, 0.25, 0.45, 0.62, 0.8, 0.9, 1]),
red: colorRamp(chroma("#e06c75")),
orange: colorRamp(chroma("#d19a66")),
yellow: colorRamp(chroma("#e5c07b")),
green: colorRamp(chroma("#98c379")),
cyan: colorRamp(chroma("#56b6c2")),
blue: colorRamp(chroma("#61afef")),
violet: colorRamp(chroma("#c678dd")),
magenta: colorRamp(chroma("#be5046")),
});

63
styles/src/themes/one-light.ts
View file

@ -1,40 +1,33 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "one";
const author = "Daniel Pfeifer (http://github.com/purpleKarrot)";
const url =
"https://github.com/purpleKarrot/base16-one-light-scheme/blob/master/one-light.yaml";
const base00 = "#090a0b";
const base01 = "#202227";
const base02 = "#383a42";
const base03 = "#696c77";
const base04 = "#a0a1a7";
const base05 = "#e5e5e6";
const base06 = "#f0f0f1";
const base07 = "#fafafa";
const base08 = "#ca1243";
const base09 = "#d75f00";
const base0A = "#c18401";
const base0B = "#50a14f";
const base0C = "#0184bc";
const base0D = "#4078f2";
const base0E = "#a626a4";
const base0F = "#986801";
const ramps = {
neutral: chroma
.scale([base00, base01, base02, base03, base04, base05, base06, base07])
.domain([0, 0.05, 0.77, 1]),
red: colorRamp(chroma(base08)),
orange: colorRamp(chroma(base09)),
yellow: colorRamp(chroma(base0A)),
green: colorRamp(chroma(base0B)),
cyan: colorRamp(chroma(base0C)),
blue: colorRamp(chroma(base0D)),
violet: colorRamp(chroma(base0E)),
magenta: colorRamp(chroma(base0F)),
const name = "One Light";
const author = "simurai";
const url = "https://github.com/atom/atom/tree/master/packages/one-light-ui";
const license = {
type: "MIT",
url: "https://github.com/atom/atom/blob/master/packages/one-light-ui/LICENSE.md",
};
export const light = createColorScheme(`${name}-light`, true, ramps);
export const light = createColorScheme(`${name}`, true, {
neutral: chroma.scale([
"#090a0b",
"#202227",
"#383a42",
"#696c77",
"#a0a1a7",
"#e5e5e6",
"#f0f0f1",
"#fafafa",
])
.domain([0.05, 0.22, 0.25, 0.45, 0.62, 0.8, 0.9, 1]),
red: colorRamp(chroma("#ca1243")),
orange: colorRamp(chroma("#d75f00")),
yellow: colorRamp(chroma("#c18401")),
green: colorRamp(chroma("#50a14f")),
cyan: colorRamp(chroma("#0184bc")),
blue: colorRamp(chroma("#4078f2")),
violet: colorRamp(chroma("#a626a4")),
magenta: colorRamp(chroma("#986801")),
});

8
styles/src/themes/rose-pine-dawn.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "rosé-pine-dawn";
const name = "Rosé Pine Dawn";
const author = "edunfelt";
const url = "https://github.com/edunfelt/base16-rose-pine-scheme";
const license = {
type: "MIT",
url: "https://github.com/edunfelt/base16-rose-pine-scheme/blob/main/rose-pine-dawn.yaml",
};
const ramps = {
neutral: chroma

8
styles/src/themes/rose-pine-moon.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "rosé-pine-moon";
const name = "Rosé Pine Moon";
const author = "edunfelt";
const url = "https://github.com/edunfelt/base16-rose-pine-scheme";
const license = {
type: "MIT",
url: "https://github.com/edunfelt/base16-rose-pine-scheme/blob/main/rose-pine-moon.yaml",
};
const ramps = {
neutral: chroma

8
styles/src/themes/rose-pine.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "rosé-pine";
const name = "Rosé Pine";
const author = "edunfelt";
const url = "https://github.com/edunfelt/base16-rose-pine-scheme";
const license = {
type: "MIT",
url: "https://github.com/edunfelt/base16-rose-pine-scheme",
};
const ramps = {
neutral: chroma.scale([

8
styles/src/themes/sandcastle.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "sandcastle";
const name = "Sandcastle";
const author = "gessig";
const url = "https://github.com/gessig/base16-sandcastle-scheme";
const license = {
type: "MIT",
url: "https://github.com/gessig/base16-sandcastle-scheme/blob/master/LICENSE",
};
const ramps = {
neutral: chroma.scale([

12
styles/src/themes/solarized.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "solarized";
const name = "Solarized";
const author = "Ethan Schoonover";
const url = "https://github.com/altercation/solarized";
const license = {
type: "MIT",
url: "https://github.com/altercation/solarized/blob/master/README.md",
};
const ramps = {
neutral: chroma
@ -26,5 +32,5 @@ const ramps = {
magenta: colorRamp(chroma("#d33682")),
};
export const dark = createColorScheme(`${name}-dark`, false, ramps);
export const light = createColorScheme(`${name}-light`, true, ramps);
export const dark = createColorScheme(`${name} Dark`, false, ramps);
export const light = createColorScheme(`${name} Light`, true, ramps);

8
styles/src/themes/summercamp.ts
View file

@ -1,7 +1,13 @@
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
const name = "summercamp";
const name = "Summercamp";
const author = "zoefiri";
const url = "https://github.com/zoefiri/base16-sc";
const license = {
type: "MIT",
url: "https://github.com/zoefiri/base16-sc/blob/master/summercamp.yaml",
};
const ramps = {
neutral: chroma

69
styles/src/themes/template.ts
View file

@ -1,69 +0,0 @@
/**
* To create a new theme duplicate this file and move into templates
**/
import chroma from "chroma-js";
import { colorRamp, createColorScheme } from "./common/ramps";
/**
* Theme Name
*
* What the theme will be called in the UI
* Also used to generate filenames, etc
**/
const name = "themeName";
/**
* Theme Colors
*
* Zed themes are based on [base16](https://github.com/chriskempson/base16)
* The first 8 colors ("Neutrals") are used to construct the UI background, panels, etc.
* The latter 8 colors ("Accents") are used for syntax themes, semantic colors, and UI states.
**/
/**
* Color Ramps
*
* We use (chroma-js)[https://gka.github.io/chroma.js/] to minipulate color in themes and to build color ramps.
*
* You can use chroma-js operations on the ramps here.
* For example, you could use chroma.scale(...).correctLightness if your color ramps seem washed out near the ends.
**/
// TODO: Express accents without refering to them directly by color name.
// See common/base16.ts for where color tokens are used.
const ramps = {
neutral: chroma.scale([
"#19171c", // Dark: darkest backgrounds, inputs | Light: Lightest text, active states
"#26232a",
"#585260",
"#655f6d",
"#7e7887",
"#8b8792",
"#e2dfe7",
"#efecf4", // Light: darkest backgrounds, inputs | Dark: Lightest text, active states
]),
red: colorRamp(chroma("#be4678")), // Errors
orange: colorRamp(chroma("#aa573c")),
yellow: colorRamp(chroma("#a06e3b")), // Warnings
green: colorRamp(chroma("#2a9292")), // Positive
cyan: colorRamp(chroma("#398bc6")), // Player 1 (Host)
blue: colorRamp(chroma("#576ddb")), // Info
violet: colorRamp(chroma("#955ae7")),
magenta: colorRamp(chroma("#bf40bf")),
};
/**
* Color Scheme Variants
*
* Currently we only support (and require) dark and light themes
* Eventually you will be able to have only a light or dark theme,
* and define other variants here.
*
* createColorScheme([name], [isLight], [arrayOfRamps])
**/
export const dark = createColorScheme(`${name}-dark`, false, ramps);
export const light = createColorScheme(`${name}-light`, true, ramps);