jwynia/frontend-design

Crea interfaces frontend distintivas y de calidad profesional con un alto nivel de diseño. Proporciona herramientas de análisis para auditar diseños existentes y herramientas de generación para crear paletas de colores, sistemas tipográficos, tokens de diseño y plantillas de componentes. Compatible con React, Vue, Svelte y HTML/CSS vanilla.

¿Qué es frontend-design?

Este skill, jwynia/frontend-design, está diseñado para ayudar a desarrolladores y agentes de IA a crear interfaces de usuario frontend con un alto estándar de calidad de diseño. Es especialmente útil para quienes necesitan ir más allá de los frameworks básicos y desean implementar diseños distintivos y listos para producción. El skill proporciona herramientas de análisis para auditar interfaces existentes, identificando problemas de diseño y accesibilidad, y herramientas de generación para crear desde cero paletas de colores, sistemas tipográficos consistentes, tokens de diseño reutilizables y plantillas de componentes. Soporta múltiples tecnologías frontend populares como React, Vue, Svelte y HTML/CSS vanilla, lo que lo hace versátil para diferentes proyectos. Al utilizarlo, los desarrolladores pueden mejorar significativamente la calidad visual y la coherencia de sus aplicaciones web, componentes o páginas, ahorrando tiempo en la fase de diseño y garantizando mejores prácticas de accesibilidad.

Compatible con~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/jwynia/agent-skills/tree/main/skills/frontend-design

Installed? Explore more Investigación y análisis de datos skills: affaan-m/uspto-database, affaan-m/scholar-evaluation, affaan-m/literature-review · View all 6 →

Preguntar en tu IA favorita

Abre un nuevo chat con esta habilidad de agente ya precargada.

Documentación

¿Qué hace frontend-design?

Crea interfaces frontend distintivas y de calidad profesional con un alto nivel de diseño. Proporciona herramientas de análisis para auditar diseños existentes y herramientas de generación para crear paletas de colores, sistemas tipográficos, tokens de diseño y plantillas de componentes. Compatible con React, Vue, Svelte y HTML/CSS vanilla. Utilízalo al construir componentes web, páginas o aplicaciones. Palabras clave: diseño, interfaz de usuario, frontend, CSS, componentes, paleta, tipografía, tokens, accesibilidad.

Individual skills in this repo

This repo contains 5 individual skills — each has its own dedicated page.

jwynia/godot-best-practices

Guide AI agents through Godot 4.x GDScript coding best practices including scene organization, signals, resources, state machines, and performance optimization. This skill should be used when generating GDScript code, creating Godot scenes, designing game architecture, implementing state machines, object pooling, save/load systems, or when the user asks about Godot patterns, node structure, or GDScript standards. Keywords: godot, gdscript, game development, signals, resources, scenes, nodes, state machine, object pooling, save system, autoload, export, type hints.

jwynia/pdf-generator

Create and manipulate PDF files programmatically. Use when the user needs to generate PDFs, fill PDF forms, extract PDF content, add watermarks/overlays, or merge documents. Supports both template-based generation (form filling, overlays) and from-scratch creation. Keywords: PDF, document, form, fillable, merge, watermark, extract, text, report.

jwynia/presentation-design

Design and evaluate presentations that communicate effectively. Use when designing a presentation, creating slides, getting presentation feedback, structuring a talk, or reviewing slides. Keywords: presentation, slides, talk, PowerPoint, Keynote, reveal.js.

jwynia/requirements-analysis

Diagnose requirements problems and guide discovery of real needs and constraints

jwynia/web-search-tavily

Search the web using Tavily API for high-quality, AI-optimized results with advanced filtering options. Use when you need structured search results, domain filtering, relevance scores, or AI-generated answer summaries. Requires TAVILY_API_KEY. Keywords: tavily, advanced search, filtered search, domain filtering, relevance scoring.

Skills relacionados