Codea con Horacio
Compartir
Bienvenido a Codea con Horacio 🚀
Este es un canal de desarrollo de software enfocado en píldoras de conocimiento rápidas, visuales y de alto impacto.
Aquí aprenderás desde maquetación web interactiva (HTML, CSS, JS) hasta lógica compleja de backend
➡️ Desafío de HTML, CSS y JavaScript – Ventilador Interactivo
💨 ¿Te imaginas crear un ventilador totalmente interactivo usando solo HTML, CSS y JavaScript?
En este proyecto encontrarás:
✅ Animación fluida
✅ Control de velocidad
✅ Inercia al apagar
✅ SVG + CSS + JavaScript
✅ Sin librerías externas
🚀 Este es solo un adelanto.
¿Te gustaría aprender a desarrollarlo? ¡Déjalo en los comentarios!
24/07/2026
¿Estás aprendiendo CSS? Guarda esta guía para consultarla cuando quieras.
¿Estás empezando con CSS? 💻
Guarda esta imagen y úsala como referencia mientras practicas.
Aquí encontrarás:
✅ ¿Qué es CSS?
✅ Tipos de CSS
✅ Sintaxis
✅ Colores
✅ Background
✅ Texto
✅ Box Model
✅ Flexbox
✅ Selectores
✅ Unidades
La mejor forma de aprender programación es practicar todos los días.
📌 Guarda esta publicación para verla cuando la necesites.
🚀 Sígueme para más contenido sobre HTML, CSS, JavaScript y desarrollo web.
Codea con Horacio
Aprende HTML Rápido: 50+ Etiquetas Esenciales 💻
¡Aprende o repasa las 50+ etiquetas esenciales de HTML en menos de un minuto! 🚀
En este video cubrimos las etiquetas más utilizadas divididas por categorías:
• Metadata
• Formato de Texto
• Enlaces y Multimedia
• Listas y Contenedores
• Formularios y Tablas
• HTML Semántico
📌 Guarda este video para cuando estés programando y necesites una referencia rápida.
🔔 Sígueme en para aprender CSS, HTML y JavaScript paso a paso.
CSS Transform explicado de forma VISUAL en menos de 60s 🚀
¿Todavía te confundes con las propiedades de CSS Transform? 🎨⚡ En este clip te enseño de forma 100% visual cómo funcionan los 5 efectos principales en estado :hover:
↔️ TRANSLATE → Desplaza el elemento en los ejes X e Y
🔍 SCALE → Aumenta o reduce el tamaño
🔄 ROTATE → Gira el elemento los grados que definas
📐 SKEW → Inclina o distorsiona los ejes
🔥 COMBO → Combinación de múltiples transformaciones
💾 GUARDA este video para consultarlo cuando estés diseñando tus tarjetas e interfaces.
🔔 SUSCRÍBETE a Codea con Horacio para más tips de desarrollo web y CSS rápido.
aprende ::before y ::after en 35 Segundos ⚡ | Tutorial CSS
Domina los pseudo-elementos ::before y ::after en CSS en menos de un 35segundos. 🔥
En este Short verás 5 casos de uso reales y listos para producción:
1️⃣ Inyección de iconos y texto sin modificar tu HTML
2️⃣ Bordes Neón con efecto Glow 🌟
3️⃣ Badges y cintas flotantes estilo PRO 🏷️
4️⃣ Dark Overlays para mejorar el contraste en imágenes 🖼️
💾 Guarda este video para consultarlo en tu próximo proyecto.
🔔 ¡Suscríbete / Sígueme para más trucos de CSS y Desarrollo Web en 35s!
Transforma un Login Básico en un Login Glassmorphism con HTML CSS y JS✨
¿Quieres aprender a crear un Login Glassmorphism moderno con HTML CSS y JS?
En este tutorial construiremos paso a paso un diseño elegante inspirado en las interfaces modernas.
📌 En este video aprenderás:
✅ Glassmorphism
✅ Efecto Blur
✅ Bordes iluminados
✅ Inputs modernos
✅ Botones con efecto Glow
✅ Flexbox
✅ Variables CSS
Todo el proyecto está desarrollado únicamente con HTML CSS y JS, ideal para practicar Frontend y mejorar tus habilidades de diseño web.
Si te gusta este tipo de contenido, suscríbete para más proyectos de HTML, CSS y JavaScript.
¡Deja de ROMPER tus imágenes con CSS! 😩
¿Tus imágenes se estiran, se deforman o rompen tu diseño cuando cambia el tamaño del contenedor? 😩 En este video te enseño cómo dominar la propiedad object-fit de CSS en menos de un minuto para que tus componentes se vean perfectos y profesionales.📌 Guía rápida de propiedades:fill: Estira la imagen para rellenar todo el contenedor. contain: Escala la imagen para que quepa entera sin recortar. cover: Recorta la imagen perfectamente para llenar el espacio. none: Ignora el contenedor y mantiene el tamaño original. scale-down: Compara las dimensiones y reduce el tamaño si es necesario. ¡Suscríbete a Codea con Horacio para más tips rápidos de desarrollo web y CSS avanzado! ⚡
Domina CSS Transforms de forma VISUAL ⚡
¿Te cuesta entender cómo interactúan las propiedades de CSS Transform en tus elementos? En esta lección rápida te muestro visualmente el impacto real en pantalla de translateX, translateY, rotate, rotateX, rotateY, scale, scaleX y skew cuando activas el hover.
Guarda este video para cuando estés maquetando y sígueme en Codea con Horacio para dominar el desarrollo web con código limpio y animaciones premium. 💻🚀
CSS Transition Timing Functions explicadas con una carrera 🚀
¿Quién se lleva la copa? 🏆
Puse a competir cara a cara las funciones de tiempo más importantes de CSS (linear, ease, steps, ease-in, ease-in-out, ease-out y cubic-bezier) para que veas de forma 100% visual cómo controlan la velocidad y el ritmo de tus animaciones.
Comenta con tu emoji favorito antes de que la cuenta regresiva llegue a cero y descubre si acertaste al ganador. 🚀
Si quieres dominar el desarrollo frontend con código limpio y con estilo, ¡suscríbete al canal!
Haga clic aquí para reclamar su Entrada Patrocinada.
Categoría
Página web
Dirección
Tacna
23001