Sitios de inspiración para diseño UI: 6 lugares para encontrar interfaces reales
Seis sitios que muestran interfaces reales en lugar de mockups: Mobbin, Refero, Page Flows, Landingfolio, Dark Mode Design y SaaSFrame. Para qué sirve mejor cada uno, cuánto cuesta abrirlos y cómo usarlos en un brief.
Un frame en blanco es el peor lugar para empezar un diseño. Las interfaces reales lo ponen fácil: ves cómo es ya una página de ajustes, un paywall o un hero cuando un equipo lo lanzó. Aquí tienes seis sitios que recopilan pantallas reales, para qué sirve mejor cada uno y cuáles te piden registrarte primero.
| Sitio | Ideal para | Abrir sin pagar |
|---|---|---|
| Mobbin | Pantallas reales de apps, más de 600.000 | Cuenta gratuita, acceso limitado |
| Refero | Buscar pantallas, flujos y patrones | Busca en la biblioteca del sitio |
| Page Flows | Flujos completos con grabaciones de pantalla | Prueba de 3 días |
| Landingfolio | Landing pages, heroes, componentes | Explora la galería |
| Dark Mode Design | Diseños web oscuros | Explora la cuadrícula |
| SaaSFrame | Webs SaaS y pantallas de producto | Explora por categoría |
1. Mobbin: pantallas reales de apps
Mobbin se define como "la biblioteca de referencias de diseño para apps y sitios" y enumera más de 600.000 pantallas publicadas, con novedades cada semana. Su biblioteca se divide en apps, sitios, pantallas, flujos, animaciones y elementos de UI. Puedes unirte gratis, pero una cuenta gratuita tiene acceso limitado y la biblioteca completa está detrás de planes de pago.
Qué buscar: cómo resuelven varias apps la misma pantalla. Elige un tipo de pantalla, como el onboarding o un paywall, y compara cinco seguidas antes de dibujar la tuya.
2. Refero: referencias que puedes buscar
Refero se describe como "pantallas, flujos y patrones reales de producto". Está construido alrededor de la búsqueda. Su página ofrece consultas como registro con verificación por email, diseños de dashboard con gráficos y pantallas de login con SSO y restablecimiento de contraseña, y tiene pestañas separadas para web apps y apps de iOS.
Qué buscar: una pregunta concreta, escrita como búsqueda. "Calendar booking" te devuelve respuestas útiles más rápido que hacer scroll por una galería.
3. Page Flows: el recorrido completo
La mayoría de sitios de inspiración muestran pantallas sueltas. Page Flows muestra el camino entre ellas. Su lema es "UI/UX Inspiration from Real User Flows", y combina flujos con grabaciones de pantalla y anotaciones paso a paso.
Puedes filtrar por iOS, Android, web y emails, y ofrece una prueba de 3 días.
Qué buscar: los pasos entre las pantallas. Un buen flujo de registro se decide por lo que pasa después del botón, así que mira toda la secuencia, no el primer frame.
4. Landingfolio: ideas de landing pages y heroes
Landingfolio es una galería de landing pages. Cuando lo revisamos, su cabecera contaba 961 sitios y 4 añadidos esa semana, filtrables por industria, tipo de página (landing, precios, acerca de, login, registro, 404) y color. También incluye componentes para Tailwind, Webflow y Figma.
Qué buscar: la primera pantalla, el hero. Filtra por tu industria y compara cómo dicen los competidores lo único que un visitante necesita saber. Nuestras guías sobre principios de diseño de landing pages y anatomía de una landing page SaaS explican qué hacer con lo que encuentres.
5. Dark Mode Design: webs oscuras
Dark Mode Design es una cuadrícula curada de webs oscuras, y cualquiera puede enviar un sitio. Cada tile es un diseño oscuro completo, así que ves cómo otros manejan el contraste, el color de acento y las imágenes sobre un fondo negro o casi negro. Todas las capturas pertenecen a sus propietarios.
Qué buscar: el segundo color. Fíjate en qué colores añade cada sitio sobre su acento y dónde los usa. Nuestro paper sobre sistemas de color para modo oscuro explica cómo construir el tuyo.
6. SaaSFrame: pantallas SaaS
SaaSFrame es "una biblioteca de inspiración de diseño UI y UX para SaaS" con webs e interfaces de producto SaaS reales. Sus categorías muestran el tamaño de la biblioteca: 296 pantallas de landing page, 211 páginas de precios, 191 dashboards, 424 pantallas de añadir y editar y 571 pantallas de configuración de cuenta cuando lo revisamos. También lista patrones, como navegación lateral, checklists de onboarding y estados de generación con IA, y dice que ofrece archivos de Figma editables y prompts de diseño con IA.
Qué buscar: las pantallas aburridas. Precios, ajustes y configuración de cuenta deciden si un producto se siente terminado, y son las pantallas que un frame en blanco hace más difíciles.
Cómo usar los seis juntos
- Nombra la pantalla. Escribe la única pantalla o flujo que estás diseñando.
- Elige el sitio. Pantallas completas de apps, a Mobbin; una pregunta, a Refero; un recorrido, a Page Flows; un hero, a Landingfolio; un tema oscuro, a Dark Mode Design; y un producto SaaS, a SaaSFrame.
- Guarda tres, no treinta. Elige las tres que mejor resuelvan tu pantalla.
- Escribe una línea por cada una. "Precio claro, un solo botón" es una referencia. Una imagen guardada sin nota es un montón.
- Copia la decisión, no los píxeles. Quédate con lo que hace el layout y por qué. Nuestro paper sobre diseño guiado por capturas muestra cómo convertir referencias en un flujo de trabajo.
Un diseñador o un cliente pueden hacer mucho con "una página de precios tan simple como esta, con un selector de plan como aquel". Pueden hacer muy poco con "hazlo moderno".
Sitio
Mobbin
Pantallas reales de apps. Cuenta gratuita con acceso limitado, de pago para la biblioteca completa.
Sitio
Refero
Pantallas, flujos y patrones reales de producto en los que puedes buscar.
Sitio
Page Flows
Flujos de usuario completos de las mejores apps, con grabaciones de pantalla.
Sitio
Landingfolio
Inspiración de landing pages y heroes.
Sitio
Dark Mode Design
Una cuadrícula de diseños web oscuros.
Sitio
SaaSFrame
Una biblioteca de inspiración de diseño UI y UX para SaaS.
Archivo gratuito de Figma
6 sitios para ideas de UI
Los seis enlaces y para qué sirve cada sitio, en un archivo gratuito.
FAQ
¿Cuáles son los mejores sitios web de inspiración para diseño UI?
Mobbin, Refero, Page Flows, Landingfolio, Dark Mode Design y SaaSFrame. Cubren pantallas de apps, referencias con buscador, flujos de usuario completos, landing pages, webs oscuras e interfaces SaaS.
¿Mobbin es gratis?
En parte. Mobbin te deja unirte gratis con acceso limitado, y la biblioteca completa de más de 600.000 pantallas requiere un plan de pago.
¿Dónde puedo encontrar ejemplos de flujos de usuario reales?
En Page Flows. Muestra flujos de apps y webs reales con grabaciones de pantalla y anotaciones paso a paso, y ofrece una prueba de 3 días.
¿Dónde puedo encontrar inspiración de diseño para landing pages?
Landingfolio es una galería de landing pages que se puede filtrar por industria y tipo de página. SaaSFrame también lista pantallas de landing pages SaaS.
¿Dónde puedo encontrar inspiración de webs oscuras?
Dark Mode Design reúne webs oscuras en una sola cuadrícula, y cualquiera puede enviar un sitio.
¿Cómo uso la inspiración sin copiar?
Guarda dos o tres referencias para la pantalla que estás diseñando y escribe una línea sobre lo que hace bien cada una. Usa la decisión, como el precio claro o el botón único, y dibuja tú mismo el layout.
Fuentes
- Mobbin, mobbin.com: "The design reference library for apps and sites", más de 600.000 pantallas publicadas, unirse gratis, planes. Consultado el 4 de noviembre de 2026.
- Refero, refero.design: "Real product screens, flows, and patterns". Consultado el 4 de noviembre de 2026.
- Page Flows, pageflows.com: "UI/UX Inspiration from Real User Flows", grabaciones de pantalla y anotaciones, prueba de 3 días. Consultado el 4 de noviembre de 2026.
- Landingfolio, landingfolio.com: "The Best Landing Page Design Inspiration", 961 sitios el día de la consulta. Consultado el 4 de noviembre de 2026.
- Dark Mode Design, darkmodedesign.com: una cuadrícula de webs oscuras, envío de sitios. Las capturas pertenecen a sus propietarios. Consultado el 4 de noviembre de 2026.
- SaaSFrame, saasframe.io: "SaaS UI & UX Design Inspiration Library", número de pantallas según se mostraba el día de la consulta. Consultado el 4 de noviembre de 2026.
- Publicado originalmente como carrusel en UX Brainy.
Collected the references and still need the interface built? Our team turns a clear brief into product UI that holds up in every state.
Get Started
