diff --git a/themes/abcdef/src/index.ts b/themes/abcdef/src/index.ts
index 338cae680..3555625e4 100644
--- a/themes/abcdef/src/index.ts
+++ b/themes/abcdef/src/index.ts
@@ -6,19 +6,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsAbcdef: CreateThemeOptions['settings'] = {
+  background: '#0f0f0f',
+  foreground: '#defdef',
+  caret: '#00FF00',
+  selection: '#515151',
+  selectionMatch: '#515151',
+  gutterBackground: '#555',
+  gutterForeground: '#FFFFFF',
+  lineHighlight: '#314151',
+};
+
 export const abcdefInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#0f0f0f',
-      foreground: '#defdef',
-      caret: '#00FF00',
-      selection: '#515151',
-      selectionMatch: '#515151',
-      gutterBackground: '#555',
-      gutterForeground: '#FFFFFF',
-      lineHighlight: '#314151',
+      ...defaultSettingsAbcdef,
       ...settings,
     },
     styles: [
diff --git a/themes/androidstudio/src/index.ts b/themes/androidstudio/src/index.ts
index 669d9dc24..0489cd08d 100644
--- a/themes/androidstudio/src/index.ts
+++ b/themes/androidstudio/src/index.ts
@@ -4,17 +4,21 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsAndroidstudio: CreateThemeOptions['settings'] = {
+  background: '#282b2e',
+  foreground: '#a9b7c6',
+  caret: '#00FF00',
+  selection: '#343739',
+  selectionMatch: '#343739',
+  lineHighlight: '#343739',
+};
+
 export const androidstudioInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#282b2e',
-      foreground: '#a9b7c6',
-      caret: '#00FF00',
-      selection: '#343739',
-      selectionMatch: '#343739',
-      lineHighlight: '#343739',
+      ...defaultSettingsAndroidstudio,
       ...settings,
     },
     styles: [
diff --git a/themes/atomone/src/index.ts b/themes/atomone/src/index.ts
index b8ac77dae..5aacbec0c 100644
--- a/themes/atomone/src/index.ts
+++ b/themes/atomone/src/index.ts
@@ -7,20 +7,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsAtomone: CreateThemeOptions['settings'] = {
+  background: '#272C35',
+  foreground: '#9d9b97',
+  caret: '#797977',
+  selection: '#ffffff30',
+  selectionMatch: '#2B323D',
+  gutterBackground: '#272C35',
+  gutterForeground: '#465063',
+  gutterBorder: 'transparent',
+  lineHighlight: '#2B323D',
+};
+
 export const atomoneInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#272C35',
-      foreground: '#9d9b97',
-      caret: '#797977',
-      selection: '#ffffff30',
-      selectionMatch: '#2B323D',
-      gutterBackground: '#272C35',
-      gutterForeground: '#465063',
-      gutterBorder: 'transparent',
-      lineHighlight: '#2B323D',
+      ...defaultSettingsAtomone,
       ...settings,
     },
     styles: [
diff --git a/themes/aura/src/index.ts b/themes/aura/src/index.ts
index ca5c3cd99..e968dd4dc 100644
--- a/themes/aura/src/index.ts
+++ b/themes/aura/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsAura: CreateThemeOptions['settings'] = {
+  background: '#21202e',
+  foreground: '#edecee',
+  caret: '#a277ff',
+  selection: '#3d375e7f',
+  selectionMatch: '#3d375e7f',
+  gutterBackground: '#21202e',
+  gutterForeground: '#edecee',
+  gutterBorder: 'transparent',
+  lineHighlight: '#a394f033',
+};
+
 export const auraInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#21202e',
-      foreground: '#edecee',
-      caret: '#a277ff',
-      selection: '#3d375e7f',
-      selectionMatch: '#3d375e7f',
-      gutterBackground: '#21202e',
-      gutterForeground: '#edecee',
-      gutterBorder: 'transparent',
-      lineHighlight: '#a394f033',
+      ...defaultSettingsAura,
       ...settings,
     },
     styles: [
diff --git a/themes/bbedit/src/index.ts b/themes/bbedit/src/index.ts
index 331c2851e..f06de4bb6 100644
--- a/themes/bbedit/src/index.ts
+++ b/themes/bbedit/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsBbedit: CreateThemeOptions['settings'] = {
+  background: '#FFFFFF',
+  foreground: '#000000',
+  caret: '#FBAC52',
+  selection: '#FFD420',
+  selectionMatch: '#FFD420',
+  gutterBackground: '#f5f5f5',
+  gutterForeground: '#4D4D4C',
+  gutterBorder: 'transparent',
+  lineHighlight: '#00000012',
+};
+
 export const bbeditInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#FFFFFF',
-      foreground: '#000000',
-      caret: '#FBAC52',
-      selection: '#FFD420',
-      selectionMatch: '#FFD420',
-      gutterBackground: '#f5f5f5',
-      gutterForeground: '#4D4D4C',
-      gutterBorder: 'transparent',
-      lineHighlight: '#00000012',
+      ...defaultSettingsBbedit,
       ...settings,
     },
     styles: [
diff --git a/themes/bespin/src/index.ts b/themes/bespin/src/index.ts
index 6a69b7402..5eb335e2b 100644
--- a/themes/bespin/src/index.ts
+++ b/themes/bespin/src/index.ts
@@ -8,19 +8,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsBespin: CreateThemeOptions['settings'] = {
+  background: '#28211c',
+  foreground: '#9d9b97',
+  caret: '#797977',
+  selection: '#36312e',
+  selectionMatch: '#4f382b',
+  gutterBackground: '#28211c',
+  gutterForeground: '#666666',
+  lineHighlight: 'rgba(255, 255, 255, 0.1)',
+};
+
 export const bespinInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#28211c',
-      foreground: '#9d9b97',
-      caret: '#797977',
-      selection: '#36312e',
-      selectionMatch: '#4f382b',
-      gutterBackground: '#28211c',
-      gutterForeground: '#666666',
-      lineHighlight: 'rgba(255, 255, 255, 0.1)',
+      ...defaultSettingsBespin,
       ...settings,
     },
     styles: [
diff --git a/themes/darcula/src/index.ts b/themes/darcula/src/index.ts
index 32a423736..d32bf9d84 100644
--- a/themes/darcula/src/index.ts
+++ b/themes/darcula/src/index.ts
@@ -7,20 +7,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsDarcula: CreateThemeOptions['settings'] = {
+  background: '#2B2B2B',
+  foreground: '#f8f8f2',
+  caret: '#FFFFFF',
+  selection: 'rgba(255, 255, 255, 0.1)',
+  selectionMatch: 'rgba(255, 255, 255, 0.2)',
+  gutterBackground: 'rgba(255, 255, 255, 0.1)',
+  gutterForeground: '#999',
+  gutterBorder: 'transparent',
+  lineHighlight: 'rgba(255, 255, 255, 0.1)',
+};
+
 export const darculaInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#2B2B2B',
-      foreground: '#f8f8f2',
-      caret: '#FFFFFF',
-      selection: 'rgba(255, 255, 255, 0.1)',
-      selectionMatch: 'rgba(255, 255, 255, 0.2)',
-      gutterBackground: 'rgba(255, 255, 255, 0.1)',
-      gutterForeground: '#999',
-      gutterBorder: 'transparent',
-      lineHighlight: 'rgba(255, 255, 255, 0.1)',
+      ...defaultSettingsDarcula,
       ...settings,
     },
     styles: [
diff --git a/themes/dracula/src/index.ts b/themes/dracula/src/index.ts
index 9e2d1992b..b107bcfca 100644
--- a/themes/dracula/src/index.ts
+++ b/themes/dracula/src/index.ts
@@ -7,20 +7,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsDracula: CreateThemeOptions['settings'] = {
+  background: '#282a36',
+  foreground: '#f8f8f2',
+  caret: '#f8f8f0',
+  selection: 'rgba(255, 255, 255, 0.1)',
+  selectionMatch: 'rgba(255, 255, 255, 0.2)',
+  gutterBackground: '#282a36',
+  gutterForeground: '#6D8A88',
+  gutterBorder: 'transparent',
+  lineHighlight: 'rgba(255, 255, 255, 0.1)',
+};
+
 export const draculaInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#282a36',
-      foreground: '#f8f8f2',
-      caret: '#f8f8f0',
-      selection: 'rgba(255, 255, 255, 0.1)',
-      selectionMatch: 'rgba(255, 255, 255, 0.2)',
-      gutterBackground: '#282a36',
-      gutterForeground: '#6D8A88',
-      gutterBorder: 'transparent',
-      lineHighlight: 'rgba(255, 255, 255, 0.1)',
+      ...defaultSettingsDracula,
       ...settings,
     },
     styles: [
diff --git a/themes/duotone/src/index.ts b/themes/duotone/src/index.ts
index 5b685743d..98a5ed933 100644
--- a/themes/duotone/src/index.ts
+++ b/themes/duotone/src/index.ts
@@ -6,20 +6,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsDuotoneLight: CreateThemeOptions['settings'] = {
+  background: '#faf8f5',
+  foreground: '#b29762',
+  caret: '#93abdc',
+  selection: '#e3dcce',
+  selectionMatch: '#e3dcce',
+  gutterBackground: '#faf8f5',
+  gutterForeground: '#cdc4b1',
+  gutterBorder: 'transparent',
+  lineHighlight: '#EFEFEF',
+};
+
 export const duotoneLightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#faf8f5',
-      foreground: '#b29762',
-      caret: '#93abdc',
-      selection: '#e3dcce',
-      selectionMatch: '#e3dcce',
-      gutterBackground: '#faf8f5',
-      gutterForeground: '#cdc4b1',
-      gutterBorder: 'transparent',
-      lineHighlight: '#EFEFEF',
+      ...defaultSettingsDuotoneLight,
       ...settings,
     },
     styles: [
@@ -37,18 +41,22 @@ export const duotoneLightInit = (options?: Partial<CreateThemeOptions>) => {
 
 export const duotoneLight = duotoneLightInit();
 
+export const defaultSettingsDuotoneDark: CreateThemeOptions['settings'] = {
+  background: '#2a2734',
+  foreground: '#6c6783',
+  caret: '#ffad5c',
+  selection: 'rgba(255, 255, 255, 0.1)',
+  gutterBackground: '#2a2734',
+  gutterForeground: '#545167',
+  lineHighlight: '#36334280',
+};
+
 export const duotoneDarkInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#2a2734',
-      foreground: '#6c6783',
-      caret: '#ffad5c',
-      selection: 'rgba(255, 255, 255, 0.1)',
-      gutterBackground: '#2a2734',
-      gutterForeground: '#545167',
-      lineHighlight: '#36334280',
+      ...defaultSettingsDuotoneDark,
       ...settings,
     },
     styles: [
diff --git a/themes/eclipse/src/index.ts b/themes/eclipse/src/index.ts
index a3887e7d0..76a6ea2b8 100644
--- a/themes/eclipse/src/index.ts
+++ b/themes/eclipse/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsEclipse: CreateThemeOptions['settings'] = {
+  background: '#fff',
+  foreground: '#000',
+  caret: '#FFFFFF',
+  selection: '#d7d4f0',
+  selectionMatch: '#d7d4f0',
+  gutterBackground: '#f7f7f7',
+  gutterForeground: '#999',
+  lineHighlight: '#e8f2ff',
+  gutterBorder: 'transparent',
+};
+
 export const eclipseInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#fff',
-      foreground: '#000',
-      caret: '#FFFFFF',
-      selection: '#d7d4f0',
-      selectionMatch: '#d7d4f0',
-      gutterBackground: '#f7f7f7',
-      gutterForeground: '#999',
-      lineHighlight: '#e8f2ff',
-      gutterBorder: 'transparent',
+      ...defaultSettingsEclipse,
       ...settings,
     },
     styles: [
diff --git a/themes/github/src/index.ts b/themes/github/src/index.ts
index 01147dab9..721501c13 100644
--- a/themes/github/src/index.ts
+++ b/themes/github/src/index.ts
@@ -4,17 +4,21 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsGithubLight: CreateThemeOptions['settings'] = {
+  background: '#fff',
+  foreground: '#24292e',
+  selection: '#BBDFFF',
+  selectionMatch: '#BBDFFF',
+  gutterBackground: '#fff',
+  gutterForeground: '#6e7781',
+};
+
 export const githubLightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#fff',
-      foreground: '#24292e',
-      selection: '#BBDFFF',
-      selectionMatch: '#BBDFFF',
-      gutterBackground: '#fff',
-      gutterForeground: '#6e7781',
+      ...defaultSettingsGithubLight,
       ...settings,
     },
     styles: [
@@ -40,17 +44,21 @@ export const githubLightInit = (options?: Partial<CreateThemeOptions>) => {
 
 export const githubLight = githubLightInit();
 
+export const defaultSettingsGithubDark: CreateThemeOptions['settings'] = {
+  background: '#0d1117',
+  foreground: '#c9d1d9',
+  caret: '#c9d1d9',
+  selection: '#003d73',
+  selectionMatch: '#003d73',
+  lineHighlight: '#36334280',
+};
+
 export const githubDarkInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#0d1117',
-      foreground: '#c9d1d9',
-      caret: '#c9d1d9',
-      selection: '#003d73',
-      selectionMatch: '#003d73',
-      lineHighlight: '#36334280',
+      ...defaultSettingsGithubDark,
       ...settings,
     },
     styles: [
diff --git a/themes/gruvbox/src/index.ts b/themes/gruvbox/src/index.ts
index 79569cfcb..b4fa425f2 100644
--- a/themes/gruvbox/src/index.ts
+++ b/themes/gruvbox/src/index.ts
@@ -7,19 +7,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsGruvboxDark: CreateThemeOptions['settings'] = {
+  background: '#282828',
+  foreground: '#ebdbb2',
+  caret: '#ebdbb2',
+  selection: '#bdae93',
+  selectionMatch: '#bdae93',
+  lineHighlight: '#3c3836',
+  gutterBackground: '#282828',
+  gutterForeground: '#7c6f64',
+};
+
 export const gruvboxDarkInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#282828',
-      foreground: '#ebdbb2',
-      caret: '#ebdbb2',
-      selection: '#bdae93',
-      selectionMatch: '#bdae93',
-      lineHighlight: '#3c3836',
-      gutterBackground: '#282828',
-      gutterForeground: '#7c6f64',
+      ...defaultSettingsGruvboxDark,
       ...settings,
     },
     styles: [
@@ -122,20 +126,24 @@ export const gruvboxDarkInit = (options?: Partial<CreateThemeOptions>) => {
 
 export const gruvboxDark = gruvboxDarkInit();
 
+export const defaultSettingsGruvboxLight: CreateThemeOptions['settings'] = {
+  background: '#fbf1c7',
+  foreground: '#3c3836',
+  caret: '#af3a03',
+  selection: '#ebdbb2',
+  selectionMatch: '#bdae93',
+  lineHighlight: '#ebdbb2',
+  gutterBackground: '#ebdbb2',
+  gutterForeground: '#665c54',
+  gutterBorder: 'transparent',
+};
+
 export const gruvboxLightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#fbf1c7',
-      foreground: '#3c3836',
-      caret: '#af3a03',
-      selection: '#ebdbb2',
-      selectionMatch: '#bdae93',
-      lineHighlight: '#ebdbb2',
-      gutterBackground: '#ebdbb2',
-      gutterForeground: '#665c54',
-      gutterBorder: 'transparent',
+      ...defaultSettingsGruvboxLight,
       ...settings,
     },
     styles: [
diff --git a/themes/material/src/index.ts b/themes/material/src/index.ts
index ace6f5900..6e11b9c2e 100644
--- a/themes/material/src/index.ts
+++ b/themes/material/src/index.ts
@@ -1,20 +1,26 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsMaterial: CreateThemeOptions['settings'] = {
+  background: '#2e3235',
+  foreground: '#bdbdbd',
+  caret: '#a0a4ae',
+  selection: '#d7d4f0',
+  selectionMatch: '#d7d4f0',
+  gutterBackground: '#2e3235',
+  gutterForeground: '#999',
+  gutterActiveForeground: '#4f5b66',
+  lineHighlight: '#545b61',
+};
+
+export const defaultSettingsMaterialDark = defaultSettingsMaterial;
+
 export const materialInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#2e3235',
-      foreground: '#bdbdbd',
-      caret: '#a0a4ae',
-      selection: '#d7d4f0',
-      selectionMatch: '#d7d4f0',
-      gutterBackground: '#2e3235',
-      gutterForeground: '#999',
-      gutterActiveForeground: '#4f5b66',
-      lineHighlight: '#545b61',
+      ...defaultSettingsMaterial,
       ...settings,
     },
     styles: [
@@ -120,20 +126,24 @@ export const materialDarkInit = materialInit;
 export const materialDark = materialInit();
 export const material = materialInit();
 
+export const defaultSettingsMaterialLight: CreateThemeOptions['settings'] = {
+  background: '#FAFAFA',
+  foreground: '#90A4AE',
+  caret: '#272727',
+  selection: '#80CBC440',
+  selectionMatch: '#FAFAFA',
+  gutterBackground: '#FAFAFA',
+  gutterForeground: '#90A4AE',
+  gutterBorder: 'transparent',
+  lineHighlight: '#CCD7DA50',
+};
+
 export const materialLightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#FAFAFA',
-      foreground: '#90A4AE',
-      caret: '#272727',
-      selection: '#80CBC440',
-      selectionMatch: '#FAFAFA',
-      gutterBackground: '#FAFAFA',
-      gutterForeground: '#90A4AE',
-      gutterBorder: 'transparent',
-      lineHighlight: '#CCD7DA50',
+      ...defaultSettingsMaterialLight,
       ...settings,
     },
     styles: [
diff --git a/themes/noctis-lilac/src/index.ts b/themes/noctis-lilac/src/index.ts
index 4f76b7e39..f3e11de97 100644
--- a/themes/noctis-lilac/src/index.ts
+++ b/themes/noctis-lilac/src/index.ts
@@ -1,19 +1,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsNoctisLilac: CreateThemeOptions['settings'] = {
+  background: '#f2f1f8',
+  foreground: '#0c006b',
+  caret: '#5c49e9',
+  selection: '#d5d1f2',
+  selectionMatch: '#d5d1f2',
+  gutterBackground: '#f2f1f8',
+  gutterForeground: '#0c006b70',
+  lineHighlight: '#e1def3',
+};
+
 export const noctisLilacInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#f2f1f8',
-      foreground: '#0c006b',
-      caret: '#5c49e9',
-      selection: '#d5d1f2',
-      selectionMatch: '#d5d1f2',
-      gutterBackground: '#f2f1f8',
-      gutterForeground: '#0c006b70',
-      lineHighlight: '#e1def3',
+      ...defaultSettingsNoctisLilac,
       ...settings,
     },
     styles: [
diff --git a/themes/nord/src/index.ts b/themes/nord/src/index.ts
index 64e044db6..fb14993f3 100644
--- a/themes/nord/src/index.ts
+++ b/themes/nord/src/index.ts
@@ -1,21 +1,25 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsNord: CreateThemeOptions['settings'] = {
+  background: '#2e3440',
+  foreground: '#FFFFFF',
+  caret: '#FFFFFF',
+  selection: '#3b4252',
+  selectionMatch: '#e5e9f0',
+  gutterBackground: '#2e3440',
+  gutterForeground: '#4c566a',
+  gutterActiveForeground: '#d8dee9',
+  lineHighlight: '#4c566a',
+};
+
 // Colors from https://www.nordtheme.com/docs/colors-and-palettes
 export const nordInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#2e3440',
-      foreground: '#FFFFFF',
-      caret: '#FFFFFF',
-      selection: '#3b4252',
-      selectionMatch: '#e5e9f0',
-      gutterBackground: '#2e3440',
-      gutterForeground: '#4c566a',
-      gutterActiveForeground: '#d8dee9',
-      lineHighlight: '#4c566a',
+      ...defaultSettingsNord,
       ...settings,
     },
     styles: [
diff --git a/themes/okaidia/src/index.ts b/themes/okaidia/src/index.ts
index 3f9b777fc..03d185832 100644
--- a/themes/okaidia/src/index.ts
+++ b/themes/okaidia/src/index.ts
@@ -1,19 +1,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsOkaidia: CreateThemeOptions['settings'] = {
+  background: '#272822',
+  foreground: '#FFFFFF',
+  caret: '#FFFFFF',
+  selection: '#49483E',
+  selectionMatch: '#49483E',
+  gutterBackground: '#272822',
+  gutterForeground: '#FFFFFF70',
+  lineHighlight: '#00000059',
+};
+
 export const okaidiaInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#272822',
-      foreground: '#FFFFFF',
-      caret: '#FFFFFF',
-      selection: '#49483E',
-      selectionMatch: '#49483E',
-      gutterBackground: '#272822',
-      gutterForeground: '#FFFFFF70',
-      lineHighlight: '#00000059',
+      ...defaultSettingsOkaidia,
       ...settings,
     },
     styles: [
diff --git a/themes/solarized/src/index.ts b/themes/solarized/src/index.ts
index dff1b8e76..e5d1ac8e6 100644
--- a/themes/solarized/src/index.ts
+++ b/themes/solarized/src/index.ts
@@ -1,19 +1,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsSolarizedLight: CreateThemeOptions['settings'] = {
+  background: '#fdf6e3',
+  foreground: '#657b83',
+  caret: '#586e75',
+  selection: '#dfd9c8',
+  selectionMatch: '#dfd9c8',
+  gutterBackground: '#00000010',
+  gutterForeground: '#657b83',
+  lineHighlight: '#dfd9c8',
+};
+
 export const solarizedLightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#fdf6e3',
-      foreground: '#657b83',
-      caret: '#586e75',
-      selection: '#dfd9c8',
-      selectionMatch: '#dfd9c8',
-      gutterBackground: '#00000010',
-      gutterForeground: '#657b83',
-      lineHighlight: '#dfd9c8',
+      ...defaultSettingsSolarizedLight,
       ...settings,
     },
     styles: [
@@ -115,19 +119,23 @@ export const solarizedLightInit = (options?: Partial<CreateThemeOptions>) => {
 
 export const solarizedLight = solarizedLightInit();
 
+export const defaultSettingsSolarizedDark: CreateThemeOptions['settings'] = {
+  background: '#002b36',
+  foreground: '#93a1a1',
+  caret: '#839496',
+  selection: '#173541',
+  selectionMatch: '#aafe661a',
+  gutterBackground: '#00252f',
+  gutterForeground: '#839496',
+  lineHighlight: '#173541',
+};
+
 export const solarizedDarkInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#002b36',
-      foreground: '#93a1a1',
-      caret: '#839496',
-      selection: '#173541',
-      selectionMatch: '#aafe661a',
-      gutterBackground: '#00252f',
-      gutterForeground: '#839496',
-      lineHighlight: '#173541',
+      ...defaultSettingsSolarizedDark,
       ...settings,
     },
     styles: [
diff --git a/themes/sublime/src/index.ts b/themes/sublime/src/index.ts
index 25079ad52..3f90c524c 100644
--- a/themes/sublime/src/index.ts
+++ b/themes/sublime/src/index.ts
@@ -1,19 +1,23 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsSublime: CreateThemeOptions['settings'] = {
+  background: '#303841',
+  foreground: '#FFFFFF',
+  caret: '#FBAC52',
+  selection: '#4C5964',
+  selectionMatch: '#3A546E',
+  gutterBackground: '#303841',
+  gutterForeground: '#FFFFFF70',
+  lineHighlight: '#00000059',
+};
+
 export function sublimeInit(options?: Partial<CreateThemeOptions>) {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#303841',
-      foreground: '#FFFFFF',
-      caret: '#FBAC52',
-      selection: '#4C5964',
-      selectionMatch: '#3A546E',
-      gutterBackground: '#303841',
-      gutterForeground: '#FFFFFF70',
-      lineHighlight: '#00000059',
+      ...defaultSettingsSublime,
       ...settings,
     },
     styles: [
diff --git a/themes/tokyo-night-day/src/index.ts b/themes/tokyo-night-day/src/index.ts
index 0b64dbb40..feda72346 100644
--- a/themes/tokyo-night-day/src/index.ts
+++ b/themes/tokyo-night-day/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsTokyoNightDay: CreateThemeOptions['settings'] = {
+  background: '#e1e2e7',
+  foreground: '#3760bf',
+  caret: '#3760bf',
+  selection: '#99a7df',
+  selectionMatch: '#99a7df',
+  gutterBackground: '#e1e2e7',
+  gutterForeground: '#3760bf',
+  gutterBorder: 'transparent',
+  lineHighlight: '#5f5faf11',
+};
+
 export const tokyoNightDayInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#e1e2e7',
-      foreground: '#3760bf',
-      caret: '#3760bf',
-      selection: '#99a7df',
-      selectionMatch: '#99a7df',
-      gutterBackground: '#e1e2e7',
-      gutterForeground: '#3760bf',
-      gutterBorder: 'transparent',
-      lineHighlight: '#5f5faf11',
+      ...defaultSettingsTokyoNightDay,
       ...settings,
     },
     styles: [
diff --git a/themes/tokyo-night-storm/src/index.ts b/themes/tokyo-night-storm/src/index.ts
index 6d24a4685..4565789d9 100644
--- a/themes/tokyo-night-storm/src/index.ts
+++ b/themes/tokyo-night-storm/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsTokyoNightStorm: CreateThemeOptions['settings'] = {
+  background: '#24283b',
+  foreground: '#7982a9',
+  caret: '#c0caf5',
+  selection: '#6f7bb630',
+  selectionMatch: '#1f2335',
+  gutterBackground: '#24283b',
+  gutterForeground: '#7982a9',
+  gutterBorder: 'transparent',
+  lineHighlight: '#292e42',
+};
+
 export const tokyoNightStormInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#24283b',
-      foreground: '#7982a9',
-      caret: '#c0caf5',
-      selection: '#6f7bb630',
-      selectionMatch: '#1f2335',
-      gutterBackground: '#24283b',
-      gutterForeground: '#7982a9',
-      gutterBorder: 'transparent',
-      lineHighlight: '#292e42',
+      ...defaultSettingsTokyoNightStorm,
       ...settings,
     },
     styles: [
diff --git a/themes/tokyo-night/src/index.ts b/themes/tokyo-night/src/index.ts
index dde8325b1..7417301e6 100644
--- a/themes/tokyo-night/src/index.ts
+++ b/themes/tokyo-night/src/index.ts
@@ -1,20 +1,24 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsTokyoNight: CreateThemeOptions['settings'] = {
+  background: '#1a1b26',
+  foreground: '#787c99',
+  caret: '#c0caf5',
+  selection: '#515c7e40',
+  selectionMatch: '#16161e',
+  gutterBackground: '#1a1b26',
+  gutterForeground: '#787c99',
+  gutterBorder: 'transparent',
+  lineHighlight: '#1e202e',
+};
+
 export const tokyoNightInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#1a1b26',
-      foreground: '#787c99',
-      caret: '#c0caf5',
-      selection: '#515c7e40',
-      selectionMatch: '#16161e',
-      gutterBackground: '#1a1b26',
-      gutterForeground: '#787c99',
-      gutterBorder: 'transparent',
-      lineHighlight: '#1e202e',
+      ...defaultSettingsTokyoNight,
       ...settings,
     },
     styles: [
diff --git a/themes/vscode/src/index.ts b/themes/vscode/src/index.ts
index b8b7d0cdf..6800c62b1 100644
--- a/themes/vscode/src/index.ts
+++ b/themes/vscode/src/index.ts
@@ -4,21 +4,25 @@
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsVscodeDark: CreateThemeOptions['settings'] = {
+  background: '#1e1e1e',
+  foreground: '#9cdcfe',
+  caret: '#c6c6c6',
+  selection: '#6199ff2f',
+  selectionMatch: '#72a1ff59',
+  lineHighlight: '#ffffff0f',
+  gutterBackground: '#1e1e1e',
+  gutterForeground: '#838383',
+  gutterActiveForeground: '#fff',
+  fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
+};
+
 export function vscodeDarkInit(options?: Partial<CreateThemeOptions>) {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#1e1e1e',
-      foreground: '#9cdcfe',
-      caret: '#c6c6c6',
-      selection: '#6199ff2f',
-      selectionMatch: '#72a1ff59',
-      lineHighlight: '#ffffff0f',
-      gutterBackground: '#1e1e1e',
-      gutterForeground: '#838383',
-      gutterActiveForeground: '#fff',
-      fontFamily: 'Menlo, Monaco, Consolas, "Andale Mono", "Ubuntu Mono", "Courier New", monospace',
+      ...defaultSettingsVscodeDark,
       ...settings,
     },
     styles: [
diff --git a/themes/xcode/src/index.ts b/themes/xcode/src/index.ts
index 78b0f4177..cd3c2423c 100644
--- a/themes/xcode/src/index.ts
+++ b/themes/xcode/src/index.ts
@@ -1,21 +1,25 @@
 /**
- * @name github
+ * @name Xcode
  */
 import { tags as t } from '@lezer/highlight';
 import { createTheme, CreateThemeOptions } from '@uiw/codemirror-themes';
 
+export const defaultSettingsXcodeLight: CreateThemeOptions['settings'] = {
+  background: '#fff',
+  foreground: '#3D3D3D',
+  selection: '#BBDFFF',
+  selectionMatch: '#BBDFFF',
+  gutterBackground: '#fff',
+  gutterForeground: '#AFAFAF',
+  lineHighlight: '#EDF4FF',
+};
+
 export function xcodeLightInit(options?: Partial<CreateThemeOptions>) {
   const { theme = 'light', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#fff',
-      foreground: '#3D3D3D',
-      selection: '#BBDFFF',
-      selectionMatch: '#BBDFFF',
-      gutterBackground: '#fff',
-      gutterForeground: '#AFAFAF',
-      lineHighlight: '#EDF4FF',
+      ...defaultSettingsXcodeLight,
       ...settings,
     },
     styles: [
@@ -35,17 +39,21 @@ export function xcodeLightInit(options?: Partial<CreateThemeOptions>) {
 
 export const xcodeLight = xcodeLightInit();
 
+export const defaultSettingsXcodeDark: CreateThemeOptions['settings'] = {
+  background: '#292A30',
+  foreground: '#CECFD0',
+  caret: '#fff',
+  selection: '#727377',
+  selectionMatch: '#727377',
+  lineHighlight: '#2F3239',
+};
+
 export const xcodeDarkInit = (options?: Partial<CreateThemeOptions>) => {
   const { theme = 'dark', settings = {}, styles = [] } = options || {};
   return createTheme({
     theme: theme,
     settings: {
-      background: '#292A30',
-      foreground: '#CECFD0',
-      caret: '#fff',
-      selection: '#727377',
-      selectionMatch: '#727377',
-      lineHighlight: '#2F3239',
+      ...defaultSettingsXcodeDark,
       ...settings,
     },
     styles: [
diff --git a/www/src/pages/extensions/themes/index.tsx b/www/src/pages/extensions/themes/index.tsx
index 2571c8896..090e9387a 100644
--- a/www/src/pages/extensions/themes/index.tsx
+++ b/www/src/pages/extensions/themes/index.tsx
@@ -16,6 +16,7 @@ export const ThemesAllDoc = () => {
   const themesData: Record<string, Omit<ReactCodeMirrorProps['theme'], 'dark' | 'light'>> = {};
   Object.keys(themes)
     .filter((item) => typeof themes[item as keyof typeof themes] !== 'function')
+    .filter((item) => !/^(defaultSettings)/.test(item as keyof typeof themes))
     .forEach((item) => {
       themesData[item] = themes[item as keyof typeof themes];
     });
diff --git a/www/src/pages/home/Example.tsx b/www/src/pages/home/Example.tsx
index 373b37497..0d20f961a 100644
--- a/www/src/pages/home/Example.tsx
+++ b/www/src/pages/home/Example.tsx
@@ -13,7 +13,8 @@ import { useTheme } from '../../utils/useTheme';
 
 const themeOptions = ['dark', 'light']
   .concat(Object.keys(alls))
-  .filter((item) => typeof alls[item as keyof typeof alls] !== 'function');
+  .filter((item) => typeof alls[item as keyof typeof alls] !== 'function')
+  .filter((item) => !/^(defaultSettings)/.test(item as keyof typeof alls));
 const heightOptions = ['auto', '200px', '300px', '500px'];
 let count = 0;