{"id":"d91e3ac7-984e-4901-bc81-1e5e96418879","shortId":"44paWM","kind":"skill","title":"preline-theme-generator","tagline":"Generate, preview, save, or validate Preline theme CSS using the bundled local generator in this skill. Use when the user asks to create a new Preline theme, match a brand color, translate a mood into a theme, generate light and dark theme CSS, preview theme output without writin","description":"# Preline Theme Generator\n\nUse the bundled local scripts. Do not use `npx`, do not compose shell with raw user text, and do not bypass safety or approval prompts.\n\n## Read Order\n\n1. Read `docs/workflow.md`.\n2. Read `docs/palette-guidance.md`.\n3. Read `docs/final-output-style.md` before writing a final theme file.\n4. Read `docs/validation-checklist.md` before closing the task.\n5. Read `examples.md` only if the user wants stylistic guidance or sample outputs.\n6. Read `docs/token-reference.md` only if you need to inspect token coverage in detail.\n\n## Workflow\n\nFollow `docs/workflow.md` for the full operating path.\n\nKey requirements:\n\n1. Identify whether the task is preview, write, or validate.\n2. Normalize the request into explicit generator inputs.\n3. Resolve the target directory with `scripts/find-themes-dir.js`.\n4. Generate CSS only through `scripts/run-theme-generator.js`.\n5. Create or edit only the new theme file.\n6. Validate with `docs/validation-checklist.md`.\n7. Return the result in the mode-appropriate format.\n\n## Security Constraints\n\n- Never use wording that attempts to bypass tool or approval safeguards.\n- Never use `npx` or any network-fetched package for this skill.\n- Never interpolate raw user text directly into shell commands.\n- Never use broad `find .` traversal for path discovery; use `scripts/find-themes-dir.js` or a user-confirmed path.\n- Never write outside a confirmed theme directory.\n- Use `scripts/run-theme-generator.js` as the only execution entry point for generation.\n- Never create or edit additional project files as part of theme generation.\n\n## Common Prompts\n\n- \"Create a sunset theme.\"\n- \"Match this brand color: #2F6BFF.\"\n- \"Generate a cyberpunk dark theme with matching dark mode.\"\n- \"Preview the CSS before writing a file.\"\n- \"Review this generated theme and fix token coverage.\"\n\n## Key References\n\n- `docs/workflow.md`\n- `docs/palette-guidance.md`\n- `docs/final-output-style.md`\n- `docs/validation-checklist.md`\n- `examples.md`\n- `docs/token-reference.md`","tags":["theme","generator","preline","htmlstreamofficial","agent-skills","css","html","javascript","tailwindcss","tailwindcss-plugin","typescript","ui-components"],"capabilities":["skill","source-htmlstreamofficial","skill-theme-generator","topic-agent-skills","topic-css","topic-html","topic-javascript","topic-tailwindcss","topic-tailwindcss-plugin","topic-typescript","topic-ui-components"],"categories":["preline"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/htmlstreamofficial/preline/theme-generator","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add htmlstreamofficial/preline","source_repo":"https://github.com/htmlstreamofficial/preline","install_from":"skills.sh"}},"qualityScore":"0.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 6321 github stars · SKILL.md body (2,014 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-18T18:52:42.874Z","embedding":null,"createdAt":"2026-04-18T21:53:43.816Z","updatedAt":"2026-05-18T18:52:42.874Z","lastSeenAt":"2026-05-18T18:52:42.874Z","tsv":"'1':83,141 '2':86,151 '2f6bff':284 '3':89,159 '4':98,166 '5':105,172 '6':118,181 '7':185 'addit':266 'appropri':193 'approv':79,206 'ask':25 'attempt':201 'brand':34,282 'broad':231 'bundl':15,58 'bypass':76,203 'close':102 'color':35,283 'command':228 'common':274 'compos':67 'confirm':243,249 'constraint':196 'coverag':128,308 'creat':27,173,263,276 'css':12,47,168,296 'cyberpunk':287 'dark':45,288,292 'detail':130 'direct':225 'directori':163,251 'discoveri':236 'docs/final-output-style.md':91,313 'docs/palette-guidance.md':88,312 'docs/token-reference.md':120,316 'docs/validation-checklist.md':100,184,314 'docs/workflow.md':85,133,311 'edit':175,265 'entri':258 'examples.md':107,315 'execut':257 'explicit':156 'fetch':215 'file':97,180,268,300 'final':95 'find':232 'fix':306 'follow':132 'format':194 'full':136 'generat':4,5,17,42,55,157,167,261,273,285,303 'guidanc':114 'identifi':142 'input':158 'inspect':126 'interpol':221 'key':139,309 'light':43 'local':16,59 'match':32,280,291 'mode':192,293 'mode-appropri':191 'mood':38 'need':124 'network':214 'network-fetch':213 'never':197,208,220,229,245,262 'new':29,178 'normal':152 'npx':64,210 'oper':137 'order':82 'output':50,117 'outsid':247 'packag':216 'part':270 'path':138,235,244 'point':259 'prelin':2,10,30,53 'preline-theme-gener':1 'preview':6,48,147,294 'project':267 'prompt':80,275 'raw':70,222 'read':81,84,87,90,99,106,119 'refer':310 'request':154 'requir':140 'resolv':160 'result':188 'return':186 'review':301 'safeguard':207 'safeti':77 'sampl':116 'save':7 'script':60 'scripts/find-themes-dir.js':165,238 'scripts/run-theme-generator.js':171,253 'secur':195 'shell':68,227 'skill':20,219 'skill-theme-generator' 'source-htmlstreamofficial' 'stylist':113 'sunset':278 'target':162 'task':104,145 'text':72,224 'theme':3,11,31,41,46,49,54,96,179,250,272,279,289,304 'token':127,307 'tool':204 'topic-agent-skills' 'topic-css' 'topic-html' 'topic-javascript' 'topic-tailwindcss' 'topic-tailwindcss-plugin' 'topic-typescript' 'topic-ui-components' 'translat':36 'travers':233 'use':13,21,56,63,198,209,230,237,252 'user':24,71,111,223,242 'user-confirm':241 'valid':9,150,182 'want':112 'whether':143 'without':51 'word':199 'workflow':131 'write':93,148,246,298 'writin':52","prices":[{"id":"80e5a39c-65b2-4a06-94c6-95c0b162575a","listingId":"d91e3ac7-984e-4901-bc81-1e5e96418879","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"htmlstreamofficial","category":"preline","install_from":"skills.sh"},"createdAt":"2026-04-18T21:53:43.816Z"}],"sources":[{"listingId":"d91e3ac7-984e-4901-bc81-1e5e96418879","source":"github","sourceId":"htmlstreamofficial/preline/theme-generator","sourceUrl":"https://github.com/htmlstreamofficial/preline/tree/main/skills/theme-generator","isPrimary":false,"firstSeenAt":"2026-04-18T21:53:43.816Z","lastSeenAt":"2026-05-18T18:52:42.874Z"}],"details":{"listingId":"d91e3ac7-984e-4901-bc81-1e5e96418879","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"htmlstreamofficial","slug":"theme-generator","github":{"repo":"htmlstreamofficial/preline","stars":6321,"topics":["agent-skills","css","html","javascript","tailwindcss","tailwindcss-plugin","typescript","ui-components"],"license":"other","html_url":"https://github.com/htmlstreamofficial/preline","pushed_at":"2026-05-10T14:12:28Z","description":"Preline UI is an open-source set of prebuilt UI components based on the utility-first Tailwind CSS framework.","skill_md_sha":"be4145a95248f1a08b5eba3195148395a34a6b28","skill_md_path":"skills/theme-generator/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/htmlstreamofficial/preline/tree/main/skills/theme-generator"},"layout":"multi","source":"github","category":"preline","frontmatter":{"name":"preline-theme-generator","description":"Generate, preview, save, or validate Preline theme CSS using the bundled local generator in this skill. Use when the user asks to create a new Preline theme, match a brand color, translate a mood into a theme, generate light and dark theme CSS, preview theme output without writing files, or review and fix generated theme tokens. Do not use for generic non-Preline CSS work or arbitrary command execution."},"skills_sh_url":"https://skills.sh/htmlstreamofficial/preline/theme-generator"},"updatedAt":"2026-05-18T18:52:42.874Z"}}