diff --git a/styles/src/themes/rose-pine-dawn.ts b/styles/src/themes/rose-pine-dawn.ts index 53d893f956..0c296c8608 100644 --- a/styles/src/themes/rose-pine-dawn.ts +++ b/styles/src/themes/rose-pine-dawn.ts @@ -5,23 +5,23 @@ const name = "rosé-pine-dawn"; const ramps = { neutral: chroma.scale([ - "#26233a", - "#555169", "#575279", - "#6e6a86", - "#9893a5", - "#f2e9de", - "#fffaf3", - "#faf4ed", + "#797593", + "#9893A5", + "#B5AFB8", + "#D3CCCC", + "#F2E9E1", + "#FFFAF3", + "#FAF4ED", ]), - red: colorRamp(chroma("#1f1d2e")), - orange: colorRamp(chroma("#b4637a")), - yellow: colorRamp(chroma("#ea9d34")), - green: colorRamp(chroma("#d7827e")), + red: colorRamp(chroma("#B4637A")), + orange: colorRamp(chroma("#D7827E")), + yellow: colorRamp(chroma("#EA9D34")), + green: colorRamp(chroma("#679967")), cyan: colorRamp(chroma("#286983")), - blue: colorRamp(chroma("#56949f")), - violet: colorRamp(chroma("#907aa9")), - magenta: colorRamp(chroma("#c5c3ce")), + blue: colorRamp(chroma("#56949F")), + violet: colorRamp(chroma("#907AA9")), + magenta: colorRamp(chroma("#79549F")), }; export const light = createTheme(`${name}`, true, ramps); diff --git a/styles/src/themes/rose-pine-moon.ts b/styles/src/themes/rose-pine-moon.ts new file mode 100644 index 0000000000..b3b975a267 --- /dev/null +++ b/styles/src/themes/rose-pine-moon.ts @@ -0,0 +1,27 @@ +import chroma from "chroma-js"; +import { colorRamp, createTheme } from "./common/base16"; + +const name = "rosé-pine-moon"; + +const ramps = { + neutral: chroma.scale([ + "#232136", + "#2A273F", + "#393552", + "#3E3A53", + "#56526C", + "#6E6A86", + "#908CAA", + "#E0DEF4", + ]), + red: colorRamp(chroma("#EB6F92")), + orange: colorRamp(chroma("#EBBCBA")), + yellow: colorRamp(chroma("#F6C177")), + green: colorRamp(chroma("#8DBD8D")), + cyan: colorRamp(chroma("#409BBE")), + blue: colorRamp(chroma("#9CCFD8")), + violet: colorRamp(chroma("#C4A7E7")), + magenta: colorRamp(chroma("#AB6FE9")), +}; + +export const dark = createTheme(`${name}`, false, ramps); diff --git a/styles/src/themes/rose-pine.ts b/styles/src/themes/rose-pine.ts index 8150955bf7..b0ebbfd243 100644 --- a/styles/src/themes/rose-pine.ts +++ b/styles/src/themes/rose-pine.ts @@ -7,21 +7,21 @@ const ramps = { neutral: chroma.scale([ "#191724", "#1f1d2e", - "#26233a", - "#555169", - "#6e6a86", - "#e0def4", - "#f0f0f3", - "#c5c3ce", + "#26233A", + "#3E3A53", + "#56526C", + "#6E6A86", + "#908CAA", + "#E0DEF4", ]), - red: colorRamp(chroma("#e2e1e7")), - orange: colorRamp(chroma("#eb6f92")), - yellow: colorRamp(chroma("#f6c177")), - green: colorRamp(chroma("#ebbcba")), - cyan: colorRamp(chroma("#31748f")), - blue: colorRamp(chroma("#0CA793")), - violet: colorRamp(chroma("#8A3FA6")), - magenta: colorRamp(chroma("#C74DED")), + red: colorRamp(chroma("#EB6F92")), + orange: colorRamp(chroma("#EBBCBA")), + yellow: colorRamp(chroma("#F6C177")), + green: colorRamp(chroma("#8DBD8D")), + cyan: colorRamp(chroma("#409BBE")), + blue: colorRamp(chroma("#9CCFD8")), + violet: colorRamp(chroma("#C4A7E7")), + magenta: colorRamp(chroma("#AB6FE9")), }; export const dark = createTheme(`${name}`, false, ramps);