# Taste Skill: corrige el diseño genérico de IA con tres controles > Úsalo para orientar a tu agente hacia interfaces distintivas con movimiento, variedad y densidad visual deliberados. Verificado el 10 jun 2026. ## Taste Skill: corrige el diseño genérico de IA con tres controles Taste Skill es una skill que da a tu agente de programación con IA mejor criterio de diseño para que deje de producir el aspecto genérico de «contenido mediocre de IA», con degradados morados y tarjetas previsibles, al que recurren por defecto todos los modelos. La instalas una vez y tu agente la lee antes de escribir cualquier código de frontend. Tres controles ajustables te permiten acercar el resultado a tu gusto sin escribir una sola línea de CSS. ## Recursos - [Taste Skill en GitHub](https://github.com/Leonxlnx/taste-skill) - el repositorio oficial de Leonxlnx, 39,991 estrellas, MIT, creado en febrero de 2026. - [Instalador npx skills](https://github.com/obra/skills) - el instalador de línea de comandos que incorpora la skill a tu proyecto en una línea. - [Documentación de Agent Skills de Anthropic](https://docs.claude.com/en/docs/claude-code/skills) - información sobre qué son las skills de agentes y dónde se guardan. ## Cómo funciona Una skill es una carpeta de instrucciones que tu agente lee y sigue, y su archivo principal de instrucciones se llama SKILL.md. Taste Skill coloca tres controles numéricos al principio de SKILL.md: VARIANCE controla cuánto se aleja el diseño de los valores seguros por defecto, MOTION\_INTENSITY controla cuánta animación aparece y VISUAL\_DENSITY controla lo compacta que es la distribución. Cada control usa una escala del uno al diez, y los valores predeterminados son 8 para VARIANCE, 6 para MOTION\_INTENSITY y 4 para VISUAL\_DENSITY. Cuando editas esas cifras en SKILL.md, la siguiente generación de tu agente usa los ajustes nuevos y nunca tienes que reinstalar nada. ## Paso 1: instala la skill Abre tu terminal dentro del proyecto donde trabaja tu agente, porque la skill debe instalarse en esa carpeta. Ejecuta el comando de instalación siguiente para obtener la variante principal de diseño. ``` npx skills add https://github.com/Leonxlnx/taste-skill --skill "design-taste-frontend" ``` Este comando descarga la skill y la coloca en tu proyecto para que el agente la encuentre en la siguiente ejecución. ## Paso 2: confirma que se instaló la skill Conviene verificar la instalación antes de pedir al agente que construya nada, porque la ausencia de una skill falla en silencio. Comprueba que ahora existe una carpeta de skill llamada design-taste-frontend en tu proyecto y que contiene un archivo llamado SKILL.md. Abre SKILL.md y mira el principio del archivo. Deberías ver los tres controles con sus cifras, lo que indica que la skill se instaló correctamente y está lista para leerse. ## Paso 3: genera un frontend y observa cómo se aplica el criterio predeterminado Ahora pide al agente que construya algo para ver cómo la skill cambia el resultado. Pega esto en tu agente: ``` Construye la sección principal de una página de destino para una aplicación de productividad. Usa la skill design-taste-frontend para todas las decisiones de estilo y distribución. ``` Tu agente lee primero la skill y después escribe el código usando los controles predeterminados. Mira el resultado y observa que evita el degradado morado habitual y las tres tarjetas idénticas de características, porque la skill carga sus reglas de diseño en el agente antes de que recurra a sus propios valores por defecto. ## Paso 4: abre SKILL.md y ajusta los tres controles Si el aspecto predeterminado se acerca a tu gusto pero no encaja del todo, cambia tú las cifras. Abre SKILL.md y encuentra los tres controles al principio del archivo. Edita las cifras según lo que quieras; por ejemplo, baja VARIANCE a 4 para una distribución centrada más tranquila, sube MOTION\_INTENSITY a 8 para más movimiento ligado al desplazamiento o sube VISUAL\_DENSITY a 7 para un aspecto de panel compacto. Guarda el archivo, porque tu agente lee las cifras nuevas en la siguiente generación sin reinstalar nada. ## Paso 5: vuelve a generar con tus ajustes nuevos Pide al agente que reconstruya el mismo componente para compararlo con la primera versión. Pega esto en tu agente: ``` Reconstruye la sección principal usando los controles actualizados de design-taste-frontend. ``` Compara el resultado nuevo con el primero y comprueba que aparezca el cambio que hiciste, como más movimiento o una distribución más densa. Repite este bucle de ajustar y regenerar hasta que el resultado encaje con tu gusto. ## Paso 6: actualiza una página ya generada por IA con la variante de rediseño El repositorio incluye una variante redesign-skill que corrige páginas que tu agente construyó antes de tener orientación de diseño. Instala la variante de rediseño con el comando siguiente. ``` npx skills add https://github.com/Leonxlnx/taste-skill --skill "redesign-skill" ``` Después dirige a tu agente al archivo que quieres corregir. Pega esto en tu agente: ``` Rediseña la página existente en app/page.tsx usando redesign-skill. Conserva el contenido y la estructura, pero elimina el aspecto genérico de IA y aplica un criterio de diseño real. ``` Tu agente reescribe el estilo conservando el contenido, lo que te evita reconstruir la página desde cero. ## Paso 7: elige una variante que encaje con el aspecto que quieres El repositorio incluye varias variantes además de la predeterminada, cada una ajustada a un estilo concreto. Elige minimalist-skill si quieres distribuciones sobrias y contenidas, o brutalist-skill si quieres diseños crudos, de alto contraste y formas en bloque. Elige soft-skill si quieres superficies redondeadas suaves y colores tranquilos, o gpt-taste para un aspecto equilibrado de propósito general. Instala cualquier variante igual que la primera, cambiando el nombre tras la opción --skill, porque cada variante es otra carpeta de instrucciones que lee tu agente.