Individual AI skill · AI for Diseño Gráfico y Web

ui-component-stack-selector

Elige el stack de componentes UI correcto para cada proyecto web (daisyUI, Magic UI, Originkit, react-bits, shadcn/ui) según framework, licencia, tema y presupuesto de tokens, y establece cómo integrarlo sin ensuciar el design system. Triggers: qué librería de componentes, elegir UI kit, componentes animados, Tailwind components.

Source content · review pending Source language: ES

The English editorial version is not ready yet. The source content is shown in Spanish without automatic translation.

Choose how you use AI

For projects ChatGPT · Gemini · Claude For agents Cursor · Claude Code · Codex

See how to use it

Free ZIP · One canonical method · Usage example · Installation guide · Licence notices

What you receive

One method. No filler.

01
SKILL.md / Project instructions
The same method, wrapped for your way of working.
02
EJEMPLO-DE-USO.md
A prompt you can adapt to your case.
03
INSTALAR-CON-TU-IA.md
The route for web interfaces and agents.

Version: 1.0.1
Format: Platform-agnostic
Access: Free with account

From file to useful result

How to ask with this skill installed

Installing the skill gives your AI a method. Your request still has to provide the case-specific facts, constraints and expected output.

1Name the real task

Describe the decision or deliverable, not just the topic.

2Provide the evidence

Add source material, audience, limits and known facts.

3Define done

Set format, quality criteria and checks.

Adaptable starting prompt Replace the brackets with your case

Apply the "ui-component-stack-selector" skill to this task.

Goal: [describe the result you need]
Context: [company, audience, situation and constraints]
Source material: [paste or attach the relevant information]
Required output: [format, length and acceptance criteria]

Before producing the result, list any essential information that is missing. Do not invent facts. State assumptions and include a final verification checklist.

When to use it

Arrancas un proyecto web y hay que decidir la base de componentes antes de la primera pantalla
El cliente quiere "algo más vivo" y evalúas añadir componentes animados sin romper lo existente
Auditas un proyecto heredado con tres librerías conviviendo y hay que consolidar
Tu agente genera UI y quieres fijarle un stack concreto en el DESIGN.md para que no improvise

Choose the right scope

Packs that include this skill

Download only this method or take it together with the rest of its professional area.

This page

Individual skill

The smallest useful download, prepared for a web project or an agent.

Choose format →

Professional pack

AI for Diseño Gráfico y Web

This skill plus the other methods selected for this professional area.

Explore the pack →

Same method, different setup

Where will you use it?

We do not duplicate the skill for every platform. We keep one canonical method and explain the correct installation route.

01 ChatGPT

Use it as project knowledge and instructions.

Open web-interface guide → 02 Claude

Add it to a Project and keep the case material separate.

Open web-interface guide → 03 Agents and IDEs

Install SKILL.md in the path expected by your agent.

Compare agent guides →

Traceable by design

Source and licence travel with the file.

SkillsBundle catalogues material of its own and from third parties. Inclusion does not claim original authorship. The individual ZIP preserves the canonical catalogue path and includes the applicable licence notices.

Catalogue path: skills/verticals/diseno/skills/ui-component-stack-selector
Ficha origin: Extracted from SKILL.md

Read terms and licence policy →

Start with one real task

Install the method. Keep your judgement.

Choose format