← ClaudeAtlas

preline-theme-generatorlisted

Generates beautiful, consistent Preline Theme CSS files. Agent interprets user request, runs build script, delivers complete CSS.
htmlstreamofficial/preline · ★ 6,333 · Web & Frontend · score 78
Install: claude install-skill htmlstreamofficial/preline
# Preline Theme Generator > **This file is for the AGENT (LLM) only — not end users.** Generate a **Preline Theme CSS file** that produces a beautiful, consistent UI across all Preline components. --- ## Docs - `docs/step-1.md` to `docs/step-7.md` (detailed workflow guidance) - `docs/palette-guidance.md` (mood, hue, neutral mapping, OKLCH rules) - `docs/validation-checklist.md` - `docs/token-reference.md` - `docs/examples.md` --- ## Agent workflow (FOLLOW THIS) When user requests a theme, the agent MUST: ### Step 1: Interpret user request Parse the natural language description and determine the config inputs. See `docs/step-1.md` and `docs/palette-guidance.md`. ### Step 2: Detect themes folder Find where existing themes are stored in the user's project: ```bash # Look for existing theme.css to find the themes folder find . -name "theme.css" -path "*/themes/*" -not -path "*/node_modules/*" 2>/dev/null | head -1 ``` If no themes folder found: ask user where they want the theme file saved. See `docs/step-2.md`. ### Step 3: Create temp config file (AUTO-RUN, NO PROMPT) Write a JSON config. This must run silently without user approval. ```bash echo '{"name":"<theme-name>","hue":<hue>,"style":"<style>","useCustomDarkGray":<true|false>,"tailwindGray":"<gray>"}' > /tmp/preline-theme-config.json ``` ### Step 4: Run the generator + cleanup (AUTO-RUN, NO PROMPT) Run generator and immediately delete temp file in a single command chain. This must run silently without user a