Daily Weekly Monthly

Daily Shaarli

All links of one day in a single page.

July 14, 2024

The 3 Types of CSS Utility Classes

Un choix d'organisation intéressant pour CSS. L'idée est de répartir vos classes dans 3 catégories distinctes : le cosmétique (apparence visuelle de vos composants), le layout (les différentes façons d'agencer vos composants) et le spacing (des classes utilitaires pour créer des espaces dans et entre vos composants).

L'approche est que ces 3 catégories soient mutuellement exclusives. Interdiction de mettre du margin ou du display dans la catégorie cosmétique par exemple.

Vous construisez ensuite votre site en piochant dans les différentes classes disponibles. Ça favorise la réutilisabilité et l'harmonie.

C'est une philosophie qu'on peut placer à mi-chemin entre le CSS vanilla et les frameworks utilitaires type Tailwind.