Un "framework" CSS dont j'aime particulièrement la philosophie. Je mets des gros guillemets parce qu'il s'agit en fait plus d'une lib d'utilitaires dont il est possible de ne choisir qu'une petite partie.

Point très important : il se repose au maximum sur les standards CSS modernes (variables, layers, webcomponents, etc.) et il n'y a pas besoin de build.

Ça signifie que vous pouvez ajouter uniquement les composants qui vous intéressent avec @import et c'est tout ! Et tout est customisable dynamiquement en modifiant la valeur des variables CSS.

J'aime tout particulièrement la simplicité et pour autant l'élégance des layouts qui couvrent 95% des cas courants.

A UI library for people who love HTML, powered by modern CSS and Web Components. Vanilla CSS and JavaScript. Easily customized. No build step.

Un "framework" CSS dont j'aime particulièrement la philosophie. Je mets des gros guillemets parce qu'il s'agit en fait plus d'une lib d'utilitaires dont il est possible de ne choisir qu'une petite partie.

Point très important : il se repose au maximum sur les standards CSS modernes (variables, layers, webcomponents, etc.) et il n'y a pas besoin de build.

Ça signifie que vous pouvez ajouter uniquement les composants qui vous intéressent avec @import et c'est tout ! Et tout est customisable dynamiquement en modifiant la valeur des variables CSS.

J'aime tout particulièrement la simplicité et pour autant l'élégance des layouts qui couvrent 95% des cas courants.

A UI library for people who love HTML, powered by modern CSS and Web Components. Vanilla CSS and JavaScript. Easily customized. No build step.

Exemple d'utilisation des fonctions CSS.

Je ne sais pas trop quoi en penser, je vois les perspectives que ça ouvre mais en même temps ça va rendre le code plus complexe et plus "opinionated".

Aujourd'hui quand on ouvre un projet CSS quel qu'il soit, on comprend le code immédiatement, toutes les fonctions sont natives. Le seul aspect à intégrer est l'organisation du code et des fichiers.

Demain, il faudra en plus aller voir chaque fonction pour comprendre ce que le développeur précédent a voulu factoriser, comme on le fait dans les languages traditionnels, et ce sera évidemment complètement différent d'un projet à l'autre.

Pas infaisable, mais ça va ajouter une couche de pénibilité supplémentaire lors de l'onboarding 🤔

Exemple d'utilisation des fonctions CSS.

Je ne sais pas trop quoi en penser, je vois les perspectives que ça ouvre mais en même temps ça va rendre le code plus complexe et plus "opinionated".

Aujourd'hui quand on ouvre un projet CSS quel qu'il soit, on comprend le code immédiatement, toutes les fonctions sont natives. Le seul aspect à intégrer est l'organisation du code et des fichiers.

Demain, il faudra en plus aller voir chaque fonction pour comprendre ce que le développeur précédent a voulu factoriser, comme on le fait dans les languages traditionnels, et ce sera évidemment complètement différent d'un projet à l'autre.

Pas infaisable, mais ça va ajouter une couche de pénibilité supplémentaire lors de l'onboarding 🤔

Testez vos connaissances CSS ! 48/60 de mon côté, ce qui est bien mais pas top.

Testez vos connaissances CSS ! 48/60 de mon côté, ce qui est bien mais pas top.

Une bonne astuce pour élargir la zone cliquable d'un bouton de manière invisible et sans distordre le visuel du bouton lui-même.

button::after {
  content: "";
  position: absolute;
  inset: -5px;
}

Une bonne astuce pour élargir la zone cliquable d'un bouton de manière invisible et sans distordre le visuel du bouton lui-même.

button::after {
  content: "";
  position: absolute;
  inset: -5px;
}

Il semblerait qu'il soit maintenant possible d'utiliser Tailwind (un framework CSS) en meilleure harmonie avec le CSS natif. On peut par exemple utiliser les tokens de Tailwind dans du CSS classique, rendant inutile l'usage de @apply. Je n'aime toujours pas ces frameworks "utility-first" mais il faut admettre que ce virage est fait dans la bonne direction.

Il semblerait qu'il soit maintenant possible d'utiliser Tailwind (un framework CSS) en meilleure harmonie avec le CSS natif. On peut par exemple utiliser les tokens de Tailwind dans du CSS classique, rendant inutile l'usage de @apply. Je n'aime toujours pas ces frameworks "utility-first" mais il faut admettre que ce virage est fait dans la bonne direction.

Je trouve ce site vraiment très chouette !

Native CSS transitions have quietly killed the strongest argument for client-side routing. Yet people keep building terrible apps instead of performant websites.

Styliser le gap CSS. Encore un peu tôt pour l'utiliser, c'est uniquement supporté par Chrome pour l'instant.

Styliser le gap CSS. Encore un peu tôt pour l'utiliser, c'est uniquement supporté par Chrome pour l'instant.

Des malades : un Minecraft (ultra-basique) en pur HTML et CSS.

Rester à la page avec CSS. Des articles chaque semaine.

Rester à la page avec CSS. Des articles chaque semaine.

Article très intéressant sur l'usage des unités en CSS : px, em ou rem ?