Tailwind CSS Academy

Name: Tailwind CSS Academy
Availability: InStock

HTMLCssFrontendDesign

Domina el framework CSS orientado a utilidades de confianza para OpenAI, Vercel y Shopify. Aprende cada utilidad, diseño responsivo, modo oscuro, animaciones y optimización en producción.

🤖 Impulsado por IA📚 30 cursos👥 100.000+ estudiantes⭐ Calificación 4,9

Comienza a aprender →Explora el plan de estudios ↓

Descripción general del curso

Tailwind CSS Mastery

Domina el framework CSS orientado a utilidades de confianza para OpenAI, Vercel y Shopify. Aprende cada utilidad, diseño responsivo, modo oscuro, animaciones y optimización en producción. Esta pista cubre 30 mini-cursos progresivos desde principiante absoluto (A1) hasta avanzado (B2), con lecciones cortas enfocadas y cuestionarios rápidos para afianzar cada concepto.

Qué Aprenderás

Comenzarás con los fundamentos y avanzarás a través de temas intermedios y avanzados, cada curso basándose en el anterior. Cada lección es práctica, con ejemplos reales y un tutor IA disponible cuando lo necesites.

Cómo Funciona

Cada curso se divide en cuatro lecciones enfocadas. Completa algunas lecciones al día y dominarás la pista completa en semanas, no en meses.

Comienza a aprender →

Herramientas

Explora las herramientas del curso

Potencia tu aprendizaje con herramientas y funciones impulsadas por IA

💬

Chat con IA

Chatea con tu tutor de IA

🧠

Súper PreguntaPRO

Obtén respuestas a nivel experto

📝

Crear LecciónPRO

Constructor de lecciones impulsado por IA

🏆

Iniciar Examen de CertificaciónPRO

Obtén tu certificado

🎯

Iniciar Desafío

Pon a prueba tus habilidades

Cómo Aprenderás

🎯

Lecciones Interactivas

Ejercicios de codificación prácticos con retroalimentación en tiempo real

🤖

Tutor de IA

Obtén ayuda instantánea de nuestro IA cuando te atasques

💻

Editor Integrado

Escribe y ejecuta código directamente en tu navegador

🏆

Certificado

Obtén un certificado al completar el curso

Plan de Estudios

30 Cursos

Todos los cursos en la ruta de aprendizaje Tailwind CSS Academy.

¿Qué es Tailwind CSS?

A14 lecciones

Descubra la filosofía utility-first de Tailwind CSS y comprenda en qué se diferencia de frameworks CSS tradicionales como Bootstrap. Aprend…

Utilidades de tipografía

A14 leccionesPRO

Domine el amplio conjunto de utilidades de tipografía de Tailwind para controlar tamaños y pesos de fuente, alturas de línea, espaciado ent…

Colores y fondos

A14 leccionesPRO

Explore la extensa paleta de colores de Tailwind y aprenda a aplicar colores de fondo, degradados e imágenes de fondo. Comprenderá cómo uti…

Espaciado: margen y relleno

A14 leccionesPRO

Aprenda a utilizar la escala de espaciado coherente de Tailwind para añadir margen y relleno a cualquier elemento. Comprenderá los atajos d…

Flexbox con Tailwind

A14 leccionesPRO

Aplique diseños CSS Flexbox mediante las utilidades flex de Tailwind sin escribir una sola línea de CSS personalizado. Creará diseños horiz…

Diseño Grid con Tailwind

A24 leccionesPRO

Aproveche CSS Grid mediante las utilidades grid de Tailwind para crear diseños bidimensionales complejos. Definirá columnas, filas y áreas…

Tamaños: ancho, alto y relación de aspecto

A24 leccionesPRO

Controle las dimensiones de los elementos mediante las utilidades de Tailwind para ancho, alto, restricciones mínimas y máximas y relación…

Bordes y sombras

A24 leccionesPRO

Dé estilo a los bordes y la profundidad de los elementos con las utilidades de bordes y sombras de Tailwind. Aprenderá a añadir esquinas re…

Variantes de hover, focus y estados

A24 leccionesPRO

Añada interactividad a su UI aplicando estilos condicionalmente en los estados hover, focus, active, disabled y otros pseud estados. Aprend…

Puntos de ruptura para diseño adaptable

A24 leccionesPRO

Cree diseños que se adapten a cualquier tamaño de pantalla mediante los puntos de ruptura responsive mobile-first de Tailwind. Aplicará dis…

Modo oscuro con Tailwind

B14 leccionesPRO

Implemente el modo oscuro en sus aplicaciones web mediante la variante dark integrada de Tailwind. Aprenderá la estrategia basada en clases…

Archivo de configuración de Tailwind

B14 leccionesPRO

Aproveche todo el potencial de Tailwind dominando el archivo tailwind.config.js. Aprenderá a ampliar el tema predeterminado, añadir valores…

Colores, fuentes y espaciado personalizados

B14 leccionesPRO

Adapte Tailwind a su marca añadiendo colores personalizados, integrando Google Fonts y definiendo una escala de espaciado personalizada. Cr…

