02 Oct 20 páginas de inspiración para diseño gráfico, web y UI/UX

Si buscas páginas de inspiración para diseño, el problema no suele ser encontrar ejemplos: es saber qué referencia merece la pena mirar según lo que estés diseñando. Una web, una interfaz, una identidad visual o un sistema tipográfico necesitan fuentes distintas.

En esta guía he reunido 20 sitios de inspiración para diseño gráfico, diseño web y UI/UX que utilizo como referencia por motivos diferentes. Algunas plataformas sirven para descubrir webs con una dirección de arte potente; otras permiten estudiar interfaces reales, flujos de usuario, branding, packaging, tipografía o moodboards.

Si buscas páginas de diseño gráfico para inspirarte, Behance, Dribbble, Brand New o BP&O son buenos puntos de partida. Para referencias de diseño web, empezaría por Awwwards, Godly.website, Siteinspire o Land-book. Y para UI/UX, Mobbin, Page Flows, Refero y Figma Community ofrecen ejemplos mucho más útiles que una galería puramente estética.

La clave no es copiar una solución. Como profesor de diseño web y creador de proyectos digitales, me interesa entender por qué una referencia funciona: qué hace con la jerarquía, la composición, el color, la tipografía, la interacción o el recorrido del usuario, y qué parte de esa lógica se puede adaptar al proyecto real.

Última revisión: septiembre de 2026. Las plataformas cambian con el tiempo; he priorizado recursos que siguen siendo útiles para analizar diseño web, UI/UX, branding, dirección visual y tipografía.

20 páginas de inspiración para diseño: resumen rápido

Antes de entrar en detalle, esta tabla te ayuda a elegir la plataforma adecuada según el tipo de proyecto.

Sitios de inspiración para diseño web

Si estás diseñando una web, una landing, un portfolio o una experiencia digital, conviene separar dos tipos de referencias: las que sirven para explorar una dirección visual y las que ayudan a resolver estructuras aplicables a proyectos reales.

Awwwards

Awwwards es una de las referencias más conocidas para analizar diseño web de alto nivel. Reúne proyectos donde se combinan dirección de arte, interacción, contenido, animación y desarrollo front-end.

Lo usaría para estudiar portfolios, webs de agencia, proyectos culturales o experiencias digitales con una identidad muy marcada. Su valor está en mirar más allá de si una web es bonita: navegación, ritmo, tipografía, movimiento y coherencia entre diseño y tecnología.

Awwwards también es útil para detectar tendencias antes de que lleguen a proyectos más convencionales. Eso sí, no asumiría que todo lo que funciona en una web premiada debe trasladarse a una web corporativa o a una landing de conversión.

Recent Design, antes Godly.website

Si conocías Godly.website, hay un cambio importante: el proyecto redirige actualmente a Recent Design.

Recent Design amplía el enfoque y funciona como una curación diaria de diseño, webs y herramientas. No se limita a páginas web: permite explorar referencias de interfaces, branding, producto, tipografía, motion, editorial, packaging o 3D, entre otras categorías.

Lo utilizaría cuando buscas una dirección visual contemporánea y quieres salir de las galerías de webs más previsibles. Es especialmente útil al inicio de un proyecto, cuando todavía estás abriendo caminos y no necesitas resolver un patrón de UX concreto.

Siteinspire

Siteinspire me parece especialmente útil cuando buscas referencias visuales más limpias y aplicables. Hay portfolios, estudios, marcas y proyectos editoriales con una estructura clara y menos dependencia de efectos llamativos.

Lo utilizaría para estudiar jerarquía visual, navegación, relación entre texto e imagen y composición de una web profesional. Si Awwwards sirve para abrir posibilidades, Siteinspire suele funcionar mejor cuando necesitas aterrizar esas ideas.

Land-book

Land-book es una de mis opciones preferidas para analizar landing pages, webs de producto, SaaS y páginas comerciales. Aquí resulta fácil estudiar cómo se presenta una propuesta de valor y cómo se ordenan hero, beneficios, prueba social, precios y llamadas a la acción.

La usaría cuando el diseño tiene un objetivo comercial claro. No solo ayuda a encontrar una estética: permite comparar estructuras y entender cómo diseño y mensaje trabajan juntos.

Lapa Ninja

Lapa Ninja también está muy orientada a landing pages, pero con un enfoque práctico en secciones, formularios, bloques de beneficios, testimonios, precios y CTA.

