Merge remote-tracking branch 'misskey/master' into feature/2024.9.0

23 files changed, 1016 insertions, 0 deletions

diff --git a/packages/frontend-shared/themes/_dark.json5 b/packages/frontend-shared/themes/_dark.json5
new file mode 100644
index 0000000000..e4649311c3
--- /dev/null
+++ b/packages/frontend-shared/themes/_dark.json5
@@ -0,0 +1,97 @@
+// ダークテーマのベーステーマ
+// このテーマが直接使われることは無い
+{
+	id: 'dark',
+
+	name: 'Dark',
+	author: 'syuilo',
+	desc: 'Default dark theme',
+	kind: 'dark',
+
+	props: {
+		accent: '#86b300',
+		accentDarken: ':darken<10<@accent',
+		accentLighten: ':lighten<10<@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		love: '#dd2e44',
+		focus: ':alpha<0.3<@accent',
+		bg: '#000',
+		acrylicBg: ':alpha<0.5<@bg',
+		fg: '#dadada',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		fgHighlighted: ':lighten<3<@fg',
+		fgOnAccent: '#fff',
+		fgOnWhite: '#333',
+		divider: 'rgba(255, 255, 255, 0.1)',
+		indicator: '@accent',
+		panel: ':lighten<3<@bg',
+		panelHighlight: ':lighten<3<@panel',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		panelBorder: '" solid 1px var(--divider)',
+		thread: ':lighten<12<@panel',
+		acrylicPanel: ':alpha<0.5<@panel',
+		windowHeader: ':alpha<0.85<@panel',
+		popup: ':lighten<3<@panel',
+		shadow: 'rgba(0, 0, 0, 0.3)',
+		header: ':alpha<0.7<@panel',
+		navBg: '@panel',
+		navFg: '@fg',
+		navHoverFg: ':lighten<17<@fg',
+		navActive: '@accent',
+		navIndicator: '@indicator',
+		link: '#44a4c1',
+		hashtag: '#ff9156',
+		mention: '@accent',
+		mentionMe: '@mention',
+		renote: '#229e82',
+		modalBg: 'rgba(0, 0, 0, 0.5)',
+		scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
+		scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
+		dateLabelFg: '@fg',
+		infoBg: '#253142',
+		infoFg: '#fff',
+		infoWarnBg: '#42321c',
+		infoWarnFg: '#ffbd3e',
+		folderHeaderBg: 'rgba(255, 255, 255, 0.05)',
+		folderHeaderHoverBg: 'rgba(255, 255, 255, 0.1)',
+		buttonBg: ':lighten<5<@panel',
+		buttonHoverBg: ':lighten<10<@panel',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':hue<20<@accent',
+		switchBg: 'rgba(255, 255, 255, 0.15)',
+		switchOffBg: 'rgba(255, 255, 255, 0.1)',
+		switchOffFg: ':alpha<0.8<@fg',
+		switchOnBg: '@accentedBg',
+		switchOnFg: '@accent',
+		inputBorder: 'rgba(255, 255, 255, 0.1)',
+		inputBorderHover: 'rgba(255, 255, 255, 0.2)',
+		listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
+		driveFolderBg: ':alpha<0.3<@accent',
+		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
+		badge: '#31b1ce',
+		messageBg: '@bg',
+		success: '#86b300',
+		error: '#ec4137',
+		warn: '#ecb637',
+		codeString: '#ffb675',
+		codeNumber: '#cfff9e',
+		codeBoolean: '#c59eff',
+		deckBg: '#000',
+		htmlThemeColor: '@bg',
+		X3: 'rgba(255, 255, 255, 0.05)',
+		X4: 'rgba(255, 255, 255, 0.1)',
+		X5: 'rgba(255, 255, 255, 0.05)',
+		X6: 'rgba(255, 255, 255, 0.15)',
+		X7: 'rgba(255, 255, 255, 0.05)',
+		X11: 'rgba(0, 0, 0, 0.3)',
+		X12: 'rgba(255, 255, 255, 0.1)',
+		X13: 'rgba(255, 255, 255, 0.15)',
+	},
+
+	codeHighlighter: {
+		base: 'one-dark-pro',
+	},
+}
diff --git a/packages/frontend-shared/themes/_light.json5 b/packages/frontend-shared/themes/_light.json5
new file mode 100644
index 0000000000..b6218a5f1d
--- /dev/null
+++ b/packages/frontend-shared/themes/_light.json5
@@ -0,0 +1,97 @@
+// ライトテーマのベーステーマ
+// このテーマが直接使われることは無い
+{
+	id: 'light',
+
+	name: 'Light',
+	author: 'syuilo',
+	desc: 'Default light theme',
+	kind: 'light',
+
+	props: {
+		accent: '#86b300',
+		accentDarken: ':darken<10<@accent',
+		accentLighten: ':lighten<10<@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		love: '#dd2e44',
+		focus: ':alpha<0.3<@accent',
+		bg: '#fff',
+		acrylicBg: ':alpha<0.5<@bg',
+		fg: '#5f5f5f',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		fgHighlighted: ':darken<3<@fg',
+		fgOnAccent: '#fff',
+		fgOnWhite: '#333',
+		divider: 'rgba(0, 0, 0, 0.1)',
+		indicator: '@accent',
+		panel: ':lighten<3<@bg',
+		panelHighlight: ':darken<3<@panel',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		panelBorder: '" solid 1px var(--divider)',
+		thread: ':darken<12<@panel',
+		acrylicPanel: ':alpha<0.5<@panel',
+		windowHeader: ':alpha<0.85<@panel',
+		popup: ':lighten<3<@panel',
+		shadow: 'rgba(0, 0, 0, 0.1)',
+		header: ':alpha<0.7<@panel',
+		navBg: '@panel',
+		navFg: '@fg',
+		navHoverFg: ':darken<17<@fg',
+		navActive: '@accent',
+		navIndicator: '@indicator',
+		link: '#44a4c1',
+		hashtag: '#ff9156',
+		mention: '@accent',
+		mentionMe: '@mention',
+		renote: '#229e82',
+		modalBg: 'rgba(0, 0, 0, 0.3)',
+		scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
+		scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
+		dateLabelFg: '@fg',
+		infoBg: '#e5f5ff',
+		infoFg: '#72818a',
+		infoWarnBg: '#fff0db',
+		infoWarnFg: '#8f6e31',
+		folderHeaderBg: 'rgba(0, 0, 0, 0.05)',
+		folderHeaderHoverBg: 'rgba(0, 0, 0, 0.1)',
+		buttonBg: ':darken<5<@panel',
+		buttonHoverBg: ':darken<10<@panel',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':hue<20<@accent',
+		switchBg: 'rgba(0, 0, 0, 0.15)',
+		switchOffBg: 'rgba(0, 0, 0, 0.1)',
+		switchOffFg: '@panel',
+		switchOnBg: '@accent',
+		switchOnFg: '@fgOnAccent',
+		inputBorder: 'rgba(0, 0, 0, 0.1)',
+		inputBorderHover: 'rgba(0, 0, 0, 0.2)',
+		listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
+		driveFolderBg: ':alpha<0.3<@accent',
+		wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
+		badge: '#31b1ce',
+		messageBg: '@bg',
+		success: '#86b300',
+		error: '#ec4137',
+		warn: '#ecb637',
+		codeString: '#b98710',
+		codeNumber: '#0fbbbb',
+		codeBoolean: '#62b70c',
+		deckBg: ':darken<3<@bg',
+		htmlThemeColor: '@bg',
+		X3: 'rgba(0, 0, 0, 0.05)',
+		X4: 'rgba(0, 0, 0, 0.1)',
+		X5: 'rgba(0, 0, 0, 0.05)',
+		X6: 'rgba(0, 0, 0, 0.25)',
+		X7: 'rgba(0, 0, 0, 0.05)',
+		X11: 'rgba(0, 0, 0, 0.1)',
+		X12: 'rgba(0, 0, 0, 0.1)',
+		X13: 'rgba(0, 0, 0, 0.15)',
+	},
+
+	codeHighlighter: {
+		base: 'catppuccin-latte',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-astro.json5 b/packages/frontend-shared/themes/d-astro.json5
new file mode 100644
index 0000000000..a674a5c5c9
--- /dev/null
+++ b/packages/frontend-shared/themes/d-astro.json5
@@ -0,0 +1,67 @@
+{
+	id: '080a01c5-377d-4fbb-88cc-6bb5d04977ea',
+	base: 'dark',
+	name: 'Mi Astro Dark',
+	author: 'syuilo',
+	props: {
+		bg: '#232125',
+		fg: '#efdab9',
+		link: '#78b0a0',
+		warn: '#ecb637',
+		badge: '#31b1ce',
+		error: '#ec4137',
+		focus: ':alpha<0.3<@accent',
+		navBg: '@panel',
+		navFg: '@fg',
+		panel: '#2a272b',
+		accent: '#81c08b',
+		header: ':alpha<0.7<@bg',
+		infoBg: '#253142',
+		infoFg: '#fff',
+		renote: '#659CC8',
+		shadow: 'rgba(0, 0, 0, 0.3)',
+		divider: 'rgba(255, 255, 255, 0.1)',
+		hashtag: '#ff9156',
+		mention: '#ffd152',
+		modalBg: 'rgba(0, 0, 0, 0.5)',
+		success: '#86b300',
+		acrylicBg: ':alpha<0.5<@bg',
+		indicator: '@accent',
+		mentionMe: '#fb5d38',
+		messageBg: '@bg',
+		navActive: '@accent',
+		infoWarnBg: '#42321c',
+		infoWarnFg: '#ffbd3e',
+		navHoverFg: ':lighten<17<@fg',
+		dateLabelFg: '@fg',
+		inputBorder: 'rgba(255, 255, 255, 0.1)',
+		inputBorderHover: 'rgba(255, 255, 255, 0.2)',
+		panelBorder: '" solid 1px var(--divider)',
+		accentDarken: ':darken<10<@accent',
+		acrylicPanel: ':alpha<0.5<@panel',
+		navIndicator: '@accent',
+		accentLighten: ':lighten<10<@accent',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':hue<-20<@accent',
+		driveFolderBg: ':alpha<0.3<@accent',
+		fgHighlighted: ':lighten<3<@fg',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		htmlThemeColor: '@bg',
+		fgOnWhite: '@accent',
+		panelHighlight: ':lighten<3<@panel',
+		listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
+		scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
+		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
+		X3: 'rgba(255, 255, 255, 0.05)',
+		X4: 'rgba(255, 255, 255, 0.1)',
+		X5: 'rgba(255, 255, 255, 0.05)',
+		X6: 'rgba(255, 255, 255, 0.15)',
+		X7: 'rgba(255, 255, 255, 0.05)',
+		X11: 'rgba(0, 0, 0, 0.3)',
+		X12: 'rgba(255, 255, 255, 0.1)',
+		X13: 'rgba(255, 255, 255, 0.15)',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-botanical.json5 b/packages/frontend-shared/themes/d-botanical.json5
new file mode 100644
index 0000000000..62208d2378
--- /dev/null
+++ b/packages/frontend-shared/themes/d-botanical.json5
@@ -0,0 +1,26 @@
+{
+	id: '504debaf-4912-6a4c-5059-1db08a76b737',
+
+	name: 'Mi Botanical Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: 'rgb(148, 179, 0)',
+		bg: 'rgb(37, 38, 36)',
+		fg: 'rgb(216, 212, 199)',
+		fgHighlighted: '#fff',
+		fgOnWhite: '@accent',
+		divider: 'rgba(255, 255, 255, 0.14)',
+		panel: 'rgb(47, 47, 44)',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		header: ':alpha<0.7<@panel',
+		navBg: '#363636',
+		renote: '@accent',
+		mention: 'rgb(212, 153, 76)',
+		mentionMe: 'rgb(212, 210, 76)',
+		hashtag: '#5bcbb0',
+		link: '@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-cherry.json5 b/packages/frontend-shared/themes/d-cherry.json5
new file mode 100644
index 0000000000..f9638124c2
--- /dev/null
+++ b/packages/frontend-shared/themes/d-cherry.json5
@@ -0,0 +1,21 @@
+{
+	id: '679b3b87-a4e9-4789-8696-b56c15cc33b0',
+
+	name: 'Mi Cherry Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: 'rgb(255, 89, 117)',
+		bg: 'rgb(28, 28, 37)',
+		fg: 'rgb(236, 239, 244)',
+		fgOnWhite: '@accent',
+		panel: 'rgb(35, 35, 47)',
+		renote: '@accent',
+		link: '@accent',
+		mention: '@accent',
+		hashtag: '@accent',
+		divider: 'rgb(63, 63, 80)',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-dark.json5 b/packages/frontend-shared/themes/d-dark.json5
new file mode 100644
index 0000000000..ae4f7d53f5
--- /dev/null
+++ b/packages/frontend-shared/themes/d-dark.json5
@@ -0,0 +1,26 @@
+{
+	id: '8050783a-7f63-445a-b270-36d0f6ba1677',
+
+	name: 'Mi Dark',
+	author: 'syuilo',
+	desc: 'Default light theme',
+
+	base: 'dark',
+
+	props: {
+		bg: '#232323',
+		fg: 'rgb(199, 209, 216)',
+		fgHighlighted: '#fff',
+		fgOnWhite: '@accent',
+		divider: 'rgba(255, 255, 255, 0.14)',
+		panel: '#2d2d2d',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		header: ':alpha<0.7<@panel',
+		navBg: '#363636',
+		renote: '@accent',
+		mention: '#da6d35',
+		mentionMe: '#d44c4c',
+		hashtag: '#4cb8d4',
+		link: '@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-future.json5 b/packages/frontend-shared/themes/d-future.json5
new file mode 100644
index 0000000000..f2c1f3eb86
--- /dev/null
+++ b/packages/frontend-shared/themes/d-future.json5
@@ -0,0 +1,27 @@
+{
+	id: '32a637ef-b47a-4775-bb7b-bacbb823f865',
+
+	name: 'Mi Future Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: '#63e2b7',
+		bg: '#101014',
+		fg: '#D5D5D6',
+		fgHighlighted: '#fff',
+		fgOnAccent: '#000',
+		fgOnWhite: '@accent',
+		divider: 'rgba(255, 255, 255, 0.1)',
+		panel: '#18181c',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		renote: '@accent',
+		mention: '#f2c97d',
+		mentionMe: '@accent',
+		hashtag: '#70c0e8',
+		link: '#e88080',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':saturate<30<:hue<30<@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-green-lime.json5 b/packages/frontend-shared/themes/d-green-lime.json5
new file mode 100644
index 0000000000..ca4e688fdb
--- /dev/null
+++ b/packages/frontend-shared/themes/d-green-lime.json5
@@ -0,0 +1,24 @@
+{
+	id: '02816013-8107-440f-877e-865083ffe194',
+
+	name: 'Mi Green+Lime Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: '#b4e900',
+		bg: '#0C1210',
+		fg: '#dee7e4',
+		fgHighlighted: '#fff',
+		fgOnAccent: '#192320',
+		fgOnWhite: '@accent',
+		divider: '#e7fffb24',
+		panel: '#192320',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		popup: '#293330',
+		renote: '@accent',
+		mentionMe: '#ffaa00',
+		link: '#24d7ce',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-green-orange.json5 b/packages/frontend-shared/themes/d-green-orange.json5
new file mode 100644
index 0000000000..c2539816e2
--- /dev/null
+++ b/packages/frontend-shared/themes/d-green-orange.json5
@@ -0,0 +1,24 @@
+{
+	id: 'dc489603-27b5-424a-9b25-1ff6aec9824a',
+
+	name: 'Mi Green+Orange Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: '#e97f00',
+		bg: '#0C1210',
+		fg: '#dee7e4',
+		fgHighlighted: '#fff',
+		fgOnAccent: '#192320',
+		fgOnWhite: '@accent',
+		divider: '#e7fffb24',
+		panel: '#192320',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		popup: '#293330',
+		renote: '@accent',
+		mentionMe: '#b4e900',
+		link: '#24d7ce',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-ice.json5 b/packages/frontend-shared/themes/d-ice.json5
new file mode 100644
index 0000000000..b4abc0cacb
--- /dev/null
+++ b/packages/frontend-shared/themes/d-ice.json5
@@ -0,0 +1,14 @@
+{
+	id: '66e7e5a9-cd43-42cd-837d-12f47841fa34',
+
+	name: 'Mi Ice Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: '#47BFE8',
+		fgOnWhite: '@accent',
+		bg: '#212526',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-persimmon.json5 b/packages/frontend-shared/themes/d-persimmon.json5
new file mode 100644
index 0000000000..0ab6523dd7
--- /dev/null
+++ b/packages/frontend-shared/themes/d-persimmon.json5
@@ -0,0 +1,26 @@
+{
+	id: 'c503d768-7c70-4db2-a4e6-08264304bc8d',
+
+	name: 'Mi Persimmon Dark',
+	author: 'syuilo',
+
+	base: 'dark',
+
+	props: {
+		accent: 'rgb(206, 102, 65)',
+		bg: 'rgb(31, 33, 31)',
+		fg: '#cdd8c7',
+		fgHighlighted: '#fff',
+		fgOnWhite: '@accent',
+		divider: 'rgba(255, 255, 255, 0.14)',
+		panel: 'rgb(41, 43, 41)',
+		infoFg: '@fg',
+		infoBg: '#333c3b',
+		navBg: '#141714',
+		renote: '@accent',
+		mention: '@accent',
+		mentionMe: '#de6161',
+		hashtag: '#68bad0',
+		link: '#a1c758',
+	},
+}
diff --git a/packages/frontend-shared/themes/d-u0.json5 b/packages/frontend-shared/themes/d-u0.json5
new file mode 100644
index 0000000000..32ac9ec5cf
--- /dev/null
+++ b/packages/frontend-shared/themes/d-u0.json5
@@ -0,0 +1,81 @@
+{
+	id: '7a5bc13b-df8f-4d44-8e94-4452f0c634bb',
+	base: 'dark',
+	name: 'Mi U0 Dark',
+	props: {
+		X3: 'rgba(255, 255, 255, 0.05)',
+		X4: 'rgba(255, 255, 255, 0.1)',
+		X5: 'rgba(255, 255, 255, 0.05)',
+		X6: 'rgba(255, 255, 255, 0.15)',
+		X7: 'rgba(255, 255, 255, 0.05)',
+		bg: '#172426',
+		fg: '#dadada',
+		X10: ':alpha<0.4<@accent',
+		X11: 'rgba(0, 0, 0, 0.3)',
+		X12: 'rgba(255, 255, 255, 0.1)',
+		X13: 'rgba(255, 255, 255, 0.15)',
+		X14: ':alpha<0.5<@navBg',
+		X15: ':alpha<0<@panel',
+		X16: ':alpha<0.7<@panel',
+		X17: ':alpha<0.8<@bg',
+		link: '@accent',
+		warn: '#ecb637',
+		badge: '#31b1ce',
+		error: '#ec4137',
+		focus: ':alpha<0.3<@accent',
+		navBg: '@panel',
+		navFg: '@fg',
+		panel: ':lighten<3<@bg',
+		popup: ':lighten<3<@panel',
+		accent: '#00a497',
+		header: ':alpha<0.7<@panel',
+		infoBg: '#253142',
+		infoFg: '#fff',
+		renote: '@accent',
+		shadow: 'rgba(0, 0, 0, 0.3)',
+		divider: 'rgba(255, 255, 255, 0.1)',
+		hashtag: '#e6b422',
+		mention: '@accent',
+		modalBg: 'rgba(0, 0, 0, 0.5)',
+		success: '#86b300',
+		switchBg: 'rgba(255, 255, 255, 0.15)',
+		acrylicBg: ':alpha<0.5<@bg',
+		indicator: '@accent',
+		mentionMe: '@mention',
+		messageBg: '@bg',
+		navActive: '@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		codeNumber: '#cfff9e',
+		codeString: '#ffb675',
+		fgOnAccent: '#fff',
+		fgOnWhite: '@accent',
+		infoWarnBg: '#42321c',
+		infoWarnFg: '#ffbd3e',
+		navHoverFg: ':lighten<17<@fg',
+		codeBoolean: '#c59eff',
+		dateLabelFg: '@fg',
+		inputBorder: 'rgba(255, 255, 255, 0.1)',
+		panelBorder: '" solid 1px var(--divider)',
+		accentDarken: ':darken<10<@accent',
+		acrylicPanel: ':alpha<0.5<@panel',
+		navIndicator: '@indicator',
+		accentLighten: ':lighten<10<@accent',
+		driveFolderBg: ':alpha<0.3<@accent',
+		fgHighlighted: ':lighten<3<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':hue<20<@accent',
+		htmlThemeColor: '@bg',
+		panelHighlight: ':lighten<3<@panel',
+		listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
+		scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
+		inputBorderHover: 'rgba(255, 255, 255, 0.2)',
+		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
+		deckBg: '#142022',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-apricot.json5 b/packages/frontend-shared/themes/l-apricot.json5
new file mode 100644
index 0000000000..fe1f9f8927
--- /dev/null
+++ b/packages/frontend-shared/themes/l-apricot.json5
@@ -0,0 +1,23 @@
+{
+	id: '0ff48d43-aab3-46e7-ab12-8492110d2e2b',
+
+	name: 'Mi Apricot Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		accent: 'rgb(234, 154, 82)',
+		bg: '#e6e5e2',
+		fg: 'rgb(149, 143, 139)',
+		fgOnWhite: '@accent',
+		panel: '#EEECE8',
+		renote: '@accent',
+		link: '@accent',
+		mention: '@accent',
+		hashtag: '@accent',
+		inputBorder: 'rgba(0, 0, 0, 0.1)',
+		inputBorderHover: 'rgba(0, 0, 0, 0.2)',
+		infoBg: 'rgb(226, 235, 241)',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-botanical.json5 b/packages/frontend-shared/themes/l-botanical.json5
new file mode 100644
index 0000000000..17e9ca246f
--- /dev/null
+++ b/packages/frontend-shared/themes/l-botanical.json5
@@ -0,0 +1,30 @@
+{
+	id: '1100673c-f902-4ccd-93aa-7cb88be56178',
+
+	name: 'Mi Botanical Light',
+	author: 'ThinaticSystem',
+
+  base: 'light',
+
+	props: {
+		accent: '#77b58c',
+		bg: 'e2deda',
+		fg: '#3d3d3d',
+		fgHighlighted: '#6bc9a0',
+		fgOnWhite: '@accent',
+		divider: '#cfcfcf',
+		panel: '@X14',
+		panelHeaderBg: '@panel',
+		panelHeaderDivider: '@divider',
+		header: ':alpha<0.7<@panel',
+		navBg: '@X14',
+		renote: '#229e92',
+		mention: '#da6d35',
+		mentionMe: '#d44c4c',
+		hashtag: '#4cb8d4',
+		link: '@accent',
+		buttonGradateB: ':hue<-70<@accent',
+		success: '#86b300',
+    X14: '#ebe7e5'
+	},
+}
diff --git a/packages/frontend-shared/themes/l-cherry.json5 b/packages/frontend-shared/themes/l-cherry.json5
new file mode 100644
index 0000000000..1189a28fe6
--- /dev/null
+++ b/packages/frontend-shared/themes/l-cherry.json5
@@ -0,0 +1,22 @@
+{
+	id: 'ac168876-f737-4074-a3fc-a370c732ef48',
+
+	name: 'Mi Cherry Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		accent: 'rgb(219, 96, 114)',
+		bg: 'rgb(254, 248, 249)',
+		fg: 'rgb(152, 13, 26)',
+		fgOnWhite: '@accent',
+		panel: 'rgb(255, 255, 255)',
+		renote: '@accent',
+		link: 'rgb(156, 187, 5)',
+		mention: '@accent',
+		hashtag: '@accent',
+		divider: 'rgba(134, 51, 51, 0.1)',
+		inputBorderHover: 'rgb(238, 221, 222)',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-coffee.json5 b/packages/frontend-shared/themes/l-coffee.json5
new file mode 100644
index 0000000000..b64cc73583
--- /dev/null
+++ b/packages/frontend-shared/themes/l-coffee.json5
@@ -0,0 +1,22 @@
+{
+	id: '6ed80faa-74f0-42c2-98e4-a64d9e138eab',
+
+	name: 'Mi Coffee Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		accent: '#9f8989',
+		bg: '#f5f3f3',
+		fg: '#7f6666',
+		fgOnWhite: '@accent',
+		panel: '#fff',
+		divider: 'rgba(87, 68, 68, 0.1)',
+		renote: 'rgb(160, 172, 125)',
+		link: 'rgb(137, 151, 159)',
+		mention: '@accent',
+		mentionMe: 'rgb(170, 149, 98)',
+		hashtag: '@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-light.json5 b/packages/frontend-shared/themes/l-light.json5
new file mode 100644
index 0000000000..63c2e6d278
--- /dev/null
+++ b/packages/frontend-shared/themes/l-light.json5
@@ -0,0 +1,21 @@
+{
+	id: '4eea646f-7afa-4645-83e9-83af0333cd37',
+
+	name: 'Mi Light',
+	author: 'syuilo',
+	desc: 'Default light theme',
+
+	base: 'light',
+
+	props: {
+		bg: '#f9f9f9',
+		fg: '#676767',
+		fgOnWhite: '@accent',
+		divider: '#e8e8e8',
+		header: ':alpha<0.7<@panel',
+		navBg: '#fff',
+		panel: '#fff',
+		panelHeaderDivider: '@divider',
+		mentionMe: 'rgb(0, 179, 70)',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-rainy.json5 b/packages/frontend-shared/themes/l-rainy.json5
new file mode 100644
index 0000000000..e7d1d5af00
--- /dev/null
+++ b/packages/frontend-shared/themes/l-rainy.json5
@@ -0,0 +1,22 @@
+{
+	id: 'a58a0abb-ff8c-476a-8dec-0ad7837e7e96',
+
+	name: 'Mi Rainy Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		accent: '#5db0da',
+		bg: 'rgb(246 248 249)',
+		fg: '#636b71',
+		fgOnWhite: '@accent',
+		panel: '#fff',
+		divider: 'rgb(230 233 234)',
+		panelHeaderDivider: '@divider',
+		renote: '@accent',
+		link: '@accent',
+		mention: '@accent',
+		hashtag: '@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-sushi.json5 b/packages/frontend-shared/themes/l-sushi.json5
new file mode 100644
index 0000000000..f1523b698c
--- /dev/null
+++ b/packages/frontend-shared/themes/l-sushi.json5
@@ -0,0 +1,19 @@
+{
+	id: '213273e5-7d20-d5f0-6e36-1b6a4f67115c',
+
+	name: 'Mi Sushi Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		accent: '#e36749',
+		bg: '#f0eee9',
+		fg: '#5f5f5f',
+		fgOnWhite: '@accent',
+		renote: '@accent',
+		link: '@accent',
+		mention: '@accent',
+		hashtag: '@accent',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-u0.json5 b/packages/frontend-shared/themes/l-u0.json5
new file mode 100644
index 0000000000..0b952b003a
--- /dev/null
+++ b/packages/frontend-shared/themes/l-u0.json5
@@ -0,0 +1,82 @@
+{
+	id: 'e2c940b5-6e9a-4c03-b738-261c720c426d',
+	base: 'light',
+	name: 'Mi U0 Light',
+	props: {
+		X3: 'rgba(255, 255, 255, 0.05)',
+		X4: 'rgba(255, 255, 255, 0.1)',
+		X5: 'rgba(255, 255, 255, 0.05)',
+		X6: 'rgba(255, 255, 255, 0.15)',
+		X7: 'rgba(255, 255, 255, 0.05)',
+		bg: '#e7e7eb',
+		fg: '#5f5f5f',
+		X10: ':alpha<0.4<@accent',
+		X11: 'rgba(0, 0, 0, 0.3)',
+		X12: 'rgba(255, 255, 255, 0.1)',
+		X13: 'rgba(255, 255, 255, 0.15)',
+		X14: ':alpha<0.5<@navBg',
+		X15: ':alpha<0<@panel',
+		X16: ':alpha<0.7<@panel',
+		X17: ':alpha<0.8<@bg',
+		link: '@accent',
+		warn: '#ecb637',
+		badge: '#31b1ce',
+		error: '#ec4137',
+		focus: ':alpha<0.3<@accent',
+		navBg: '@panel',
+		navFg: '@fg',
+		panel: ':lighten<3<@bg',
+		popup: ':lighten<3<@panel',
+		accent: '#478384',
+		header: ':alpha<0.7<@panel',
+		infoBg: '#253142',
+		infoFg: '#fff',
+		renote: '@accent',
+		shadow: 'rgba(0, 0, 0, 0.3)',
+		divider: '#4646461a',
+		hashtag: '#1f3134',
+		mention: '@accent',
+		modalBg: 'rgba(0, 0, 0, 0.5)',
+		success: '#86b300',
+		buttonBg: '#0000000d',
+		switchBg: 'rgba(255, 255, 255, 0.15)',
+		acrylicBg: ':alpha<0.5<@bg',
+		indicator: '@accent',
+		mentionMe: '@mention',
+		messageBg: '@bg',
+		navActive: '@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		codeNumber: '#cfff9e',
+		codeString: '#ffb675',
+		fgOnAccent: '#fff',
+		fgOnWhite: '@accent',
+		infoWarnBg: '#42321c',
+		infoWarnFg: '#ffbd3e',
+		navHoverFg: ':lighten<17<@fg',
+		codeBoolean: '#c59eff',
+		dateLabelFg: '@fg',
+		inputBorder: 'rgba(255, 255, 255, 0.1)',
+		panelBorder: '" solid 1px var(--divider)',
+		accentDarken: ':darken<10<@accent',
+		acrylicPanel: ':alpha<0.5<@panel',
+		navIndicator: '@indicator',
+		accentLighten: ':lighten<10<@accent',
+		buttonHoverBg: '#0000001a',
+		driveFolderBg: ':alpha<0.3<@accent',
+		fgHighlighted: ':lighten<3<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		buttonGradateA: '@accent',
+		buttonGradateB: ':hue<20<@accent',
+		htmlThemeColor: '@bg',
+		panelHighlight: ':lighten<3<@panel',
+		listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
+		scrollbarHandle: '#74747433',
+		inputBorderHover: 'rgba(255, 255, 255, 0.2)',
+		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
+	},
+}
diff --git a/packages/frontend-shared/themes/l-vivid.json5 b/packages/frontend-shared/themes/l-vivid.json5
new file mode 100644
index 0000000000..f1c63dde6e
--- /dev/null
+++ b/packages/frontend-shared/themes/l-vivid.json5
@@ -0,0 +1,70 @@
+{
+	id: '6128c2a9-5c54-43fe-a47d-17942356470b',
+
+	name: 'Mi Vivid Light',
+	author: 'syuilo',
+
+	base: 'light',
+
+	props: {
+		bg: '#fafafa',
+		fg: '#444',
+		link: '#ff9400',
+		warn: '#ecb637',
+		badge: '#31b1ce',
+		error: '#ec4137',
+		focus: ':alpha<0.3<@accent',
+		navBg: '@panel',
+		navFg: '@fg',
+		panel: '#fff',
+		accent: '#008cff',
+		header: ':alpha<0.7<@panel',
+		infoBg: '#e5f5ff',
+		infoFg: '#72818a',
+		renote: '@accent',
+		shadow: 'rgba(0, 0, 0, 0.1)',
+		divider: 'rgba(0, 0, 0, 0.08)',
+		hashtag: '#92d400',
+		mention: '@accent',
+		modalBg: 'rgba(0, 0, 0, 0.3)',
+		success: '#86b300',
+		acrylicBg: ':alpha<0.5<@bg',
+		indicator: '@accent',
+		mentionMe: '@mention',
+		messageBg: '@bg',
+		navActive: '@accent',
+		infoWarnBg: '#fff0db',
+		infoWarnFg: '#8f6e31',
+		navHoverFg: ':darken<17<@fg',
+		dateLabelFg: '@fg',
+		inputBorder: 'rgba(0, 0, 0, 0.1)',
+		inputBorderHover: 'rgba(0, 0, 0, 0.2)',
+		panelBorder: '" solid 1px var(--divider)',
+		accentDarken: ':darken<10<@accent',
+		acrylicPanel: ':alpha<0.5<@panel',
+		navIndicator: '@accent',
+		accentLighten: ':lighten<10<@accent',
+		driveFolderBg: ':alpha<0.3<@accent',
+		fgHighlighted: ':darken<3<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		fgOnWhite: '@accent',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		htmlThemeColor: '@bg',
+		panelHighlight: ':darken<3<@panel',
+		listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
+		scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
+		wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		panelHeaderDivider: '@divider',
+		scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
+		X3: 'rgba(0, 0, 0, 0.05)',
+		X4: 'rgba(0, 0, 0, 0.1)',
+		X5: 'rgba(0, 0, 0, 0.05)',
+		X6: 'rgba(0, 0, 0, 0.25)',
+		X7: 'rgba(0, 0, 0, 0.05)',
+		X11: 'rgba(0, 0, 0, 0.1)',
+		X12: 'rgba(0, 0, 0, 0.1)',
+		X13: 'rgba(0, 0, 0, 0.15)',
+	},
+}
diff --git a/packages/frontend-shared/themes/rosepine-dawn.json5 b/packages/frontend-shared/themes/rosepine-dawn.json5
new file mode 100644
index 0000000000..ff1ca0c996
--- /dev/null
+++ b/packages/frontend-shared/themes/rosepine-dawn.json5
@@ -0,0 +1,89 @@
+{
+	id: '919c91ac-c6fa-43dc-a423-3cc84fd67d7c',
+	base: 'light',
+	name: ' Rosé Pine Dawn',
+	description: 'Soho vibes for Misskey, dawn edition',
+	props: {
+		accent: '#286983',
+		accentDarken: ':darken<10<@accent',
+		accentLighten: ':lighten<10<@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		focus: ':alpha<0.3<@accent',
+		bg: '#faf4ed',
+		acrylicBg: ':alpha<0.5<@bg',
+		fg: '#575279',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		fgHighlighted: ':darken<3<@fg',
+		fgOnAccent: '#fffaf3',
+		divider: 'rgba(0, 0, 0, 0.1)',
+		indicator: '@accent',
+		panel: ':lighten<3<@bg',
+		panelHighlight: ':darken<3<@panel',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		panelBorder: '" solid 1px var(--divider)',
+		acrylicPanel: ':alpha<0.5<@panel',
+		popup: ':lighten<3<@panel',
+		shadow: 'rgba(0, 0, 0, 0.1)',
+		header: ':alpha<0.7<@panel',
+		navBg: '@panel',
+		navFg: '@fg',
+		navHoverFg: ':darken<17<@fg',
+		navActive: '@accent',
+		navIndicator: '@indicator',
+		link: '#56949f',
+		hashtag: '#ea9d34',
+		mention: '@accent',
+		mentionMe: '@mention',
+		renote: '#56949f',
+		modalBg: 'rgba(0, 0, 0, 0.3)',
+		scrollbarHandle: 'rgba(0, 0, 0, 0.2)',
+		scrollbarHandleHover: 'rgba(0, 0, 0, 0.4)',
+		dateLabelFg: '@fg',
+		infoBg: '#f2e9e1',
+		infoFg: '#ea9d34',
+		infoWarnBg: '#f2e9e1',
+		infoWarnFg: '#b4637a',
+		switchBg: 'rgba(0, 0, 0, 0.15)',
+		cwBg: '#b4637a',
+		cwFg: '#faf4ed',
+		cwHoverBg: '#d7827e',
+		buttonBg: 'rgba(0, 0, 0, 0.05)',
+		buttonHoverBg: 'rgba(0, 0, 0, 0.1)',
+		buttonGradateA: '#d7827e',
+		buttonGradateB: ':hue<20<#d7827e',
+		inputBorder: 'rgba(0, 0, 0, 0.1)',
+		inputBorderHover: 'rgba(0, 0, 0, 0.2)',
+		listItemHoverBg: 'rgba(0, 0, 0, 0.03)',
+		driveFolderBg: ':alpha<0.3<@accent',
+		wallpaperOverlay: 'rgba(255, 255, 255, 0.5)',
+		badge: '#31b1ce',
+		messageBg: '@bg',
+		success: '#907aa9',
+		error: '#b4637a',
+		warn: '#ea9d34',
+		codeString: '#b98710',
+		codeNumber: '#0fbbbb',
+		codeBoolean: '#62b70c',
+		htmlThemeColor: '@bg',
+		X2: ':darken<2<@panel',
+		X3: 'rgba(0, 0, 0, 0.05)',
+		X4: 'rgba(0, 0, 0, 0.1)',
+		X5: 'rgba(0, 0, 0, 0.05)',
+		X6: 'rgba(0, 0, 0, 0.25)',
+		X7: 'rgba(0, 0, 0, 0.05)',
+		X8: ':lighten<5<@accent',
+		X9: ':darken<5<@accent',
+		X10: ':alpha<0.4<@accent',
+		X11: 'rgba(0, 0, 0, 0.1)',
+		X12: 'rgba(0, 0, 0, 0.1)',
+		X13: 'rgba(0, 0, 0, 0.15)',
+		X14: ':alpha<0.5<@navBg',
+		X15: ':alpha<0<@panel',
+		X16: ':alpha<0.7<@panel',
+		X17: ':alpha<0.8<@bg',
+	},
+	author: '@thatonecalculator@stop.voring.me',
+}
\ No newline at end of file
diff --git a/packages/frontend-shared/themes/rosepine.json5 b/packages/frontend-shared/themes/rosepine.json5
new file mode 100644
index 0000000000..06516f75fc
--- /dev/null
+++ b/packages/frontend-shared/themes/rosepine.json5
@@ -0,0 +1,86 @@
+{
+	id: '3cdfd635-4d5e-4d06-9ba3-20f123f0999b',
+	base: 'dark',
+	desc: 'Soho vibes for Misskey',
+	name: 'Rosé Pine v3',
+	props: {
+		X2: ':darken<2<@panel',
+		X3: 'rgba(255, 255, 255, 0.05)',
+		X4: 'rgba(255, 255, 255, 0.1)',
+		X5: 'rgba(255, 255, 255, 0.05)',
+		X6: 'rgba(255, 255, 255, 0.15)',
+		X7: 'rgba(255, 255, 255, 0.05)',
+		X8: ':lighten<5<@accent',
+		X9: ':darken<5<@accent',
+		bg: '#191724',
+		fg: '#e0def4',
+		X10: ':alpha<0.4<@accent',
+		X11: 'rgba(0, 0, 0, 0.3)',
+		X12: 'rgba(255, 255, 255, 0.1)',
+		X13: 'rgba(255, 255, 255, 0.15)',
+		X14: ':alpha<0.5<@navBg',
+		X15: ':alpha<0<@panel',
+		X16: ':alpha<0.7<@panel',
+		X17: ':alpha<0.8<@bg',
+		cwBg: '#1f1d2e',
+		cwFg: '#f6c177',
+		link: '#9ccfd8',
+		warn: '#f6c177',
+		badge: '#ebbcba',
+		error: '#eb6f92',
+		focus: ':alpha<0.3<@accent',
+		navBg: '@panel',
+		navFg: '@fg',
+		panel: ':lighten<3<@bg',
+		popup: ':lighten<3<@panel',
+		accent: '#c4a7e7',
+		header: ':alpha<0.7<@panel',
+		infoBg: '#253142',
+		infoFg: '#fff',
+		renote: '#31748f',
+		shadow: 'rgba(0, 0, 0, 0.3)',
+		divider: 'rgba(255, 255, 255, 0.1)',
+		hashtag: '#ebbcba',
+		mention: '@accent',
+		modalBg: 'rgba(0, 0, 0, 0.5)',
+		success: '#ebbcba',
+		buttonBg: 'rgba(255, 255, 255, 0.05)',
+		switchBg: 'rgba(255, 255, 255, 0.15)',
+		acrylicBg: ':alpha<0.5<@bg',
+		cwHoverBg: '#26233a',
+		indicator: '@accent',
+		mentionMe: '@mention',
+		messageBg: '@bg',
+		navActive: '@accent',
+		accentedBg: ':alpha<0.15<@accent',
+		fgOnAccent: '#26233a',
+		infoWarnBg: '#26233a',
+		infoWarnFg: '#f6c177',
+		navHoverFg: ':lighten<17<@fg',
+		dateLabelFg: '@fg',
+		inputBorder: 'rgba(255, 255, 255, 0.1)',
+		panelBorder: '" solid 1px var(--divider)',
+		accentDarken: ':darken<10<@accent',
+		acrylicPanel: ':alpha<0.5<@panel',
+		navIndicator: '@indicator',
+		accentLighten: ':lighten<10<@accent',
+		buttonHoverBg: 'rgba(255, 255, 255, 0.1)',
+		driveFolderBg: ':alpha<0.3<@accent',
+		fgHighlighted: ':lighten<3<@fg',
+		fgTransparent: ':alpha<0.5<@fg',
+		panelHeaderBg: ':lighten<3<@panel',
+		panelHeaderFg: '@fg',
+		buttonGradateA: '@accent',
+		buttonGradateB: '#ebbcba',
+		htmlThemeColor: '@bg',
+		panelHighlight: ':lighten<3<@panel',
+		listItemHoverBg: 'rgba(255, 255, 255, 0.03)',
+		scrollbarHandle: 'rgba(255, 255, 255, 0.2)',
+		inputBorderHover: 'rgba(255, 255, 255, 0.2)',
+		wallpaperOverlay: 'rgba(0, 0, 0, 0.5)',
+		fgTransparentWeak: ':alpha<0.75<@fg',
+		panelHeaderDivider: 'rgba(0, 0, 0, 0)',
+		scrollbarHandleHover: 'rgba(255, 255, 255, 0.4)',
+	},
+	author: '@thatonecalculator@stop.voring.me',
+}
\ No newline at end of file