TH
theming
Theme system and color key management for RedSalamander. Use when adding theme colors, modifying AppTheme, working with theme.json5 files, or updating theme-related specifications.
Install
mkdir -p .claude/skills/theming && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/13401" && unzip -o skill.zip -d .claude/skills/theming && rm skill.zipInstalls to .claude/skills/theming
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Theme system and color key management for RedSalamander. Use when adding theme colors, modifying AppTheme, working with theme.json5 files, or updating theme-related specifications.180 chars✓ has a “when” trigger
About this skill
Theming System
When Modifying Theme Color Keys
Update ALL of these locations:
Specs/SettingsStore.schema.json- Validation + IntelliSenseSpecs/SettingsStoreSpec.md- Key documentationRedSalamander/AppTheme.h/AppTheme.cpp- DefaultsRedSalamander/RedSalamander.cpp(ApplyThemeOverrides) - MappingSpecs/Themes/*.theme.json5- Shipped themes- Component specs referencing the token
Theme File Format (JSON5)
Location: Specs/Themes/ or Themes/ next to exe
{
"name": "Dark Theme",
"colors": {
"background": "#1E1E1E",
"foreground": "#D4D4D4",
"accent": "#007ACC",
"selection": "#264F78",
"border": "#3C3C3C"
}
}
AppTheme Integration
// AppTheme.h
struct ThemeColors {
D2D1_COLOR_F background;
D2D1_COLOR_F foreground;
D2D1_COLOR_F accent;
};
// Load and apply
void ApplyThemeOverrides(ThemeColors& colors, const json& theme)
{
if (theme.contains("colors")) {
auto& c = theme["colors"];
if (c.contains("background")) {
colors.background = ParseColor(c["background"]);
}
// Always provide fallbacks for missing keys
}
}
Best Practices
- Use semantic color names (
selectionnotblue1) - Always provide fallback colors
- Test in both light and dark modes
- Validate contrast ratios for accessibility