Es una buena referencia cuando una página no comunica bien su propuesta o cuando necesitas estudiar cómo otras webs conducen al usuario hacia una acción concreta. La combinaría con Land-book cuando el proyecto tiene un componente fuerte de captación o venta.

One Page Love

One Page Love está especializada en webs de una sola página. Es útil para portfolios, productos, eventos, lanzamientos y proyectos que necesitan condensar toda la información en un recorrido vertical.

Su valor está en obligarte a pensar el orden de la información. Si todo vive en una sola página, cada bloque debe justificar su posición y conducir de forma natural al siguiente.

Sitios de inspiración para UI/UX y producto digital

En UI/UX la referencia útil no es solo una pantalla atractiva. Necesitas entender patrones, estados, recorridos y decisiones que un usuario encuentra durante una tarea completa.

Mobbin

Mobbin reúne pantallas y flujos de productos digitales reales. Es especialmente útil para estudiar onboarding, perfiles, búsquedas, filtros, suscripciones, checkouts, dashboards y otros patrones habituales.

Lo usaría cuando tienes que resolver una interfaz concreta y quieres comparar varias soluciones antes de diseñar la tuya. También es una buena forma de argumentar decisiones de producto con referencias reales, no solo con preferencias estéticas.

Page Flows

Page Flows resulta especialmente interesante cuando quieres analizar un recorrido completo. Puedes estudiar registros, onboarding, compras, pagos, suscripciones o procesos de recuperación de contraseña.

La diferencia frente a una galería de interfaces es que aquí observas qué ocurre antes y después de cada pantalla. Eso ayuda a detectar pasos innecesarios, momentos de fricción y patrones que se repiten entre distintos productos.

UX Archive

UX Archive sirve para organizar y consultar patrones de experiencia de usuario. Es útil para product designers y equipos que quieren construir una biblioteca de referencias reutilizable.

Lo utilizaría sobre todo en investigación, auditoría o rediseño, cuando necesitas comparar cómo se resuelve un mismo problema en varios productos y transformar esas referencias en criterios de diseño.

Refero

Refero permite buscar pantallas, componentes y patrones de productos reales. Funciona especialmente bien cuando sabes qué parte de la interfaz necesitas resolver: precios, navegación, formularios, onboarding o dashboards.

Su principal ventaja es la concreción. En lugar de navegar durante horas por proyectos completos, puedes buscar el patrón que necesitas y comparar soluciones.

Figma Community

Figma Community combina inspiración y aprendizaje práctico. Puedes abrir kits UI, sistemas de diseño, componentes, wireframes y plantillas para entender cómo otros diseñadores estructuran archivos reales.

Eso la convierte en una referencia diferente: no solo ves el resultado, también puedes estudiar auto layout, variantes, estilos y componentes por dentro.

Sitios de inspiración para diseño gráfico, branding y dirección visual

Aquí el objetivo cambia. Ya no estás resolviendo una pantalla concreta, sino una estética completa: identidad, color, fotografía, tipografía, packaging y forma de presentar una marca.

Behance

Behance sigue siendo una de las mejores páginas para estudiar proyectos completos de branding, editorial, packaging, campañas e ilustración.

Su principal ventaja es el contexto. Muchos trabajos muestran aplicaciones, mockups y distintas piezas de un mismo sistema visual. Eso permite analizar cómo se construye una identidad y, además, aprender a presentar mejor un proyecto en portfolio.

Dribbble

Dribbble funciona mejor como fuente de inspiración rápida. Es útil para explorar estilos, ilustración, UI, iconos, branding y conceptos gráficos.

Lo usaría para desbloquear una dirección visual, pero no como única referencia para tomar decisiones de producto o branding. Muchas publicaciones son piezas aisladas y no explican estrategia, contexto o restricciones reales.

Cosmos.so

Cosmos.so es especialmente útil para crear colecciones visuales y moodboards. Su valor está en agrupar referencias con una estética coherente y ayudarte a detectar patrones de color, fotografía, textura, composición o tono.

La usaría al principio de un proyecto, cuando todavía no has cerrado la dirección visual y necesitas convertir conceptos abstractos en referencias concretas.

Brand New

Brand New es una referencia especialmente valiosa para estudiar rediseños de marcas reales. Permite comparar antes y después, analizar logotipos, sistemas visuales y aplicaciones, y entender qué problema intenta resolver cada cambio.

