obsidian-theme-designerlisted
Install: claude install-skill aiskillstore/marketplace
# Obsidian Theme Designer
Help users iteratively design Obsidian themes through visual browser previews, then generate an importable CSS snippet.
**Language:** Respond in the same language the user writes in. If they write in Chinese, reply in Chinese. If English, reply in English.
## Process Flow
```dot
digraph theme_design {
"1. Analyze Vault" [shape=box];
"2. Extract Theme Variables" [shape=box];
"3. Launch Visual Companion" [shape=box];
"4. Gather Preferences" [shape=box];
"5. Iterative Design Refinement" [shape=diamond];
"5b. Install Fonts" [shape=box];
"6. Generate CSS Snippet" [shape=box];
"7. Import Guide" [shape=doublecircle];
"1. Analyze Vault" -> "2. Extract Theme Variables";
"2. Extract Theme Variables" -> "3. Launch Visual Companion";
"3. Launch Visual Companion" -> "4. Gather Preferences";
"4. Gather Preferences" -> "5. Iterative Design Refinement";
"5. Iterative Design Refinement" -> "5. Iterative Design Refinement" [label="user requests changes"];
"5. Iterative Design Refinement" -> "5b. Install Fonts" [label="user approves"];
"5b. Install Fonts" -> "6. Generate CSS Snippet";
"6. Generate CSS Snippet" -> "7. Import Guide";
}
```
## Step 1: Analyze Vault
Read the following files to understand current configuration:
- `.obsidian/appearance.json` — current theme, font size, light/dark mode
- `.obsidian/community-plugins.json` — installed plugins (check for Style Settings)
- `.obsidian/themes/` — downloaded community themes