Missions actives
En cours
12 +2 ce mois
DESIGN SYSTEM / SYMFONY & TWIG v2.0.0
L'interface de vos outils métier, sans compromis.
Des composants Twig soignés, une fondation CSS légère et des interactions Stimulus. Pour construire des applications Symfony que l'on aime utiliser.
74 recettes
100 % Twig
Sans framework CSS
Licence MIT
EN SITUATION
Un langage visuel, des écrans complets.
Une application métier construite avec les composants du kit. Explorez les trois vues directement.
Atelier / Espace de travail
Démonstration
GF
ESPACE / APERÇU
Vue d'ensemble
Une interface métier native, construite avec Twig et Stimulus.
Chiffre d'affaires
Octobre 2026
28 450 € +12,8 %
À valider
Actions en attente
04 2 prioritaires
Activité
Évolution des six derniers mois
MaiJuinJuil.AoûtSept.Oct.
Activité récente
Dernières modifications
Audit validéProjet Atlas · il y a 2 h
Facture envoyéeMission Horizon · hier
Mission crééeDesign system · lundi
Suivi des missions
Liste de travail avec statuts
| Mission | Client | Statut | Budget |
|---|---|---|---|
| Audit de conformitéREF-0241 | Atlas | Validée | 4 500 € |
| Portail clientREF-0240 | Horizon | En cours | 8 250 € |
| Architecture UIREF-0239 | Maison Nord | À planifier | 3 200 € |
| Migration applicativeREF-0238 | Atelier | Validée | 12 500 € |
Nouvelle mission
Exemple de formulaire Symfony avec contrôles natifs
Données fictives · Composition démonstrative de recettes Guilloche
LES ESSENTIELS
Les fondations du quotidien.
Composants indépendants, accessibles et pensés pour les usages métier.
BIBLIOTHÈQUE
Tous les composants.
Un catalogue consultable par famille. Chaque recette a sa documentation, ses props et son code Twig.
Fondations1 recettes
Theme
Fondation du kit : tokens, reset et typographie
Primitives15 recettes
Alert
Message d'etat, avec titre et texte optionnels
AspectRatio
Conteneur qui conserve un rapport largeur/hauteur
Avatar
Image ou initiales pour représenter une personne ou une organisation
Badge
Étiquette courte pour un état, un compteur ou une catégorie
Button
Composant bouton Twig natif Symfony, installé depuis le kit Guilloche
ButtonGroup
Boutons contigus, avec des coins arrondis aux extremites seulement
Card
Surface de contenu avec en-tete et pied optionnels
EmptyState
Etat vide, avec une action de sortie dans le slot
Icon
Jeu d'icônes au trait, décoratif par défaut
Kbd
Touche ou raccourci clavier
Marker
Passage surligne dans un texte
Progress
Barre d'avancement bornee
Separator
Trait de separation horizontal ou vertical, avec libellé optionnel
Skeleton
Forme du contenu attendu pendant un chargement
Spinner
Indicateur de chargement autonome
Signature2 recettes
Formulaires13 recettes
Calendar
Grille de jours
Checkbox
Case a cocher native, habillee sans perdre la sémantique
DatePicker
Sélection de date, avec le calendrier natif du navigateur
Field
Enveloppe de champ : label, aide, erreur
FloatingLabel
Champ avec libellé flottant, sans JavaScript
Input
Champ de saisie natif
InputGroup
Champ avec prefixe ou suffixe, sans perdre l'input natif
InputOtp
Code a usage unique, une case par caractere
RadioGroup
Choix unique parmi plusieurs options
Select
Liste deroulante native
Slider
Valeur sur un intervalle, avec `input type="range"` natif
Switch
Interrupteur binaire, pour un reglage qui s'applique immediatement
Textarea
Zone de saisie multiligne
Navigation et surfaces21 recettes
Accordion
Section repliable
Breadcrumb
Fil d'Ariane
Collapsible
Section repliable neutre, sans bordure ni titre de section
ContextMenu
Menu au clic droit
Dialog
Boite modale native (`<dialog>`)
Direction
Conteneur avec sens d'ecriture explicite
DropdownMenu
Menu d'actions ou de liens
HoverCard
Carte d'aperçu au survol et au focus
Menubar
Barre de menus horizontale, avec sous-menus natifs
Navbar
Barre de navigation avec marque, liens et bascule mobile
NavigationMenu
Navigation avec sous-menus, a base de `details` et `summary`
Pagination
Navigation entre pages
Popover
Panneau flottant ancre
Resizable
Panneau redimensionnable avec une poignee
ScrollArea
Zone defilante bornee, pour les listes longues dans une carte
Scrollspy
Sommaire qui suit la section visible
Sheet
Panneau lateral modal, ancre a droite ou a gauche
Tabs
Onglets de navigation
Toggle
Bouton a deux états, rendu avec `aria-pressed`
ToggleGroup
Groupe de bascules dans un rail commun
Tooltip
Aide courte, au survol et au focus clavier
Données7 recettes
Patterns d'écran7 recettes
ConfirmDialog
Confirmation d'une action, dans un dialogue natif
DataRegion
Region de resultats avec états explicites : `idle`, `loading`, `error`, `empty`
DetailLayout
Liste et detail cote a cote sur grand écran, empiles sur mobile
FilterBar
Barre de filtres sous forme de formulaire GET : elle fonctionne sans JavaScript et l'URL porte l'etat
FormSection
Section de formulaire avec titre et description
PageHeader
En-tete de page avec titre, description et actions
Sidebar
Navigation laterale, sans JavaScript
Composants avancés5 recettes
Carousel
Galerie defilante, avec `scroll-snap` natif
Chart
Graphique SVG simple, rendu par le serveur, sans JavaScript
Combobox
Champ avec recherche dans une liste
Command
Palette de commandes dans un dialogue natif
FileUpload
Depot de fichier, avec l'input natif comme source