Lo usaría para entrenar criterio de branding. Una identidad no mejora solo por parecer más moderna: debe ganar en coherencia, legibilidad, reconocimiento o capacidad de adaptación.

BP&O

BP&O tiene una selección más editorial y cuidada de proyectos de identidad y packaging. Es especialmente interesante cuando buscas referencias premium y quieres estudiar cómo conviven tipografía, materiales, fotografía y dirección de arte.

Lo recomiendo cuando una marca necesita mantener una identidad coherente en muchos soportes, no solo en el logotipo.

The Dieline

The Dieline está centrada en packaging y marca aplicada a producto físico. Puedes estudiar envases, etiquetas, cajas, botellas, materiales, acabados y jerarquía de información.

Es una referencia muy útil para entender qué ocurre cuando una identidad sale de la pantalla y debe funcionar en condiciones reales de producción, exposición y venta.

Pinterest

Pinterest puede ser muy útil para abrir caminos visuales, crear moodboards y conectar referencias de diseño, fotografía, moda, arquitectura o arte.

Lo usaría al inicio de un proyecto, pero no como única fuente. Muchas imágenes circulan sin contexto o autoría clara. Para analizar decisiones con más profundidad, conviene combinar Pinterest con Behance, Brand New o BP&O.

Sitios de inspiración tipográfica

La tipografía no debería elegirse viendo únicamente una muestra en un catálogo. Estas dos páginas permiten entender cómo funciona una fuente dentro de composiciones y proyectos reales.

Fonts In Use

Fonts In Use muestra tipografías aplicadas en carteles, libros, webs, identidades, campañas, música y packaging.

Es especialmente útil cuando ya tienes una fuente en mente y quieres comprobar qué personalidad adquiere en distintos contextos, cómo se combina con otras familias y qué tipo de jerarquía permite construir.

Typewolf

Typewolf está más orientada a descubrir fuentes y combinaciones tipográficas, sobre todo en diseño web.

La usaría cuando estás definiendo titulares, textos y elementos secundarios y quieres evitar combinaciones demasiado genéricas. Es una forma práctica de estudiar cómo la tipografía cambia el tono de una interfaz o de una marca.

Qué página de inspiración usar según lo que estés diseñando

No necesitas consultar las 20 plataformas cada vez que empiezas un proyecto. Para diseño web, empezaría por Siteinspire o Land-book si buscas soluciones aplicables y por Awwwards o Godly.website si necesitas una dirección visual más experimental. Para UI/UX, Mobbin y Page Flows son mejores cuando quieres estudiar patrones y recorridos reales.

En diseño gráfico y branding, Behance permite entender proyectos completos, mientras que Brand New y BP&O ayudan a analizar identidades con más criterio. Si estás definiendo una atmósfera visual, Cosmos.so o Pinterest funcionan mejor como herramientas de exploración y moodboard. Y para tipografía, Fonts In Use y Typewolf son más útiles que una galería generalista porque muestran fuentes en contexto.

La mejor fuente de inspiración depende de la decisión que tienes que tomar. Elegir una plataforma por objetivo reduce el ruido y hace que las referencias sean mucho más útiles.

Cómo usar referencias de diseño sin copiar

Buscar referencias es una parte normal del proceso, pero resulta mucho más útil cuando analizas una pieza por capas en lugar de copiar una solución completa.

Analiza primero la estructura

Antes de fijarte en el estilo, observa qué aparece primero, cómo se ordenan los bloques, dónde se colocan las llamadas a la acción y cómo avanza el usuario. En una web o una interfaz, la estructura suele ser más transferible que la estética.

Separa color, tipografía, composición e interacción

Una referencia puede servirte por una sola decisión. Quizá te interese la paleta, pero no el layout; o la jerarquía tipográfica, pero no la fotografía. Guardar referencias por motivo concreto hace que luego sean mucho más fáciles de reutilizar.

Combina varias referencias

Si todo tu proyecto parte de una única referencia, aumenta el riesgo de que termine pareciéndose demasiado. Es mejor mezclar aprendizajes: Awwwards para dirección visual, Mobbin para un patrón UI, Behance para identidad y Fonts In Use para tipografía.

Adapta la inspiración al contexto

Una web experimental puede funcionar para una campaña creativa y ser una mala decisión para una clínica, una tienda online o una página de captación. La referencia debe adaptarse al objetivo, al público, al contenido y a las limitaciones reales del proyecto.