La directiva @apply

B14 leccionesPRO

Aprenda cuándo y cómo utilizar la directiva @apply de Tailwind para extraer patrones de utilidades repetidos en clases CSS reutilizables. E…

Animaciones y transiciones

B14 leccionesPRO

Añada movimiento fluido a su UI mediante las utilidades integradas de transición y animación de Tailwind. Aprenderá a controlar la duración…

Patrones de componentes: botones, tarjetas y badges

B14 leccionesPRO

Cree elementos de UI refinados y reutilizables mediante las clases de utilidad de Tailwind. Aprenderá los patrones habituales para botones…

Patrones de componentes: barras de navegación y barras laterales

B14 leccionesPRO

Cree barras de navegación adaptables y barras laterales contraíbles mediante las utilidades de Tailwind. Aprenderá a gestionar los menús ha…

Patrones de componentes: formularios y campos de entrada

B14 leccionesPRO

Aplique estilos a elementos de formulario accesibles y atractivos mediante las utilidades de Tailwind. Aprenderá a crear campos de texto, s…

Patrones de componentes: modales y menús desplegables

B14 leccionesPRO

Cree patrones de UI superpuestos, como modales, diálogos y menús desplegables, mediante Tailwind y JavaScript mínimo. Aprenderá sobre posic…

Modo JIT y optimización para producción

B14 leccionesPRO

Comprenda el motor Just-In-Time de Tailwind y cómo genera únicamente el CSS que utiliza. Aprenderá a optimizar su bundle de producción, ana…

Tokens de diseño y tematización sistemática

B24 leccionesPRO

Establezca un sistema sólido de tokens de diseño en la configuración de Tailwind para habilitar temas coherentes para varias marcas. Asigna…

Tailwind con React y Next.js

B24 leccionesPRO

Integre Tailwind CSS en aplicaciones de React y Next.js mediante la configuración oficial. Aprenderá las prácticas recomendadas para aplica…

Integración de Headless UI

B24 leccionesPRO

Combine Tailwind CSS con Headless UI para crear componentes totalmente accesibles y sin estilos predefinidos. Aplicará sus propias clases d…

Escritura de plugins de Tailwind

B24 leccionesPRO

Amplíe la funcionalidad de Tailwind escribiendo plugins personalizados que añadan nuevas utilidades, componentes y variantes. Aprenderá a u…

Componentes accesibles con Tailwind

B24 leccionesPRO

Cree componentes de UI que cumplan los estándares de accesibilidad WCAG mediante las utilidades de Tailwind para el contraste de color, la…

Tailwind en producción: tamaño del bundle y prácticas recomendadas

B24 leccionesPRO

Adopte prácticas profesionales recomendadas para lanzar Tailwind CSS en aplicaciones de producción. Aprenderá a auditar bundles, organizar…

Creación de una landing page completa

B24 leccionesPRO

Aplique todo lo aprendido hasta ahora para crear desde cero una landing page de marketing completa y adaptable utilizando únicamente Tailwi…

Creación de una UI de dashboard

B24 leccionesPRO

Construya una interfaz completa de dashboard de administración con Tailwind CSS. Creará una barra lateral, una barra superior, tarjetas de…

Arquitectura CSS con Tailwind

B24 leccionesPRO

Explore cómo encaja Tailwind en estrategias más amplias de arquitectura CSS utilizadas en proyectos a gran escala. Aprenderá a organizar ar…

Proyecto final: sistema de diseño con Tailwind

B24 leccionesPRO

Reúna todas las habilidades de este itinerario para crear un sistema de diseño completo basado en Tailwind. Definirá tokens, creará una bib…

Preguntas frecuentes

¿Es gratuito el curso Tailwind CSS Academy?

Sí. Puedes empezar el curso Tailwind CSS Academy gratis y completar sus lecciones interactivas sin costo alguno. Una suscripción opcional a PRO desbloquea herramientas avanzadas de IA y un certificado compartible.

¿Necesito experiencia previa para aprender HTML?

No. El curso comienza con los fundamentos y avanza gradualmente hacia temas más avanzados, así que puedes empezar incluso sin experiencia previa en HTML.

¿Cómo aprenderé HTML en CoddyKit?

Aprendes haciendo. Las lecciones interactivas cortas combinan una explicación clara con un ejercicio de codificación práctico que se ejecuta en tiempo real, y un tutor de IA disponible 24/7 te da ayuda personalizada siempre que te atasques.

¿Obtengo un certificado al completar Tailwind CSS Academy?

Sí. Los aprendices PRO pueden hacer un examen y obtener un certificado compartible de finalización con un código verificable para el curso Tailwind CSS Academy.

¿Puedo aprender HTML en mi teléfono?

Sí. CoddyKit está disponible en la web y como aplicaciones nativas para iOS y Android, así que puedes aprender HTML en cualquier dispositivo y tu progreso se sincroniza entre ellos.

Comienza Tailwind CSS Academy Ahora

Únete a miles de estudiantes dominando programación con lecciones impulsadas por IA.

Empezar Gratis →Ver Todos los Cursos