Stats
Actions
Tags
From gencat
Aplica el Sistema de Disseny oficial de la Generalitat de Catalunya quan desenvolupes aplicacions web, components o interfícies d'usuari per a serveis digitals de la Generalitat. Utilitza aquesta skill quan es mencioni Gencat, Generalitat de Catalunya, aplicació gencat, sistema de disseny, o quan es demani construir, estilitzar o revisar qualsevol interfície digital del govern català. Garanteix l'alineació amb la marca oficial, l'accessibilitat i els estàndards de components.
How this skill is triggered — by the user, by Claude, or both
Slash command
/gencat:gencat-design-systemThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Quan desenvolupis aplicacions per a la Generalitat de Catalunya, **sempre** has de seguir el Sistema de Disseny oficial. Documenta't en:
Quan desenvolupis aplicacions per a la Generalitat de Catalunya, sempre has de seguir el Sistema de Disseny oficial. Documenta't en:
Llegeix references/foundations.md per a:
Llegeix references/components.md per a la llista completa de components disponibles amb els seus noms oficials en català.
Per a casos d'ús habituals (formularis, àrea privada, cercadors, gestió interna), consulta references/patterns.md.
Usa sempre els noms en català dels components tal com apareixen al sistema de disseny:
BotonsCamp d'entradaModalsFils d'AriadnaNotificació emergentCasella de seleccióBotó d'opcióCommutadorPestanyes / Barra de pestanyesAcordióInsígniaXipsDesplegableEsqueletEstat buitPas a pasDescripció emergentDescripció emergentPanell emergentBarra de progrésIndicador de càrrega@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
:root {
font-family: 'Open Sans', sans-serif;
font-size: 16px; /* base rem */
}
:root {
/* Brand */
--color-brand-primary: #C00000; /* Vermell Gencat - acció, links */
/* Text */
--color-text-primary: #333333;
--color-text-secondary: #5C5C5C;
/* Background */
--color-bg-default: rgb(250, 250, 250);
--color-bg-white: #FFFFFF;
}
<img> han de tenir alt<label> associataria-label / aria-describedby quan calguireferences/components.md)Si necessites un component que no està al catàleg:
foundations (colors, tipografia, espaiat, arrodoniment)npx claudepluginhub xxxaau/gencat-skills --plugin gencatProvides UI/UX resources: 50+ styles, color palettes, font pairings, guidelines, charts for web/mobile across React, Next.js, Vue, Svelte, Tailwind, React Native, Flutter. Aids planning, building, reviewing interfaces.
Fetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.