Sumi.css : un framework CSS minimaliste sans classes, 6,7 kB
Sommaire
En bref
- Sumi.css est un framework CSS de 6,7 kB minifié et compressé, sans JavaScript ni dépendances, qui style automatiquement les éléments HTML sémantiques sans exiger de classes.
- Le projet offre un mode sombre/clair, l'accessibilité (anneaux de focus, états ARIA) et des variables CSS personnalisables pour chaque couleur, police et rayon.
- C'est un fichier unique, prêt à l'emploi, destiné aux prototypes rapides ou aux contenus éditoriaux où le HTML reste lisible sans surcharge de sélecteurs.
Ce que dit la source
L'auteur propose Sumi.css comme réponse à PicoCSS, framework minimaliste aujourd'hui dépourvu de maintenance, selon le commentaire qui cite la page officielle. L'objectif est de fournir un système de style « classless-first » : le HTML sémantique seul suffit pour produire une interface finie ; les classes ne servent que pour des ajustements ponctuels. Le projet assume la simplicité comme un atout : un seul fichier, aucune étape de compilation, poids réduit au strict nécessaire.
- Poids : 6,7 kB minifié et compressé, zéro dépendance JavaScript, une seule feuille CSS à importer ou charger via CDN
- Styling automatique des éléments sémantiques : en-têtes, listes, formulaires, tableaux, cartes, accordéons, modales et navigation reçoivent un style sans classe
- Mode sombre/clair automatique basé sur la préférence système de l'utilisateur, avec possibilité de forçage via l'attribut `data-theme`
- Toutes les valeurs (couleurs, polices, tailles, rayons) sont des variables CSS custom, zéro spécificité sur les styles élémentaires pour faciliter le surcharge utilisateur
- Accessibilité intégrée : anneaux de focus visibles, états ARIA (aria-invalid, aria-busy, aria-current) et support du mouvement réduit
- Classes optionnelles pour layout (.grid, .cols-2, etc.), typographie (.lead, .prose) et composants (.dropdown, .callout, .striped)
Dans les commentaires
Débat partagé : enthousiasme pour le remplacement de PicoCSS dépourvu de maintenance, mais tension entre le minimalisme (« limitations can be fun ») et l'utilité contemporaine face aux outils générés par IA. Objections mineures sur les choix d'accessibilité (utiliser `role="button"` sur un lien `<a>` avec destination).
- Plusieurs commentateurs citent PicoCSS comme motivation : le projet remplit un vide créé par la fin du support d'une alternative populaire
- La pertinence des frameworks CSS minimalistes est questionnée dans l'optique de l'inférence IA (« pourquoi faire cela à la main alors que l'IA le ferait ?"), mais aucun argument convaincant ne valide ou réfute cette position, le débat reste ouvert
- Un commentaire souligne l'absence de nouveaux frameworks CSS depuis longtemps, suggérant une niche plutôt qu'un regain d'intérêt
- Accessibilité débattue : objection spécifique contre l'emploi de `role="button"` sur un lien hypertexte qui a une destination réelle, ce qui crée une fausse affordance
- Plusieurs alternatives mentionnées dans les commentaires : PicoCSS (dépourvu de maintenance), Neat CSS (3 kB, approche sémantique sans objectif classless), No Class, Oat (v1 récente)
Alternatives citées : PicoCSS (dépourvu de maintenance), Neat CSS (3 kB), No Class, Oat (v1), et une liste complète sur le répertoire classless-css cité en commentaire.
Notre lecture
Sumi.css résout un problème légitime : le manque de maintenance de PicoCSS laissait une niche vide pour les développeurs cherchant une base minimale et sémantique. Le projet tient ses promesses techniques (poids, zéro dépendance, personnalisation CSS). Utile pour des contextes bien définis : prototypes rapides, contenus éditoriaux simples, petits projets où imposer un build step serait disproportionné, ou situations où le HTML doit rester éditable par des non-techniques. La critique sur l'utilité face aux outils générés par IA n'est pas sans fondement, mais elle confond deux problèmes : générer du CSS et maintenir une base cohérente et légère. À surveiller pour les équipes avec ces besoins spécifiques, mais pas une révolution.