Crea una biblioteca de referencias

En lugar de acumular capturas sin orden, clasifica tus referencias por categorías: diseño web, UI/UX, branding, tipografía, color, composición, interacción, packaging o moodboards. Con el tiempo tendrás una base propia que acelera el trabajo y mejora tu criterio.

Errores al buscar referencias e inspiración de diseño

Guardar demasiado sin analizar

Acumular cientos de imágenes no equivale a investigar. Antes de guardar una referencia, intenta explicar en una frase qué decisión concreta te interesa.

Copiar una pieza completa

El aprendizaje está en separar decisiones y recombinarlas. Replicar estructura, color, tipografía y composición de una misma referencia aporta poco criterio y aumenta el riesgo de terminar imitando el trabajo original.

Fijarse solo en la estética

Una interfaz espectacular puede tener problemas de accesibilidad, claridad o conversión. Analiza también jerarquía, legibilidad, usabilidad y contenido.

Mezclar estilos incompatibles

Que una tipografía, una paleta y una composición te gusten por separado no significa que funcionen juntas. Todas las decisiones deben responder a una misma dirección visual.

No adaptar la referencia al proyecto

La buena inspiración no se copia: se traduce. Esa traducción depende de la marca, el usuario, el presupuesto, la herramienta y el objetivo del proyecto.

Buscar inspiración de diseño funciona mejor cuando cada referencia responde a una pregunta concreta. Si sabes si estás buscando estructura, interacción, identidad, color o tipografía, puedes pasar de acumular imágenes a construir un criterio visual propio. Ese es el objetivo de esta selección: que las páginas de inspiración te ayuden a decidir mejor, no a copiar más rápido.

Preguntas frecuentes sobre sitios de inspiración para diseño

¿Cuál es el mejor sitio para buscar inspiración de diseño web?

Awwwards y Godly.website son muy útiles para referencias creativas y experimentales. Siteinspire funciona mejor para webs limpias y aplicables, mientras que Land-book, Lapa Ninja y One Page Love son especialmente útiles para landing pages y estructuras comerciales.

¿Dónde puedo encontrar inspiración para diseño gráfico?

Behance, Dribbble, Cosmos.so, Brand New, BP&O, The Dieline y Pinterest cubren necesidades distintas. Behance permite analizar proyectos completos, Dribbble sirve para explorar estilos rápidamente y Brand New o BP&O son mejores cuando quieres estudiar branding con más profundidad.

¿Qué páginas son mejores para inspiración UI/UX?

Mobbin, Page Flows, UX Archive, Refero y Figma Community. Mobbin y Refero permiten estudiar pantallas y patrones reales, Page Flows se centra en recorridos completos y Figma Community añade archivos editables y sistemas de diseño.

¿Cómo buscar inspiración sin copiar otros diseños?

Analiza cada referencia por partes: estructura, color, tipografía, composición, jerarquía, interacción y experiencia. Combina aprendizajes de varias fuentes y adapta las decisiones al objetivo y al público del proyecto.

¿Pinterest sirve para buscar inspiración de diseño?

Sí. Es especialmente útil para moodboards y exploración inicial, pero conviene contrastar después las ideas con plataformas más especializadas que aporten contexto y autoría.

¿Qué sitio puedo usar para inspiración tipográfica?

Fonts In Use permite ver tipografías aplicadas en proyectos reales. Typewolf es muy útil para descubrir fuentes y combinaciones tipográficas, especialmente orientadas a diseño web.

¿Qué diferencia hay entre Behance y Dribbble?

Behance suele funcionar mejor para analizar proyectos completos y casos de branding, editorial o packaging. Dribbble está más orientada a piezas visuales breves, UI, ilustración y exploración rápida de estilos. Las dos son útiles, pero para objetivos distintos.

Lecturas relacionadas

• Qué es Figma y por qué acelera tu diseño web
• Los mejores plugins para Figma
• Herramientas para crear paletas de color web
• Diseñadores gráficos españoles que merece la pena conocer
• Estudios de diseño web destacados

Escrito por Jurgen B

Profesor en Aula CM de Diseño Web con WordPress, Diseño Gráfico, Community Manager, IA, SEO y ecommerce. Moderador de la mesa de ecommerce en Reunión de Agencias (2024–2026) y ponente en ProMarketing Day.

Sobre mí · LinkedIn