Preline Theme Generator

Génère des fichiers de thème CSS Preline complets clair/sombre à partir d'une teinte ou d'un hex de marque, via un script Node local intégré.

par htmlstreamofficial · htmlstreamofficial/preline

Testé · Fonctionne ★ 9.6/10

Preline Theme Generator — Génère des fichiers de thème CSS Preline complets clair/sombre à partir d'une teinte ou d'un hex de marque, via un script Node local intégré.

Ce que fait

Encapsule un générateur Node.js autonome, sans réseau, qui transforme une couleur de marque ou une teinte en un thème complet de tokens de design Preline (échelle de couleurs OKLCH, échelle de gris, tokens sémantiques de surface/bordure/graphique/carte, variantes clair et sombre). Se déclenche sur les demandes de création, aperçu, correspondance ou validation d'un thème Preline, et exclut explicitement le travail CSS générique non-Preline ou l'exécution de commandes arbitraires.

Rapport de test

Le script intégré réel a tourné sans aucune configuration ni appel réseau, produisant un fichier CSS de 682 lignes avec une échelle OKLCH complète et des tokens de graphique en mode sombre, contre une feuille de 16 propriétés écrite à la main sans rien de tout ça.

Testé le: 2026-07-10 · Claude Code 2.x (agent harness)

Installation

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

Commandes et exemples de prompts

  • /preline-theme-generatorGénère des fichiers de thème CSS Preline complets clair/sombre à partir d'une teinte ou d'un hex de marque, via un script Node local intégré.

Les skills se déclenchent sur des demandes en langage courant — aucune commande à retenir. Après installation, des prompts comme ceux-ci l'activent (en anglais) :

  • 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