24 de enero de 2026
Presentamos RetroUI 2.0 - más grande, más audaz, mejor
Tras meses de trabajo, RetroUI 2.0 ya está aquí. Soporte para Base UI, sitio unificado, docs mejoradas, más de 100 nuevos blocks y una plantilla completamente nueva. Es nuestra actualización más grande hasta la fecha.
Dov Azencot
@DovAzencotHemos estado construyendo a oscuras durante meses. Hoy encendemos la luz.
RetroUI 2.0 ya está aquí, y es la actualización más grande que hemos lanzado nunca. Esto no es un simple cambio de número de versión: es una evolución completa de lo que RetroUI puede hacer y de cómo interactúas con él.
Cuando lanzamos RetroUI, el objetivo era simple: darles a los desarrolladores una librería UI que no se pareciera a todo lo demás. Diseños con carácter, una estética neobrutalista y componentes que hacen que tus proyectos destaquen. Esa visión no ha cambiado. Pero ¿la forma en que la cumplimos? Eso ha evolucionado de forma drástica.
Entremos en materia.
🎨 Soporte para Base UI - los cimientos que pedías
Una de las funciones más solicitadas desde el primer día ha sido el soporte para Base UI, y por fin está aquí.
¿Qué es Base UI?
Base UI es una librería de componentes React accesibles y sin estilo, creada por el equipo de MUI. Piénsalo como la alternativa headless y agnóstica a Material UI: obtienes todo el comportamiento y toda la lógica de accesibilidad sin ningún criterio visual impuesto.
Por qué esto le importa a RetroUI
Hasta ahora, los componentes de RetroUI se construían sobre las primitivas de Radix UI (que son excelentes, que quede claro). Pero Base UI abre nuevas posibilidades:
- Flexibilidad de framework: Base UI funciona sin fricciones en React, Next.js y otros frameworks modernos
- Mejor tree-shaking: bundles más ligeros gracias a una optimización afinada
- Accesibilidad reforzada: las primitivas de accesibilidad de Base UI están más que probadas y cumplen con las WCAG desde el primer momento
- Una arquitectura a prueba de futuro: pensada para los React Server Components y el ecosistema React moderno
¿Qué significa esto para ti? Los componentes de RetroUI ahora son más rápidos, más accesibles y más flexibles que nunca. Y todo ello sin renunciar al lenguaje visual audaz y distintivo que te encanta.
// Now powered by Base UI under the hood
import { Button } from '@/components/neobrutalism'
<Button variant="primary">
Still bold. Still RetroUI. Now even better.
</Button>🌐 Un solo sitio, una sola visión - OS y Pro unidos
Aquí va algo que nos incomodaba: mantener sitios separados para RetroUI OS (gratis) y RetroUI Pro se sentía... fragmentado. Como si dividiéramos a nuestra comunidad en lugar de unirla.
Ya no.
Un sitio completamente rediseñado
Hemos reconstruido todo el sitio de RetroUI desde cero, fundiendo OS y Pro en una experiencia coherente. Esto es lo nuevo:
Una librería de componentes unificada
Explora todos los componentes, gratuitos y pro, en un solo lugar. Se acabaron los saltos entre sitios para ver qué hay disponible. Todo está claramente marcado, así sabes qué es gratis y qué es premium.
Una navegación más limpia
Encontrar lo que necesitas es más rápido e intuitivo. Componentes, blocks, plantillas, docs: cada cosa tiene su lugar lógico.
Un diseño más pulido
Predicamos con el ejemplo. El nuevo sitio es más audaz, más rápido y más refinado. Es una vitrina de lo que RetroUI puede hacer cuando te comprometes con la estética.
Una mejor experiencia móvil
El sitio antiguo funcionaba en móvil. El nuevo brilla en móvil. Diseño responsive hecho como Dios manda, con interacciones táctiles que se sienten nativas.
¿La mejor parte? Todo funciona con componentes de RetroUI. Nos comemos nuestra propia cocina: cada componente que ves en el sitio es algo que puedes usar en tus proyectos.
📚 Documentación que de verdad ayuda
Seamos sinceros: la documentación suele quedar en segundo plano. Esta vez no.
Hemos renovado por completo las docs de RetroUI, con funciones que te facilitan la vida:
Copiar como Markdown
¿Estás trabajando en la documentación de tu propio proyecto? ¿Escribiendo un artículo sobre RetroUI? Ahora puedes copiar el código de un componente como Markdown con un solo clic.
Ideal para:
- Crear la documentación de tus propios componentes
- Escribir tutoriales y guías
- Compartir ejemplos de código en herramientas basadas en Markdown (Notion, GitHub, etc.)
Documentación potenciada con IA
Hemos integrado asistencia por IA directamente en las docs. ¿Tienes una pregunta sobre cómo personalizar un componente? ¿Necesitas entender la API? La IA te ayuda a encontrar respuestas más rápido que rebuscando entre páginas de documentación.
Ejemplos de lo que puedes preguntar:
- "¿Cómo hago que el componente Button use colores personalizados?"
- "¿Qué props acepta el componente Card?"
- "Muéstrame ejemplos de uso de la Modal con formularios"
Es como tener a un experto de RetroUI a mano, las 24 horas.
Ejemplos de código mejorados
Cada componente cuenta ahora con:
- Vistas previas en vivo con las que puedes interactuar
- Varias variantes que muestran distintos casos de uso
- Código listo para copiar y pegar con los imports correctos
- Ejemplos en TypeScript para un tipado más seguro
- Notas de accesibilidad que explican cómo cada componente maneja la a11y
Se acabaron las adivinanzas. Se acabaron las inmersiones en el código fuente. Solo ejemplos claros y útiles que te hacen avanzar más rápido.
🧱 Más de 100 nuevos blocks - construye más rápido que nunca
Los componentes están muy bien. Pero a veces necesitas secciones completas, no solo botones y cards.
Ahí es donde entran los blocks.
¿Qué son los blocks?
Los blocks son secciones prefabricadas que sueltas en tu proyecto: secciones hero, tablas de precios, grillas de funcionalidades, testimonios, CTAs y mucho más. Son totalmente responsive, accesibles y están listos para personalizar.
¿Qué hay de nuevo en la 2.0?
Hemos añadido más de 100 nuevos blocks en todas las categorías imaginables:
Secciones hero
- Más de 15 nuevas variantes de hero, del minimalista al de pantalla completa
- Incluyen fondos animados, layouts de pantalla partida y heros con vídeo
Funcionalidades y beneficios
- Grillas de funcionalidades basadas en iconos
- Escaparates con capturas de pantalla
- Guías paso a paso
- Tablas comparativas
Tablas de precios
- Desde layouts simples de 2 columnas hasta precios complejos de 4 niveles
- Conmutador de facturación (mensual/anual)
- Matrices de comparación de funcionalidades
Testimonios
- Layouts en grilla, carruseles y diseños en mosaico
- Testimonios en vídeo
- Muros de logos como prueba social
CTAs y conversiones
- Registros a la newsletter
- Formularios de lista de espera
- Secciones de descarga de app
- Formularios de contacto con carácter
Cabeceras y navegación
- Megamenús
- Patrones de navegación pensados mobile-first
- Cabeceras fijas con efectos al hacer scroll
Pies de página
- Pies de página de varias columnas
- Pies de página minimalistas de una sola fila
- Pies de página con la newsletter integrada
Cada block está construido con la misma estética audaz de RetroUI: bordes gruesos, sombras duras, colores vibrantes y layouts asimétricos. Están diseñados para destacar, no para mimetizarse.
// Drop in a complete hero section in seconds
import { HeroBold } from '@/components/blocks'
<HeroBold
title="Your Product Name"
subtitle="Ship faster with bold design"
cta="Get Started"
/>🌙 Nueva plantilla: dashboard de herramienta dev en modo oscuro
Las plantillas son donde todo converge: componentes, blocks y filosofía de diseño unidos en una aplicación completa.
Presentamos nuestra plantilla más reciente: el Dark Mode Dev Tool Dashboard.
¿Qué es?
Un dashboard con todas las funciones, pensado con el modo oscuro por delante, hecho para herramientas de desarrollo, plataformas SaaS y paneles de administración. Es todo lo que necesitas para construir una aplicación lista para producción con la estética audaz de RetroUI.
¿Qué incluye?
Un layout de dashboard completo
- Navegación lateral con menú plegable
- Cabecera superior con búsqueda y perfil de usuario
- Diseño responsive que funciona en móvil, tablet y escritorio
Páginas prefabricadas
- Vista general del dashboard con métricas y gráficos
- Gestión de usuarios (lista, detalle, edición)
- Página de ajustes con ejemplos de formularios
- Página de documentación de API
- Gestión de facturación y suscripciones
El modo oscuro bien hecho
- No son simples colores invertidos: está diseñado a propósito para fondos oscuros
- Alto contraste para la legibilidad
- Colores de acento vibrantes que revientan sobre fondos oscuros
Funcionalidades listas para producción
- Pantallas de autenticación (inicio de sesión, registro, contraseña olvidada)
- Estados de error y estados vacíos
- Skeletons de carga
- Notificaciones toast
- Diálogos modales y confirmaciones
Pensado para desarrolladores
- Construido con TypeScript
- Estructura de componentes documentada
- Fácil de personalizar y extender
- Sigue las convenciones del App Router de Next.js
Esto no es una plantilla de juguete. Es una base sobre la que construir productos reales. Ya sea que lances un nuevo SaaS, construyas una herramienta interna o crees una plataforma para desarrolladores, esta plantilla te da una ventaja de partida.
Y sí, no se parece en nada a las demás plantillas de dashboard que hay por ahí. Ese es justo el punto.
Por qué esto importa
RetroUI 2.0 no va solo de añadir funciones. Va de hacer RetroUI más potente, más flexible y más útil para proyectos del mundo real.
El soporte para Base UI significa mejor rendimiento y accesibilidad.
El sitio unificado significa un descubrimiento más fácil y una mejor experiencia para todos.
Las docs mejoradas significan menos tiempo buscando y más tiempo construyendo.
Más de 100 nuevos blocks significan que puedes despachar páginas completas en minutos, no en días.
La plantilla en modo oscuro significa que tienes una base sólida para tu próximo proyecto.
En conjunto, estas novedades hacen de RetroUI 2.0 la librería UI más completa y lista para producción, para desarrolladores que se niegan a construir interfaces aburridas.
¿Y ahora qué?
Es un lanzamiento grande, pero no nos detenemos aquí. Esto es lo que hay en la hoja de ruta:
- Más plantillas (variantes en modo claro, landings, e-commerce)
- Integración Figma a código para un flujo de diseño a desarrollo más rápido
- Nuevos componentes de Base UI a medida que ampliamos la librería
- Una vitrina de la comunidad que destaque proyectos construidos con RetroUI
- Tutoriales en vídeo que recorren patrones y casos de uso habituales
Y también escuchamos. Si hay un componente que necesitas, una función que quieres o un problema que te bloquea, dínoslo. RetroUI está hecho para desarrolladores, por desarrolladores. Tus comentarios dan forma a lo que construimos después.
Prueba RetroUI 2.0 hoy mismo
¿Listo para lanzarte? Así puedes empezar:
Si eres nuevo
# Install RetroUI
npx retroui-cli init
# Or install via npm
npm install @retroui/reactExplora los componentes, descubre los blocks y hazte con la nueva plantilla. Todo está listo para usar en tu proyecto de Next.js, React o Vite.
Si ya usas RetroUI
Si RetroUI ya forma parte de tus herramientas, pasar a la 2.0 es sencillo:
Consulta el changelog por si hay cambios que rompan compatibilidad (hay muy pocos, y hemos documentado una solución para todos ellos).
Gracias
RetroUI existe porque desarrolladores como tú están cansados de los diseños genéricos. Quieres construir cosas que destaquen, que tengan personalidad, que se sientan distintas.
Estamos aquí para ponértelo más fácil.
La versión 2.0 es el fruto de meses de trabajo, cientos de commits, incontables iteraciones de diseño y los comentarios de una comunidad increíble. Gracias por ser parte de este viaje.
Ahora ve y construye algo audaz. 🚀
Explora RetroUI 2.0:
- Explorar componentes
- Descubrir los blocks
- Hacerte con la plantilla
- Leer las docs
- Unirte a la comunidad
¿Preguntas? ¿Comentarios? ¿Encontraste un bug? Abre una issue en GitHub o escríbenos en Twitter/X.