theme-factory

Name: theme-factory
Availability: InStock
Author: Hotovo

Create and register SCSS color themes with i18n display names.

1.4k|128|Updated Jan 7, 2025

Search Tags:#theming #theme #i18n #scss #css-variables #ui-theme #aider-desk

Ready to run

npx skills add https://github.com/hotovo/aider-desk --skill theme-factory-hotovo

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: theme-factory
Source: https://github.com/hotovo/aider-desk/tree/main/.aider-desk/skills/theme-factory
Command: npx skills add https://github.com/hotovo/aider-desk --skill theme-factory-hotovo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

AiderDesk theming requires precise SCSS color definitions and proper integration steps. This Skill provides a guided workflow to define new themes, register them across the theme system, and localize display names for international users.

Core Features & Use Cases

Define new themes by creating a complete SCSS color variable set and a corresponding theme class (e.g. .theme-<name>).
Register themes in the theme aggregator, update the THEMES registry, and add i18n display names so the UI can present and apply the new theme at runtime.
Create dark/light variants and new color schemes that adapt across UI surfaces, ensuring consistent contrast and accessible design.

Quick Start

Create a new theme by copying an existing one, update its SCSS color variables, register it in the theme aggregator and THEME list, and add i18n display names.

Frequently Asked Questions about theme-factory

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I create a new UI theme for AiderDesk using SCSS?▼

To create a new AiderDesk UI theme, you define SCSS color variables within a theme class, register it in the theme aggregator, update the THEMES registry, and add i18n display names for runtime selection.

What steps are needed to add i18n support to a custom theme?▼

Adding i18n support to a custom theme requires adding localized display name entries to the locale files, ensuring the UI can present the theme name correctly for international users at runtime.

How do I add dark and light variants to an existing SCSS theme?▼

To add dark and light variants, you copy an existing SCSS theme file, update its color variables to adapt across UI surfaces, and register the new variants to ensure consistent contrast and accessible design.

Do I need to update a theme registry every time I add new SCSS color schemes?▼

Yes, every new SCSS color scheme requires a registry update in the theme aggregator and THEMES list to ensure the theme is properly wired into the theming pipeline and selectable at runtime.

Why is my new SCSS theme not showing up as selectable in the UI?▼

A new SCSS theme will not appear if it lacks a complete aggregator entry, THEMES registry update, or i18n display names, which are all required to make the theme selectable and applied at runtime.