Themes Plugin

The Themes plugin provides pre-defined visual themes and a comprehensive custom theme builder. It controls background imagery, accent lines, icons, and preview assets, and can disable conflicting plugins (e.g., Background) when active.

Quick Start

1. Go to Settings → Themes. Themes has its own settings section and is hidden from the Plugins list.
2. Choose Pre-defined to activate an existing theme, or Custom to open the theme builder.
3. Use the live preview to review your changes before saving a custom theme.

Pre-defined Themes

The Pre-defined section includes official themes and your custom exported themes:

Official Themes

• Nightshift: A teal-accented cyberpunk theme with elegant UI elements
• Bloodmoon: A dark theme with black-red gradients and crimson accents
• Tea: A cozy beige theme created for the YouTuber and Twitch streamer Snipztea
• Arcane: A sleek dark theme with elegant pink-red glow effects inspired by the Arcane aesthetic
• Deadlock API: A theme inspired by the community API

Arcane Theme - Accent Color Customization

The Arcane theme features a unique accent color customization option. You can change the glow and accent colors to match your preference:

Predefined Colors:

• Purple, Pink/Red (default), Orange, Yellow, Green, Teal, Blue

Custom Colors:

• Click the "+" button to open the color picker
• Use the color picker to select any custom color
• Custom colors are saved and appear alongside predefined colors

The accent color affects:

• Background glow effects
• Primary and accent UI elements
• Button highlights and interactive elements

Using Pre-defined Themes

1. Select the Pre-defined tab
2. Choose a theme from the grid
3. Turn on the theme card's switch to apply it
4. Turn the switch off to return to default

Custom Exported Themes

Custom themes you've exported appear in the Pre-defined section with additional options:

• Edit: Modify the theme settings
• Delete: Remove the custom theme (only for user-created themes)
• Activation switch: Apply or turn off the theme, as with official themes

Official themes cannot be deleted.

Custom Theme Builder

Switch to the Custom tab, adjust the controls, and check the result in the live app preview.

Palette and appearance controls

• Accent color and Line color control highlights and borders.
• Card surface, Base surface, Secondary surface, and Muted surface control the background palette.
• Primary text and Secondary text control foreground colors.
• Sidebar transparency adjusts the sidebar surface.
• Ambient background, Ambient accent, Strength, and Spread control the ambient glow.
• Corner radius adjusts rounding.

Use Apply draft to apply the previewed custom theme or Clear to reset the draft. For a separate background image, see the Background plugin.

Export to Pre-defined

Export your custom theme to make it permanent:

1. Configure your theme settings
2. Click "Export to Pre-defined"
3. Fill in the export dialog:
   • Name: Theme name
   • Description: Theme description
   • Sub Description: Additional details
   • Preview Image: Captured from the live preview
4. Click "Save" to add to Pre-defined themes

Theme Management

Editing Custom Themes

• Custom themes in Pre-defined section can be edited
• Click "Edit" to modify settings
• Preview your changes before applying or exporting the draft

Deleting Themes

• Only user-created themes can be deleted
• Deleted themes cannot be recovered

Tips and troubleshooting

Check text contrast against each surface in the live preview, including muted text and active buttons. Use a descriptive name when exporting so you can identify the theme later.

If a theme does not apply, check its activation switch under Settings → Themes and whether the Background plugin conflicts with it. If export fails, fill in the required metadata shown in the dialog and try again.

Learn More

• Themes developer documentation