Design System Francais (DSFR)
Officiella franska regeringsdesignsystem-dokument: 23 komponenter med exakta fr- klassnamn, RGAA 4.1 tillgänglighetsregler och kopiera-klistra HTML.
Fungerar med konfiguration
Vad den gör
Bundlar synkroniserad dokumentation (index/accessibilite/code/design.md + fungerande HTML-exempel) för 23 DSFR-komponenter som används på franska regeringswebbplatser, så att Claude kan svara med de exakta fr-* klassnamnen, ARIA-mönstret och RGAA 4.1 tillgänglighetskraven istället för att gissa. Triggers när användaren frågar om att implementera en DSFR-komponent, behöver RGAA-vägledning eller bygger en fransk regeringswebbplats.
Testrapport
Frågade efter tillgänglig DSFR-dragspels-markup: färdigheten hämtade den exakta officiella strukturen (section.fr-accordion > h3.fr-accordion__title > button.fr-accordion__btn[aria-expanded][aria-controls] + div.fr-collapse) direkt från sin medföljande code.md och accessibilite.md, som ett svar från minnet inte kan reproducera korrekt; haken är att README:s egna manuella git-klon-instruktioner är föråldrade och skulle installera en trasig (2 nivåer för djup, oupptäckbar) färdighetsmapp.
Testad: 2026-07-16 · Claude Code 2.x (agent harness)
Installation
git clone https://github.com/numerique-gouv/dsfr-skill.git mkdir -p ~/.claude/skills cp -r dsfr-skill/skills/dsfr-skill ~/.claude/skills/design-system-francais-dsfr
Kommandon och exempelprompter
/design-system-francais-dsfrOfficiella franska regeringsdesignsystem-dokument: 23 komponenter med exakta fr- klassnamn, RGAA 4.1 tillgänglighetsregler och kopiera-klistra HTML.
Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):
Donne-moi le HTML accessible d'un accordeon DSFR conforme RGAAComment coder un composant DSFR avec les bonnes classes fr- ?Je construis un site gouvernemental, aide-moi avec le DSFR