Figma
Accede a diseños de Figma desde Claude Code. Extrae componentes, estilos y assets para implementar interfaces fieles al diseño.
✓ Verificado por Anthropic Diseño
by Anthropic
Accede a diseños de Figma desde Claude Code. Extrae componentes, estilos y assets para implementar interfaces fieles al diseño.
Navega a cualquier proyecto y ejecuta claude
O con Homebrew: brew install --cask claude-code
O con WinGet: winget install Anthropic.ClaudeCode
La brecha entre lo que diseña un equipo en Figma y lo que acaba en el código ha sido siempre un problema: el desarrollador interpreta el diseño a su manera, los componentes no coinciden exactamente, los tokens de diseño se pierden en la traducción... Figma conecta Claude Code directamente con tus archivos de Figma para que la implementación sea fiel al diseño desde el principio.
Claude puede acceder a los layouts, tipografías, colores, variables de diseño y componentes definidos en Figma, y generar código que respeta todo eso con precisión.
Desarrolladores frontend y equipos de diseño+desarrollo que quieren reducir el tiempo y los malentendidos entre el diseño y la implementación. Especialmente valioso cuando hay un sistema de diseño establecido que debe respetarse en todo el código que se genera.
Obtiene layouts, tipografías y esquemas de color de los frames de Figma en formato estructurado.
Importa variables y tokens de diseño directamente de Figma para usarlos en el código de forma consistente.
Mapea los componentes de Figma a sus equivalentes en el codebase, creando vínculos bidireccionales entre diseño y código.
Captura imágenes de los diseños para comparar la implementación con el diseño original durante el desarrollo.
Funciona tanto con Figma en la nube como con la aplicación de escritorio de Figma.
Implementa diseños (/implement-design), crea reglas del sistema de diseño (/create-design-system-rules) y conecta componentes (/code-connect-components).
¿Prefieres escuchar el contenido? Genera la narración de audio con un clic.
Categoría: Diseño
Autor: Anthropic
Estado: ✓ Verificado por Anthropic
¿También usas Skills en Claude?
Descarga más de 60 Skills listas para usar con Claude AI.
Ver todas las Skills →Describe lo que necesitas, deja que Claude te haga las preguntas clave y obtén una SKILL lista para publicar. Sin código, sin plantillas planas, sin dar vueltas. Directo al grano.