Skip to content

feat(themes): add Kanagawa Dragon, Wave, and Bones themes #524

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
backnotprop merged 4 commits into from
Apr 8, 2026
Merged

feat(themes): add Kanagawa Dragon, Wave, and Bones themes #524

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e44d1ba
feat(themes): add Kanagawa Dragon, Wave, and Bones themes
backnotprop Apr 8, 2026
7404cea
fix(themes): sort Kanagawa themes into alphabetical position
backnotprop Apr 8, 2026
ccfb00a
feat(themes): replace Kanagawa Bones with Kanagawa Lotus
backnotprop Apr 8, 2026
e19ef1c
style(themes): standardize border radius to 0.625rem
backnotprop Apr 8, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions bun.lock
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 3 additions & 0 deletions packages/ui/theme.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,9 @@
@import "./themes/doom-64.css";
@import "./themes/dracula.css";
@import "./themes/gruvbox.css";
@import "./themes/kanagawa-dragon.css";
@import "./themes/kanagawa-lotus.css";
@import "./themes/kanagawa-wave.css";
@import "./themes/paulmillr.css";
@import "./themes/quantum-rose.css";
@import "./themes/solar-dusk.css";
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/adwaita.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: 'Inter', system-ui, sans-serif;
--font-mono: 'Source Code Pro', ui-monospace, monospace;
--radius: 0.75rem;
--radius: 0.625rem;

--code-bg: #2a2a2a;
--focus-highlight: #3584E4;
Expand Down
4 changes: 2 additions & 2 deletions packages/ui/themes/caffeine.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace;
--radius: 0.5rem;
--radius: 0.625rem;
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
Expand Down Expand Up @@ -93,7 +93,7 @@
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
"Courier New", monospace;
--radius: 0.5rem;
--radius: 0.625rem;
--shadow-2xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
--shadow-xs: 0 1px 3px 0px hsl(0 0% 0% / 0.05);
--shadow-sm: 0 1px 3px 0px hsl(0 0% 0% / 0.1), 0 1px 2px -1px hsl(0 0% 0% / 0.1);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/catppuccin.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: 'Fira Code', ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #181825;
--focus-highlight: #94e2d5;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/claude-plus.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@

--font-sans: 'Outfit', sans-serif;
--font-mono: 'Geist Mono', ui-monospace, monospace;
--radius: 1rem;
--radius: 0.625rem;

--code-bg: oklch(0.22 0.003 106.6);
--focus-highlight: oklch(0.70 0.20 200);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/cursor-hc.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #1a1a1a;
--focus-highlight: #88C0D0;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/cursor-midnight.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #191c22;
--focus-highlight: #8FBCBB;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/cursor.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #141414;
--focus-highlight: #88C0D0;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/dracula.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: rgb(33, 34, 44);
--focus-highlight: rgb(139, 233, 253);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/gruvbox.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: 'Fira Code', ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #32302f;
--focus-highlight: #83a598;
Expand Down
34 changes: 34 additions & 0 deletions packages/ui/themes/kanagawa-dragon.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/* Kanagawa Dragon — warm ash-black, muted teal accent */
.theme-kanagawa-dragon,
.theme-kanagawa-dragon.light {
--background: #181616;
--foreground: #c8c093;
--card: #211e1e;
--card-foreground: #c8c093;
--popover: #211e1e;
--popover-foreground: #c8c093;
--primary: #7fb4ca;
--primary-foreground: #181616;
--secondary: #2a2625;
--secondary-foreground: #c8c093;
--muted: #252220;
--muted-foreground: #a6a69c;
--accent: #7aa89f;
--accent-foreground: #181616;
--destructive: #c4746e;
--destructive-foreground: #c8c093;
--border: #2e2b28;
--input: #252220;
--ring: #7fb4ca;
--success: #87a987;
--success-foreground: #181616;
--warning: #e6c384;
--warning-foreground: #181616;

--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
--radius: 0.625rem;

--code-bg: #0d0c0c;
--focus-highlight: #7aa89f;
}
34 changes: 34 additions & 0 deletions packages/ui/themes/kanagawa-lotus.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/* Kanagawa Lotus — light variant, yellow-tan paper background */
.theme-kanagawa-lotus,
.theme-kanagawa-lotus.light {
--background: #f2ecbc;
--foreground: #545464;
--card: #e5ddb0;
--card-foreground: #545464;
--popover: #e5ddb0;
--popover-foreground: #545464;
--primary: #4d699b;
--primary-foreground: #f2ecbc;
--secondary: #dcd5ac;
--secondary-foreground: #545464;
--muted: #e7dba0;
--muted-foreground: #716e61;
--accent: #624c83;
--accent-foreground: #f2ecbc;
--destructive: #c84053;
--destructive-foreground: #f2ecbc;
--border: #dcd5ac;
--input: #e7dba0;
--ring: #4d699b;
--success: #6f894e;
--success-foreground: #f2ecbc;
--warning: #836f4a;
--warning-foreground: #f2ecbc;

--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
--radius: 0.625rem;

--code-bg: #d5cea3;
--focus-highlight: #4e8ca2;
}
34 changes: 34 additions & 0 deletions packages/ui/themes/kanagawa-wave.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,34 @@
/* Kanagawa Wave — cool blue-purple, classic Kanagawa */
.theme-kanagawa-wave,
.theme-kanagawa-wave.light {
--background: #1f1f28;
--foreground: #dcd7ba;
--card: #2a2a37;
--card-foreground: #dcd7ba;
--popover: #2a2a37;
--popover-foreground: #dcd7ba;
--primary: #7e9cd8;
--primary-foreground: #1f1f28;
--secondary: #363646;
--secondary-foreground: #dcd7ba;
--muted: #2d2d3b;
--muted-foreground: #727169;
--accent: #957fb8;
--accent-foreground: #1f1f28;
--destructive: #c34043;
--destructive-foreground: #dcd7ba;
--border: #363646;
--input: #2d2d3b;
--ring: #7fb4ca;
--success: #98bb6c;
--success-foreground: #1f1f28;
--warning: #e6c384;
--warning-foreground: #1f1f28;

--font-sans: ui-sans-serif, system-ui, sans-serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, monospace;
--radius: 0.625rem;

--code-bg: #16161d;
--focus-highlight: #7aa89f;
}
2 changes: 1 addition & 1 deletion packages/ui/themes/monokai-pro.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: 'Fira Code', ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #221f22;
--focus-highlight: #78dce8;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/paulmillr.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, 'SF Mono', Consolas, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #1a1a1a;
--focus-highlight: #66ccff;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/plannotator.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@

