Interface: ThemeRegistration

Defined in: types/theme.ts:31

Registration for a plugin-provided theme.

Themes are declared as a set of CSS custom properties that override the default theme variables. The core applies these when the user selects the theme.

Example

context.registerTheme({
  id: 'my-dark-theme',
  label: 'My Dark Theme',
  isDark: true,
  color: '#1a1a2e',
  cssProperties: {
    '--background': '240 10% 3.9%',
    '--foreground': '0 0% 98%',
    '--primary': '240 5.9% 10%',
  },
});

Properties

color

color: string

Defined in: types/theme.ts:42

Preview color shown in the theme picker (hex color)

---

cssProperties

cssProperties: Record<string, string>

Defined in: types/theme.ts:52

CSS custom properties to set when this theme is active. Keys are CSS variable names (e.g., '--background'), values are the CSS values to set (e.g., '240 10% 3.9%' for HSL).

---

icon?

optional icon: PluginComponentType

Defined in: types/theme.ts:45

Optional icon component for the theme picker

---

id

id: string

Defined in: types/theme.ts:33

Unique theme identifier (must not conflict with built-in themes)

---

isDark

isDark: boolean

Defined in: types/theme.ts:39

Whether this is a dark theme (affects system UI elements)

---

label

label: string

Defined in: types/theme.ts:36

Human-readable theme name shown in the appearance settings