Baseline UI: de-slop interface polish rules - **name_fr:** UI de base : règles de polissage anti-verbiage visuel - **tl_en:** Apply an opinionated UI baseline to any interface work — or audit an existing file against it — to kill AI-generated UI slop - **tl_fr:** Appliquer un socle UI tranché à tout travail d'interface — ou auditer un fichier existant contre lui — pour éliminer le verbiage visuel généré par IA - **creator:** @ibelick - **type:** Agent skill - **url:** https://github.com/ibelick/ui-skills - **cat:** Frontend - **kws:** ui, design system, tailwind, anti-slop, frontend, accessibility, animation, typography - **license:** MIT **Description EN:** Curated by Skill Harbor — @ibelick's baseline UI skill (Ibelick is known for polished interface taste): an opinionated constraint set that prevents AI-generated interface slop. Two modes — apply the constraints to any UI work in the conversation (`/baseline-ui`), or audit a file against all constraints and get back violations (quoted line), why it matters, and a concrete code-level fix. The rules are specific: Tailwind CSS defaults, motion/react for JS animation, accessible primitives (Base UI, React Aria, Radix — never rebuilt by hand, never mixed within one surface), AlertDialog for destructive actions, errors next to the action, animate only compositor props and never beyond 200ms for feedback, text-balance/text-pretty typography, fixed z-index scale, no gradients, no purple/multicolor gradients, no glow effects, one accent color per view. Honest caveat: opinionated on purpose — it will fight you if your design system genuinely needs gradients, heavy animation or custom easing; treat it as a cleanup pass, not a design identity. Skill Harbor never reviews the code, review it yourself before use. Discovered via skills.sh. **Description FR:** Sélectionné par Skill Harbor — le skill de socle UI de @ibelick (réputé pour son goût des interfaces soignées) : un ensemble de contraintes tranchées qui empêche le verbiage visuel généré par IA. Deux modes — appliquer les contraintes à tout travail UI de la conversation (`/baseline-ui`), ou auditer un fichier contre toutes les contraintes et recevoir les violations (ligne citée), pourquoi c'est important, et une correction concrète au niveau du code. Les règles sont précises : défauts de Tailwind CSS, motion/react pour l'animation JS, primitives accessibles (Base UI, React Aria, Radix — jamais reconstruites à la main, jamais mélangées dans une même surface), AlertDialog pour les actions destructrices, erreurs à côté de l'action, animer uniquement les propriétés compositeur et jamais au-delà de 200 ms pour le feedback, typographie text-balance/text-pretty, échelle de z-index fixe, pas de dégradés, pas de dégradés violets/multicolores, pas de lueurs, une seule couleur d'accent par vue. Bémol honnête : tranché par choix — il vous contredira si votre design system a vraiment besoin de dégradés, d'animations lourdes ou d'easings personnalisés ; traitez-le comme une passe de nettoyage, pas comme une identité de design. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh. **Install prompt EN:** ``` Prerequisites: a frontend project using Tailwind CSS (the constraints assume this stack) Install "Baseline UI: de-slop interface polish rules" for me. An opinionated UI constraint set to prevent AI-generated interface slop: apply to any UI work (/baseline-ui) or audit a file against all constraints (violations, why it matters, concrete fixes). Covers stack, accessible components, interaction, animation, typography, layout, performance and design rules. Repository: https://github.com/ibelick/ui-skills/blob/main/skills/baseline-ui/SKILL.md 1. Fetch the SKILL.md file (and any helper files) from the repository path into a temporary folder and summarize what it does in one or two sentences. 2. Safety check: review the SKILL.md and scripts for anything suspicious (unexpected network calls, shell commands, credential harvesting). This repo should contain zero secrets in code, credentials only via the secure vault, allowed hosts declared in the SKILL.md. Verify that holds here; STOP on any red flag and tell me. 3. Install it as a skill: copy SKILL.md and its helper files into the agent's skills directory, in a folder named "baseline-ui". 4. Verify with no network calls: frontmatter valid, files in place. 5. Report what was installed, where, and what I still need to do myself (e.g. nothing — it works as a prompt, no deps required). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me. ``` **Install prompt FR:** ``` Prérequis : un projet frontend utilisant Tailwind CSS (les contraintes supposent cette stack) Installe-moi « UI de base : règles de polissage anti-verbiage visuel ». Un ensemble de contraintes UI tranchées pour empêcher le verbiage visuel généré par IA : à appliquer à tout travail UI (/baseline-ui) ou pour auditer un fichier contre toutes les contraintes (violations, pourquoi c'est important, corrections concrètes). Couvre stack, composants accessibles, interaction, animation, typographie, mise en page, performance et règles de design. Dépôt : https://github.com/ibelick/ui-skills/blob/main/skills/baseline-ui/SKILL.md 1. Récupère le fichier SKILL.md (et les fichiers auxiliaires éventuels) depuis le dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Contrôle de sécurité : examine le SKILL.md et les scripts pour tout contenu suspect (appels réseau inattendus, commandes shell, récolte d'identifiants). Ce dépôt ne doit contenir aucun secret dans le code, les identifiants passent uniquement par le coffre sécurisé, les hôtes autorisés sont déclarés dans le SKILL.md. Vérifie que c'est bien le cas ici ; ARRÊTE-TOI sur le moindre signal d'alerte et préviens-moi. 3. Installe-le comme skill : copie le SKILL.md et ses fichiers auxiliaires dans le répertoire des skills de l'agent, dans un dossier nommé « baseline-ui ». 4. Vérifie sans appels réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. rien — ça fonctionne comme un prompt, aucune dépendance requise). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne l'exige jamais sauf si c'est dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi. ``` --- ---