--font-sans: 'Inter', system-ui, sans-serif;
--font-mono: 'JetBrains Mono', 'Fira Code', monospace;
--radius: 0.75rem;
--radius: 0.625rem;

--code-bg: oklch(0.26 0.02 260);
--focus-highlight: oklch(0.70 0.20 200);
Expand Down
4 changes: 2 additions & 2 deletions packages/ui/themes/quantum-rose.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
--font-sans: Quicksand, sans-serif;
--font-serif: Playfair Display, serif;
--font-mono: Space Mono, monospace;
--radius: 0.5rem;
--radius: 0.625rem;
--shadow-2xs: 0px 3px 0px 0px hsl(300 80% 50% / 0.09);
--shadow-xs: 0px 3px 0px 0px hsl(300 80% 50% / 0.09);
--shadow-sm: 0px 3px 0px 0px hsl(300 80% 50% / 0.18), 0px 1px 2px -1px hsl(300 80% 50% / 0.18);
Expand Down Expand Up @@ -89,7 +89,7 @@
--font-sans: Poppins, sans-serif;
--font-serif: Playfair Display, serif;
--font-mono: Space Mono, monospace;
--radius: 0.5rem;
--radius: 0.625rem;
--shadow-2xs: 0px 3px 0px 0px hsl(330 70% 30% / 0.09);
--shadow-xs: 0px 3px 0px 0px hsl(330 70% 30% / 0.09);
--shadow-sm: 0px 3px 0px 0px hsl(330 70% 30% / 0.18), 0px 1px 2px -1px hsl(330 70% 30% / 0.18);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/rose-pine.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #1f1d2e;
--focus-highlight: #9ccfd8;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/soft-pop.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@

--font-sans: 'DM Sans', sans-serif;
--font-mono: 'Space Mono', monospace;
--radius: 1rem;
--radius: 0.625rem;

--code-bg: oklch(0.08 0 0);
--focus-highlight: oklch(0.70 0.20 200);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/synthwave-84.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@

--font-sans: 'Inter', system-ui, sans-serif;
--font-mono: 'Fira Code', ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #241b2f;
--focus-highlight: #36f9f6;
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/tinacious.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@
--font-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
--font-mono: ui-monospace, SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo,
monospace;
--radius: 0.5rem;
--radius: 0.625rem;
--shadow-2xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
--shadow-xs: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
--shadow-sm: 0 2px 4px -1px rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
Expand Down
2 changes: 1 addition & 1 deletion packages/ui/themes/tokyo-night.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@

--font-sans: system-ui, sans-serif;
--font-mono: ui-monospace, monospace;
--radius: 0.5rem;
--radius: 0.625rem;

--code-bg: #1a1b2e;
--focus-highlight: #7dcfff;
Expand Down
30 changes: 30 additions & 0 deletions packages/ui/utils/themeRegistry.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -118,6 +118,36 @@ export const BUILT_IN_THEMES: ThemeInfo[] = [
light: { primary: '#076678', secondary: '#d5c4a1', accent: '#79740e', background: '#fbf1c7', foreground: '#3c3836' },
},
},
{
id: 'kanagawa-dragon',
name: 'Kanagawa Dragon',
builtIn: true,
modeSupport: 'dark-only',
colors: {
dark: { primary: '#7fb4ca', secondary: '#2a2625', accent: '#7aa89f', background: '#181616', foreground: '#c8c093' },
light: { primary: '#7fb4ca', secondary: '#2a2625', accent: '#7aa89f', background: '#181616', foreground: '#c8c093' },
},
},
{
id: 'kanagawa-lotus',
name: 'Kanagawa Lotus',
builtIn: true,
modeSupport: 'light-only',
colors: {
dark: { primary: '#4d699b', secondary: '#dcd5ac', accent: '#624c83', background: '#f2ecbc', foreground: '#545464' },
light: { primary: '#4d699b', secondary: '#dcd5ac', accent: '#624c83', background: '#f2ecbc', foreground: '#545464' },
},
},
{
id: 'kanagawa-wave',
name: 'Kanagawa Wave',
builtIn: true,
modeSupport: 'dark-only',
colors: {
dark: { primary: '#7e9cd8', secondary: '#363646', accent: '#957fb8', background: '#1f1f28', foreground: '#dcd7ba' },
light: { primary: '#7e9cd8', secondary: '#363646', accent: '#957fb8', background: '#1f1f28', foreground: '#dcd7ba' },
},
},
{
id: 'monokai-pro',
name: 'Monokai Pro',
Expand Down