Preline Theme Generator

Genereert volledige licht/donker Preline-CSS-themabestanden vanuit een tint of merkkleur, via een meegeleverd lokaal Node-script.

Door htmlstreamofficial · htmlstreamofficial/preline

Getest · Werkt ★ 9.6/10

Preline Theme Generator — Genereert volledige licht/donker Preline-CSS-themabestanden vanuit een tint of merkkleur, via een meegeleverd lokaal Node-script.

Wat het doet

Verpakt een selfcontained, netwerkvrije Node.js-generator die een merkkleur of tint omzet in een compleet Preline design-tokenthema (OKLCH-kleurenschaal, grijsschaal, semantische surface-/border-/chart-/map-tokens, licht- en donkervarianten). Gaat aan bij verzoeken om een Preline-thema te maken, te previewen, te matchen of te valideren, en sluit generiek niet-Preline-CSS-werk of willekeurige command execution expliciet uit.

Testrapport

Draaide het echte meegeleverde script zonder setup en zonder netwerkverkeer, en leverde een CSS-bestand van 682 regels met een volledige OKLCH-schaal en dark-mode-charttokens, tegenover een handgeschreven sheet van 16 properties zonder die tokens.

Getest op: 2026-07-10 · Claude Code 2.x (agent harness)

Installatie

git clone https://github.com/htmlstreamofficial/preline
cd preline
mkdir -p ~/.claude/skills
cp -r skills/theme-generator ~/.claude/skills/preline-theme-generator

Commando's en voorbeeldprompts

/preline-theme-generatorGenereert volledige licht/donker Preline-CSS-themabestanden vanuit een tint of merkkleur, via een meegeleverd lokaal Node-script.

Skills reageren op gewone verzoeken — geen commando's om te onthouden. Na installatie activeren prompts zoals deze de skill (in het Engels):

Generate a light and dark Preline theme from this brand hex color
Create an OKLCH color scale Preline theme matching our hue
Preview and validate this Preline design-token theme

Volledig rapport (Engels) →