dsfr-components

What problem does it solve?

This Skill automates the creation of web interfaces that adhere to the strict Design System of the French State (DSFR), saving developers time and ensuring compliance with government standards and accessibility requirements (RGAA). It eliminates the need for manual, time-consuming development and validation against complex guidelines.

Core Features & Use Cases

• DSFR Component Generation: Quickly generate HTML for official French government components like buttons, alerts, forms, and cards, ensuring visual and functional consistency.
• Full Page Templates: Create complete web pages (landing, form, dashboard, standard) with pre-built DSFR structures, accelerating project kick-off.
• Accessibility & Compliance: Ensures all generated outputs meet WCAG 2.1 AA, RGAA, and W3C standards, significantly reducing legal and accessibility risks for public services.
• Use Case: A government agency needs to rapidly deploy a new public service website. This Skill allows them to generate compliant, accessible pages and components in minutes, without requiring deep DSFR expertise or extensive manual coding.

Quick Start

Use the dsfr-components skill to generate a landing page titled "Mon Service Public" and save it to page.html.