Durante mucho tiempo un agente de código podía armar una interfaz que funcionaba y aun así se veía igual que todas las demás: la misma paleta tibia, el mismo serif de display, el mismo acento terracota. frontend-design, una de las skills que Anthropic publica oficialmente en su repositorio, corta esa inercia. En lugar de dejar que el modelo improvise CSS, le pide que se comporte como el design lead de un estudio chico: una dirección visual concreta, un riesgo estético justificado, y nada de plantilla.
¿Qué es frontend-design?
Es una guía de proceso para cuando el agente construye una UI nueva o rediseña una existente. No genera un componente suelto: obliga a fijar primero paleta, tipografía, layout y una firma —el único elemento por el que se va a recordar la página— y recién después escribe código.
El objetivo es que las decisiones se sientan hechas para ese brief, no recicladas de cualquier landing.
Cómo funciona
El flujo es brainstorm, explorar, planear, criticar, construir y volver a criticar. Primero arma un plan corto: cuatro a seis hex con nombre, dos o tres familias tipográficas con roles claros, un concepto de layout y esa firma. Luego revisa el plan contra el brief: si alguna pieza es el default que saldría para cualquier producto parecido, la cambia y explica por qué.
Recién ahí escribe el código, derivando color y tipo de ese plan. Mientras construye, se autocritica: un riesgo en un solo lugar, el resto disciplinado, y nada de decoración que no sirva al contenido.
La skill también trata el copy como material de diseño. Nombres de botones, estados vacíos y errores se escriben desde el lado de quien usa la pantalla, no desde cómo está armado el sistema.
Casos de uso típicos
Sirve para partir de un brief de una línea y salir con una landing que no se parece a la de la skill anterior, rediseñar un hero que ya se siente genérico, o forzar a un agente a justificar paleta y tipo antes de tocar el CSS de un proyecto real.
También encaja después de Impeccable: esa skill le enseña gusto; frontend-design le da el proceso para aplicarlo cuando escribe interfaz.
Adopción
Al ser parte del repositorio oficial de skills de Anthropic, se instala con el mismo flujo que webapp-testing y el repo ya supera las 170.000 estrellas. Es, junto con mcp-builder y webapp-testing, uno de los puntos de partida más útiles si el agente va a tocar frontend de verdad.
Ver el clip