mirror of
https://github.com/zed-industries/zed.git
synced 2024-09-19 10:29:35 +03:00
Add light themes
This commit is contained in:
Nate Butler
parent
84aefb9dcb
commit
5bfd5e35b3
55
styles/src/themes/atelier-forest-light.ts
Normal file
55
styles/src/themes/atelier-forest-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Forest Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#f1efee",
|
||||
base01: "#e6e2e0",
|
||||
base02: "#a8a19f",
|
||||
base03: "#9c9491",
|
||||
base04: "#766e6b",
|
||||
base05: "#68615e",
|
||||
base06: "#2c2421",
|
||||
base07: "#1b1918",
|
||||
base08: "#f22c40",
|
||||
base09: "#df5320",
|
||||
base0A: "#c38418",
|
||||
base0B: "#7b9726",
|
||||
base0C: "#3d97b8",
|
||||
base0D: "#407ee7",
|
||||
base0E: "#6666ea",
|
||||
base0F: "#c33ff3"
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
55
styles/src/themes/atelier-heath-light.ts
Normal file
55
styles/src/themes/atelier-heath-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Heath Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#f7f3f7",
|
||||
base01: "#d8cad8",
|
||||
base02: "#ab9bab",
|
||||
base03: "#9e8f9e",
|
||||
base04: "#776977",
|
||||
base05: "#695d69",
|
||||
base06: "#292329",
|
||||
base07: "#1b181b",
|
||||
base08: "#ca402b",
|
||||
base09: "#a65926",
|
||||
base0A: "#bb8a35",
|
||||
base0B: "#918b3b",
|
||||
base0C: "#159393",
|
||||
base0D: "#516aec",
|
||||
base0E: "#7b59c0",
|
||||
base0F: "#cc33cc",
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
55
styles/src/themes/atelier-lakeside-light.ts
Normal file
55
styles/src/themes/atelier-lakeside-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Lakeside Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#ebf8ff",
|
||||
base01: "#c1e4f6",
|
||||
base02: "#7ea2b4",
|
||||
base03: "#7195a8",
|
||||
base04: "#5a7b8c",
|
||||
base05: "#516d7b",
|
||||
base06: "#1f292e",
|
||||
base07: "#161b1d",
|
||||
base08: "#d22d72",
|
||||
base09: "#935c25",
|
||||
base0A: "#8a8a0f",
|
||||
base0B: "#568c3b",
|
||||
base0C: "#2d8f6f",
|
||||
base0D: "#257fad",
|
||||
base0E: "#6b6bb8",
|
||||
base0F: "#b72dd2",
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
55
styles/src/themes/atelier-plateau-light.ts
Normal file
55
styles/src/themes/atelier-plateau-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Plateau Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/plateau/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#f4ecec",
|
||||
base01: "#e7dfdf",
|
||||
base02: "#8a8585",
|
||||
base03: "#7e7777",
|
||||
base04: "#655d5d",
|
||||
base05: "#585050",
|
||||
base06: "#292424",
|
||||
base07: "#1b1818",
|
||||
base08: "#ca4949",
|
||||
base09: "#b45a3c",
|
||||
base0A: "#a06e3b",
|
||||
base0B: "#4b8b8b",
|
||||
base0C: "#5485b6",
|
||||
base0D: "#7272ca",
|
||||
base0E: "#8464c4",
|
||||
base0F: "#bd5187"
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
55
styles/src/themes/atelier-savanna-light.ts
Normal file
55
styles/src/themes/atelier-savanna-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Savanna Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#ecf4ee",
|
||||
base01: "#dfe7e2",
|
||||
base02: "#87928a",
|
||||
base03: "#78877d",
|
||||
base04: "#5f6d64",
|
||||
base05: "#526057",
|
||||
base06: "#232a25",
|
||||
base07: "#171c19",
|
||||
base08: "#b16139",
|
||||
base09: "#9f713c",
|
||||
base0A: "#a07e3b",
|
||||
base0B: "#489963",
|
||||
base0C: "#1c9aa0",
|
||||
base0D: "#478c90",
|
||||
base0E: "#55859b",
|
||||
base0F: "#867469",
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
@ -7,7 +7,7 @@ const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Seaside Dark`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna/",
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#131513",
|
||||
|
||||
55
styles/src/themes/atelier-seaside-light.ts
Normal file
55
styles/src/themes/atelier-seaside-light.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import chroma from "chroma-js"
|
||||
import { Meta } from "./common/colorScheme"
|
||||
import { colorRamp, createColorScheme } from "./common/ramps"
|
||||
import { metaCommon, name, buildSyntax, Variant } from "./common/atelier-common"
|
||||
|
||||
const variant: Variant = {
|
||||
meta: {
|
||||
name: `${name} Seaside Light`,
|
||||
...metaCommon,
|
||||
url: "https://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside/",
|
||||
},
|
||||
colors: {
|
||||
base00: "#f4fbf4",
|
||||
base01: "#cfe8cf",
|
||||
base02: "#8ca68c",
|
||||
base03: "#809980",
|
||||
base04: "#687d68",
|
||||
base05: "#5e6e5e",
|
||||
base06: "#242924",
|
||||
base07: "#131513",
|
||||
base08: "#e6193c",
|
||||
base09: "#87711d",
|
||||
base0A: "#98981b",
|
||||
base0B: "#29a329",
|
||||
base0C: "#1999b3",
|
||||
base0D: "#3d62f5",
|
||||
base0E: "#ad2bee",
|
||||
base0F: "#e619c3",
|
||||
}
|
||||
}
|
||||
|
||||
const syntax = buildSyntax(variant)
|
||||
|
||||
const theme = (variant: Variant) => {
|
||||
const { meta, colors } = variant
|
||||
|
||||
return createColorScheme(meta.name, true, {
|
||||
neutral: chroma
|
||||
.scale([
|
||||
colors.base00, colors.base01, colors.base02, colors.base03, colors.base04, colors.base05, colors.base06, colors.base07
|
||||
].reverse()),
|
||||
red: colorRamp(chroma(colors.base08)),
|
||||
orange: colorRamp(chroma(colors.base09)),
|
||||
yellow: colorRamp(chroma(colors.base0A)),
|
||||
green: colorRamp(chroma(colors.base0B)),
|
||||
cyan: colorRamp(chroma(colors.base0C)),
|
||||
blue: colorRamp(chroma(colors.base0D)),
|
||||
violet: colorRamp(chroma(colors.base0E)),
|
||||
magenta: colorRamp(chroma(colors.base0F)),
|
||||
}, syntax)
|
||||
}
|
||||
|
||||
export const dark = theme(variant)
|
||||
|
||||
export const meta: Meta = variant.meta
|
||||
Loading…
Reference in New Issue
Block a user