AcademySkillsDiseño y medios

Claude-Code-Design-AI

Equipos de producto y de front-end que prototipan pantallas y quieren borradores de código a partir de referencias visuales.

  • Recomendadonuestra valoración
  • 84estrellas en GitHub
  • MITlicencia
  • hace 5 mesesúltima actualización

Úsalo ahora

git clone https://github.com/mikesheehan54/Claude-Code-Design-AI.git
README.md

Cargando el archivo...

Qué hace

Claude-Code-Design-AI es una skill de agente para Claude orientada al diseño de interfaces. Entre sus funciones figuran convertir una captura de pantalla en código React, generar CSS con Tailwind, crear iconos SVG y trabajar con shadcn/ui. El repositorio ofrece además un paquete descargable para empezar.

Casos de uso

  1. 01Crear componentes React a partir de una captura
  2. 02Generar iconos SVG y estilos con Tailwind CSS
  3. 03Prototipar una pantalla con una base de shadcn/ui

Preguntas sobre
Claude-Code-Design-AI.

¿Para qué sirve Claude-Code-Design-AI?

Equipos de producto y de front-end que prototipan pantallas y quieren borradores de código a partir de referencias visuales. Claude-Code-Design-AI es una skill de agente para Claude orientada al diseño de interfaces. Entre sus funciones figuran convertir una captura de pantalla en código React, generar CSS con Tailwind, crear iconos SVG y trabajar con shadcn/ui. El repositorio ofrece además un paquete descargable para empezar.

¿Cómo instalo Claude-Code-Design-AI?

Ejecuta en tu terminal: git clone https://github.com/mikesheehan54/Claude-Code-Design-AI.git

¿Claude-Code-Design-AI es de código abierto?

Sí. El código está publicado en GitHub (mikesheehan54/Claude-Code-Design-AI) con licencia MIT.

¿Es seguro usar Claude-Code-Design-AI?

Superó nuestro análisis automático de robo de credenciales, instrucciones ocultas y comandos de instalación peligrosos. Software de código abierto de terceros. Sabemos AI no lo mantiene. Revisa el código y los permisos antes de conectarlo a datos de la empresa.