Tailwind CSS es un framework de utilidades que permite construir interfaces directamente en el HTML mediante clases pequeñas y combinables, en lugar de escribir hojas de estilo separadas para cada componente.
Cómo funciona el enfoque utility first
En vez de crear una clase como tarjeta y definir su relleno, color de fondo y bordes en un archivo CSS aparte, Tailwind ofrece clases de utilidad para relleno, fondo blanco o bordes redondeados que se combinan directamente sobre el elemento HTML.
Ventajas frente al CSS tradicional
- Se reduce la cantidad de nombres de clases que hay que inventar y mantener.
- Los estilos quedan visibles junto al marcado, sin saltar entre archivos.
- El sistema de diseño, colores y espaciados queda definido desde el principio.
Cuándo tiene sentido usarlo
Tailwind funciona muy bien en proyectos donde el diseño cambia con frecuencia o donde varios desarrolladores trabajan sobre la misma interfaz. Combinado con Angular o React, permite iterar sobre el diseño visual sin tocar archivos de estilos.
Tailwind se lleva especialmente bien con estos dos, por si te pillan de nuevas: qué es Angular y por qué usarlo, qué aporta TypeScript frente a JavaScript y cómo crear apps móviles con Ionic y Capacitor.