Appliquer un socle UI tranché à tout travail d'interface — ou auditer un fichier existant contre lui — pour éliminer le verbiage visuel généré par IA - **creator:** @ibelick - **type:** Agent skill - **url:** https://github.com/ibelick/ui-skills - **cat:** Frontend - **kws:** ui, design system, tailwind, anti-slop, frontend, accessibility, animation, typography - **license:** MIT **Description EN:** Curated by Skill Harbor — @ibelick's baseline UI skill (Ibelick is known for polished interface taste): an opinionated constraint set that prevents AI-generated interface slop. Two modes — apply the constraints to any UI work in the conversation (`/baseline-ui`), or audit a file against all constraints and get back violations (quoted line), why it matters, and a concrete code-level fix. The rules are specific: Tailwind CSS defaults, motion/react for JS animation, accessible primitives (Base UI, React Aria, Radix — never rebuilt by hand, never mixed within one surface), AlertDialog for destructive actions, errors next to the action, animate only compositor props and never beyond 200ms for feedback, text-balance/text-pretty typography, fixed z-index scale, no gradients, no purple/multicolor gradients, no glow effects, one accent color per view. Honest caveat: opinionated on purpose — it will fight you if your design system genuinely needs gradients, heavy animation or custom easing; treat it as a cleanup pass, not a design identity. Skill Harbor never reviews the code, review it yourself before use. Discovered via skills.sh. **Description FR:** Sélectionné par Skill Harbor — le skill de socle UI de @ibelick (réputé pour son goût des interfaces soignées) : un ensemble de contraintes tranchées qui empêche le verbiage visuel généré par IA. Deux modes — appliquer les contraintes à tout travail UI de la conversation (`/baseline-ui`), ou auditer un fichier contre toutes les contraintes et recevoir les violations (ligne citée), pourquoi c'est important, et une correction concrète au niveau du code. Les règles sont précises : défauts de Tailwind CSS, motion/react pour l'animation JS, primitives accessibles (Base UI, React Aria, Radix — jamais reconstruites à la main, jamais mélangées dans une même surface), AlertDialog pour les actions destructrices, erreurs à côté de l'action, animer uniquement les propriétés compositeur et jamais au-delà de 200 ms pour le feedback, typographie text-balance/text-pretty, échelle de z-index fixe, pas de dégradés, pas de dégradés violets/multicolores, pas de lueurs, une seule couleur d'accent par vue. Bémol honnête : tranché par choix — il vous contredira si votre design system a vraiment besoin de dégradés, d'animations lourdes ou d'easings personnalisés ; traitez-le comme une passe de nettoyage, pas comme une identité de design. Skill Harbor ne vérifie jamais le code, examinez-le vous-même avant usage. Découvert via skills.sh. **Install prompt EN:** ``` Prerequisites: a frontend project using Tailwind CSS (the constraints assume this stack) Install "Baseline UI: de-slop interface polish rules" for me. An opinionated UI constraint set to prevent AI-generated interface slop: apply to any UI work (/baseline-ui) or audit a file against all constraints (violations, why it matters, concrete fixes). Covers stack, accessible components, interaction, animation, typography, layout, performance and design rules. Repository: https://github.com/ibelick/ui-skills/blob/main/skills/baseline-ui/SKILL.md 1. Fetch the SKILL.md file (and any helper files) from the repository path into a temporary folder and summarize what it does in one or two sentences. 2. Safety check: review the SKILL.md and scripts for anything suspicious (unexpected network calls, shell commands, credential harvesting). This repo should contain zero secrets in code, credentials only via the secure vault, allowed hosts declared in the SKILL.md. Verify that holds here; STOP on any red flag and tell me. 3. Install it as a skill: copy SKILL.md and its helper files into the agent's skills directory, in a folder named "baseline-ui". 4. Verify with no network calls: frontmatter valid, files in place. 5. Report what was installed, where, and what I still need to do myself (e.g. nothing — it works as a prompt, no deps required). GitHub is optional: if I have a GitHub account or the gh CLI, you may use it; otherwise public access is fine. Never require it unless it's in the prerequisites above. Rules: don't touch anything outside the temp folder and the install target. If anything looks off, stop and ask me. ``` **Install prompt FR:** ``` Prérequis : un projet frontend utilisant Tailwind CSS (les contraintes supposent cette stack) Installe-moi « UI de base : règles de polissage anti-verbiage visuel ». Un ensemble de contraintes UI tranchées pour empêcher le verbiage visuel généré par IA : à appliquer à tout travail UI (/baseline-ui) ou pour auditer un fichier contre toutes les contraintes (violations, pourquoi c'est important, corrections concrètes). Couvre stack, composants accessibles, interaction, animation, typographie, mise en page, performance et règles de design. Dépôt : https://github.com/ibelick/ui-skills/blob/main/skills/baseline-ui/SKILL.md 1. Récupère le fichier SKILL.md (et les fichiers auxiliaires éventuels) depuis le dépôt dans un dossier temporaire et résume en une ou deux phrases ce qu'il fait. 2. Contrôle de sécurité : examine le SKILL.md et les scripts pour tout contenu suspect (appels réseau inattendus, commandes shell, récolte d'identifiants). Ce dépôt ne doit contenir aucun secret dans le code, les identifiants passent uniquement par le coffre sécurisé, les hôtes autorisés sont déclarés dans le SKILL.md. Vérifie que c'est bien le cas ici ; ARRÊTE-TOI sur le moindre signal d'alerte et préviens-moi. 3. Installe-le comme skill : copie le SKILL.md et ses fichiers auxiliaires dans le répertoire des skills de l'agent, dans un dossier nommé « baseline-ui ». 4. Vérifie sans appels réseau : frontmatter valide, fichiers en place. 5. Indique ce qui a été installé, où, et ce qu'il me reste à faire moi-même (p. ex. rien — ça fonctionne comme un prompt, aucune dépendance requise). GitHub est optionnel : si j'ai un compte GitHub ou la CLI gh, tu peux l'utiliser ; sinon l'accès public suffit. Ne l'exige jamais sauf si c'est dans les prérequis ci-dessus. Règles : ne touche à rien en dehors du dossier temporaire et de la cible d'installation. Si quelque chose semble anormal, arrête-toi et demande-moi. ``` --- ---

Version :