Tailwind

Last updated Jul 20, 2023 Edit Source

• Programming
• Frontend
• Css

Es un Framework de CSS Utility-First que busca proveer clases de utilidad para que puedas escribir gran parte de tu codigo CSS directamente en el HTML.

Es un Framework bastante controversial, a pesar de ello es tan popular. Algunas de sus principales ventajas son:

• Permite la colaboracion entre multiples individuos de un mismo equipo
• Te permite crear componentes reutilizables con clases y estilos sencillos
• Provee clases sencillas para trabajar con selectores especiales como hover, click, etc.
• Provee clases sencillas para hacer tus diseños responsive muy rapidamente
• Te permite desarrollar mas rapido y construir elementos totalmente personalizados

Una forma de instalacion es utilizar PostCSS e instalarlo como plugin extra. Para ello, primero debemos instalarlo en nuestro proyecto como una dependencia de desarrollo desde npm:

1

npm install tailwindcss

Instalacion con PostCSS

Finalmente, unas directivas deben de ser agregadas para mantener una instalacion de tailwind limpia:

1
2
3

@tailwind base;
@tailwind components;
@tailwind utilities;