comunidad · seleccionado · no oficial
Cursor Design
Cursor Design es el centro seleccionado por la comunidad para diseñar con Cursor: tutoriales, tweets, vídeos y plantillas, todo en un mismo lugar.
Iniciador Next.js + Tailwind para Prototipado con Cursor
Un andamiaje minimalista de Next.js App Router + Tailwind optimizado para prototipado rápido con Cursor — configuración sensata de tokens y estructura limpia para trabajar con prompts.
shadcn/ui — Componentes de copia-pega para flujos de trabajo en Cursor
Componentes React accesibles y sin estilos por defecto que posees en tu base de código — la librería de primitivos de referencia al solicitar a Cursor que arme landing pages y dashboards con Tailwind.
Tutorial COMPLETO de Cursor AI para Principiantes (2025)
awesome-cursorrules — Reglas .cursorrules curadas para cada stack
La colección más grande de la comunidad de archivos .cursorrules, incluyendo conjuntos de reglas de frontend y design-system que mantienen el output de Cursor consistente con convenciones de Tailwind, Next.js y componentes.
Cómo hacer un sitio web con IA — Cursor 2025
Generación de Activos de Marca y Conjuntos de Iconos con Cursor
Uso de Cursor para producir sistemas de iconos SVG, favicons e identidad visual coherente en código — definiendo una paleta y reglas de trazo una sola vez, luego generando marcas coincidentes y exportando activos listos para la producción.
Conversión de diseños de Figma con Cursor MCP
Construir una página de inicio con Cursor, shadcn/ui y Tailwind
De una app Next.js vacía a una landing page en producción: scaffolding con shadcn/ui, prompts en Cursor para layouts sección por sección, y uso de design tokens para mantener consistencia visual en hero, pricing y footer.
Una publicación de @volo_builds sobre diseñar con Cursor. Lee el original en X.
Cómo crear UIs hermosas con IA
Una publicación de @shadcn sobre diseñar con Cursor. Lee el original en X.
Una publicación de @jasonzhou1993 sobre diseñar con Cursor. Lee el original en X.
10x Mejor Diseño UI para Vibe Coders — Usa v0 Directamente en Cursor
Magic UI — Componentes Animados para Landing Pages Construidas en Cursor
Una librería de 150+ componentes React + Tailwind + Motion animados que funcionan perfectamente con Cursor para crear páginas de marketing con micro-interacciones pulidas.
Aplicar un Sistema de Diseño con .cursor/rules
Escribe un archivo de reglas design-system.mdc que fije la escala de espaciado, tokens de color, radio y tipografía para que cada componente que Cursor genere mantenga la identidad de marca — con ejemplos de reglas con scope y targeting con glob.
Reglas de proyecto para consistencia de diseño (.cursor/rules)
El sistema oficial de Reglas de Cursor te permite fijar instrucciones reutilizables y con alcance definido — incluyendo una regla de sistema de diseño que codifica tokens, espaciado y convenciones de componentes — para que cada generación mantenga coherencia de marca. Cubre formato MDC, globs, y reglas auto-adjuntas versus siempre activas.
Iniciador de Reglas del Sistema de Diseño para Cursor
Un paquete de reglas .cursor listo para usar que codifica escala de espaciado, tokens de color semántico, radio y tipografía para que la interfaz generada se mantenga coherente con la marca desde el primer prompt.
Una publicación de @rauchg sobre diseñar con Cursor. Lee el original en X.
DESIGN en v0, FINALIZA en Cursor
Diseñar UI en Cursor desde Capturas de Pantalla — Sin Figma
Un flujo práctico de Design Mode: pega referencias de Dribbble, Mobbin o Pinterest directamente en el chat del Agent, fija un archivo de reglas de sistema de diseño e itera hacia un componente pulido sin abrir Figma.
Una publicación de @builderio sobre diseñar con Cursor. Lee el original en X.
Flujo de Trabajo Diario de un Design Engineer en Cursor
Cómo los diseñadores que programan estructuran su setup en Cursor — reglas para tokens y accesibilidad, Playwright MCP para validaciones visuales, y un ciclo cerrado de prompt, revisar el diff y refinar los píxeles.
Una publicación de @joelunger sobre diseñar con Cursor. Lee el original en X.
Guía del Diseñador para IA: Por Qué Este Diseñador Cambió a Cursor
De Figma a Código en Cursor con el Servidor MCP Dev Mode
Cómo integrar el servidor MCP Dev Mode de Figma en Cursor para que el agente lea marcos, variables y Auto Layout directamente — convirtiendo diseños seleccionados en componentes React y Tailwind limpios y conscientes de tokens.
Configura el Servidor Figma MCP en Cursor
La configuración oficial para conectar el servidor Figma Dev Mode MCP a Cursor, permitiendo que el agente lea marcos seleccionados, variables y Auto Layout directamente — luego genera código que respeta tus tokens de diseño. Incluye el flujo de instalación MCP de Cursor y consejos de prompting.
Una publicación de @cursor_ai sobre diseñar con Cursor. Lee el original en X.
Una publicación de @elizabethlin sobre diseñar con Cursor. Lee el original en X.
Cursor para Prototipos Interactivos, Diseño de Sonido y Visualización de Datos
Una publicación de @patrickjs__ sobre diseñar con Cursor. Lee el original en X.
Prompting Cursor para Dashboards de Datos que No Se Vean Genéricos
Patrones para solicitar diseños de dashboards en Cursor — describiendo jerarquía de información, densidad de gráficos y estados vacíos desde el inicio, luego refinando con imágenes de referencia para que el resultado se sienta diseñado en lugar de templado.
Una publicación de @cursor_ai sobre diseñar con Cursor. Lee el original en X.
Cursor para Diseñadores (Taller Completo)
Cursor 2.0 — Interfaz Multi-Agente y Navegador Nativo
Cursor 2.0 reorganiza el IDE alrededor de agentes en lugar de archivos e incluye una herramienta de navegador nativo que el agente puede controlar para probar e iterar sobre la UI. La base sobre la que se construye el flujo de trabajo del Editor Visual, más Composer, el modelo de codificación de baja latencia desarrollado internamente por Cursor.
Una publicación de @cursor_ai sobre diseñar con Cursor. Lee el original en X.
Editor Visual de Cursor: Señala, Indica y Aplica
Un recorrido por el Editor Visual en navegador de Cursor — ediciones de diseño con arrastrar y soltar, un inspector estilo Figma para espaciado y tipografía, y el paso Aplicar que convierte ajustes visuales en JSX y Tailwind reales.
Una publicación de @cursor_ai sobre diseñar con Cursor. Lee el original en X.
Cursor 2.2 — Editor Visual, Modo Debug y Evaluación Multi-Agente
Changelog oficial de Cursor 2.2. Destacando el Editor Visual en navegador (Design Mode), Modo Debug, Evaluación Multi-Agente, diagramas Mermaid en Plan Mode y Chats Fijados — la versión que integró el diseño visual en el flujo del agente.
Editor Visual de Cursor — Modo Diseño para tu Aplicación en Vivo
El Editor Visual oficial de Cursor convierte la vista previa en navegador en una superficie de diseño: edición de layouts mediante arrastrar y soltar en el DOM, inspector estilo Figma para espaciado, color, tipografía y design tokens, controles de estado React, y un flujo de señalización y prompt que un agente confirma directamente en código real.
Una publicación de @cursor_ai sobre diseñar con Cursor. Lee el original en X.
Un Nuevo Editor Visual: Diseña Directamente en tu Codebase
Modo de Diseño de Cursor (Edición Visual) Explicado
Análisis profundo de Builder.io sobre el Modo de Diseño de Cursor — qué hace bien la barra lateral al estilo Figma para editar tu aplicación React en vivo, y las limitaciones honestas (sin selección múltiple, sin deshacer fácil, ediciones limitadas por LLM) versus una herramienta de diseño real.
Cursor Acaba de Eliminar la Entrega de Diseño
Un análisis detallado de cómo el Editor Visual de Cursor colapsa la entrega de diseño al desarrollador — editando la aplicación en vivo visualmente y persistiendo código real y revisable, de modo que no hay especificación separada que traducir.
¿Es el nuevo Visual Editor de Cursor un asesino de Figma? Tutorial
El Editor Visual de Cursor — Modifica Layouts Visualmente
Proyecto hermano de nexu.io
Open Design — el agente de diseño de código abierto que se integra con Cursor
Tu agente de programación actual — Cursor · Claude Code · Codex · Gemini · OpenCode · Qwen — se convierte en el motor de diseño, impulsado por 137 skills combinables y 150 sistemas portables DESIGN.md.