bfa4b7de8b
48 translated pages (de, es, fr, it, pl, ru) for the Programmable section: overview, AI Chat, Collaboration, JSX Renderer, CLI (inspecting, exporting, analyzing, scripting). CLI reference and MCP server pages copied as-is (mostly code/tables).
48 lines
2.2 KiB
Markdown
48 lines
2.2 KiB
Markdown
---
|
|
title: Chat con IA
|
|
description: Asistente de IA integrado con 87 herramientas para crear y modificar diseños.
|
|
---
|
|
|
|
# Chat con IA
|
|
|
|
Pulsa <kbd>⌘</kbd><kbd>J</kbd> (<kbd>Ctrl</kbd> + <kbd>J</kbd>) para abrir el asistente de IA. Describe lo que quieres — crea formas, establece estilos, gestiona el layout, trabaja con componentes y analiza tu diseño.
|
|
|
|
## Configuración
|
|
|
|
1. Abre el panel de chat con IA (<kbd>⌘</kbd><kbd>J</kbd>)
|
|
2. Haz clic en el icono de ajustes
|
|
3. Introduce tu clave de API de OpenRouter
|
|
4. Elige un modelo (Claude, GPT-4, Gemini, etc.)
|
|
|
|
Sin backend, sin suscripción — tu clave se comunica directamente con OpenRouter.
|
|
|
|
## Qué Puede Hacer
|
|
|
|
El asistente tiene 87 herramientas en estas categorías:
|
|
|
|
- **Crear** — frames, formas, texto, componentes, páginas. Renderiza JSX para layouts complejos.
|
|
- **Estilo** — rellenos, bordes, efectos, opacidad, radio de esquina, modos de fusión.
|
|
- **Layout** — auto-layout, alineación, espaciado, dimensionamiento.
|
|
- **Componentes** — crear componentes, instancias, conjuntos de componentes. Gestionar sobrecargas.
|
|
- **Variables** — crear/editar variables, colecciones, modos. Vincular a rellenos.
|
|
- **Consultar** — buscar nodos, leer propiedades, listar páginas, fuentes, selección.
|
|
- **Analizar** — paleta de colores, auditoría tipográfica, consistencia de espaciado, detección de clusters.
|
|
- **Exportar** — PNG, SVG, JSX con clases Tailwind.
|
|
- **Vector** — operaciones booleanas, manipulación de trazados.
|
|
|
|
## Prompts de Ejemplo
|
|
|
|
- "Crea una tarjeta con un título, descripción y un botón azul"
|
|
- "Haz que todos los botones de esta página usen el mismo radio de borde"
|
|
- "¿Qué fuentes se usan en este archivo?"
|
|
- "Cambia el fondo del frame seleccionado a un degradado de azul a púrpura"
|
|
- "Exporta el frame seleccionado como SVG"
|
|
- "Encuentra todos los nodos de texto con tamaño de fuente menor a 12"
|
|
|
|
## Consejos
|
|
|
|
- Selecciona nodos antes de preguntar — el asistente sabe qué está seleccionado.
|
|
- Sé específico con colores, tamaños y posiciones para resultados precisos.
|
|
- El asistente puede modificar múltiples nodos en un solo mensaje.
|
|
- Usa "deshacer" en el editor si no te gusta el resultado.
|