Patrones de
slop en tu web

+100 patrones que delatan una web hecha con IA, juntados de lo que ya está documentado.

Salen de Impeccable, frontend-design de Anthropic, taste-skill, DeSlop, anti-ai-slop, Hacker News.

Tarjeta blanda con un íconoComponentes
Botones que no dicen nadaTextos
Inter en todoTipografía
Tres tarjetas iguales con íconoEstructura
Degradado de violeta a azulColor
Gente sonriendo frente a una laptopImágenes
Todo aparece subiendo al bajarMovimiento
Ícono en un cuadrado arriba de cada títuloÍconos
Borde de color a un costadoComponentes
«Desbloquea el poder de…»Textos
Las otras fuentes de siempreTipografía
Tarjetas dentro de tarjetasEstructura
El botón índigo de TailwindColor
Ilustración isométrica en tonos pastelImágenes
Cada tarjeta se eleva al pasar el mouseMovimiento
Emojis como íconosÍconos
Borde grueso arriba de una tarjeta redondeadaComponentes
Sin fricción, sin esfuerzo, sin complicacionesTextos
Serif fina para parecer editorialTipografía
Cifra enorme, etiqueta chicaEstructura
La paleta de fábrica como marcaColor
Formas abstractas en lugar de fotosImágenes
Rebotes elásticosMovimiento
Los íconos de línea de Lucide, tal cualÍconos
Borde finito y sombra enormeComponentes
«La plataforma con IA para equipos modernos»Textos
Serif con una palabra en cursivaTipografía
Pasos numerados 01, 02, 03Estructura
Cian o neón sobre negroColor
Fondo de auroraImágenes
Un cursor que parpadea en el títuloMovimiento
Una chispa para decir «IA»Íconos
Vidrio esmerilado en todoComponentes
«Todo lo que necesitas, en un solo lugar»Textos
Una sola palabra destacada en el títuloTipografía
Las secciones de siempre, en el orden de siempreEstructura
Negro con un solo acento ácidoColor
Un teléfono inventado con pantallas grisesImágenes
Logos que pasan sin pararMovimiento
Una flecha al final de cada enlaceÍconos
Esquinas redondas al extremoComponentes
«Lleva tu negocio al siguiente nivel»Textos
Pastilla arriba del títuloTipografía
Hero centrado con dos botonesEstructura
Crema, serif y terracotaColor
Fotos recortadas en manchasImágenes
transition: all en todoMovimiento
Un rayo o una chispa en un cuadrado como logoÍconos
Todos los botones son primariosComponentes
Una bajada que repite el títuloTextos
Etiqueta en mayúsculas sobre cada títuloTipografía
Todo centradoEstructura
Grises fríos, sin ningún matizColor
Una foto tapada por un veloImágenes
Cifras que cuentan hacia arribaMovimiento
Una lista de tildesÍconos
Gráficos de adorno que no miden nadaComponentes
Beneficios que sirven para cualquier productoTextos
Etiqueta que repite el títuloTipografía
Cada sección con la misma plantillaEstructura
Manchas de colores difusasColor
La imagen que nunca cargóImágenes
Cosas que flotan sin motivoMovimiento
Una ruedita en lugar del contenidoComponentes
«No es X. Es Y.»Textos
Un título de cinco renglonesTipografía
Todo pesa lo mismoEstructura
Un halo detrás del títuloColor
Fondo de cuadrículaImágenes
Un punto que late junto a «en vivo»Componentes
«Sin relleno. Solo resultados.»Textos
Letras apretadas hasta tocarseTipografía
El mismo espacio entre todoEstructura
Botón con degradadoColor
Fondo de puntitosImágenes
Borde con degradado que giraComponentes
Rápido. Simple. Seguro.Textos
Monoespaciada como disfraz técnicoTipografía
Grilla bentoEstructura
Franja final con degradadoColor
Rayas diagonales de rellenoImágenes
«Con la confianza de» y logos inventadosComponentes
Rayas largas por todos ladosTextos
La fuente del sistema como títuloTipografía
Filas en zigzagEstructura
Texto con degradadoColor
Grano y ruido para dar texturaImágenes
Testimonios que nadie escribióComponentes
Cifras redondas que nadie midióTextos
Sin escala tipográficaTipografía
Una columna angosta en el centroEstructura
Texto gris tan claro que no se leeColor
Carrusel de testimoniosComponentes
Juan Pérez, de Acme S.A.Textos
PALABRA — fragmentoTipografía
Disfraz de periódicoEstructura
Bordes que brillanColor
Una ventana con barras grisesComponentes
Cohetes y chispas en el textoTextos
Datos separados por puntos mediosTipografía
Neobrutalismo de plantillaEstructura
Una insignia de otro color para cada estadoColor
Una terminal inventadaComponentes
«¡Ups! Algo salió mal»Textos
Mayúscula Inicial En Cada PalabraTipografía
Un modal para todoEstructura
Avatares con iniciales y «+2.000»Componentes
«¿Por qué elegirnos?»Textos
Hero a pantalla completa con flechaEstructura
shadcn tal como vieneComponentes
Urgencia que se reinicia al recargarTextos
Menú en pastilla flotanteEstructura
Todos los campos obligatoriosComponentes
«El futuro de X ya está aquí»Textos
Logo, tres enlaces y un botónEstructura
Seis campos para un boletínComponentes
Textos que explican cómo usar un botónTextos
Pie con columnas de enlacesEstructura
El sello del generador olvidado en la esquinaComponentes
«Actualizado hace 2 minutos»Textos
Tres planes, el del medio «Más popular»Estructura
«No hay elementos todavía»Componentes
Llamar «teatro» a todoTextos
Preguntas frecuentes en acordeónEstructura
Hablar como el sistema y no como la personaTextos
Panel de control de plantillaEstructura
«Buenas tardes, Alex 👋»Textos
Oscuro y neón porque es «para desarrolladores»Estructura
Emojis en los títulosTextos
Cómo ver los patrones