Saltar al contenido
// tools · designer

Diséñalo en el móvil. Envíalo como código

Un canvas 2D con snapping inteligente, catorce componentes y preview responsive real — exporta HTML, CSS y SVG, o React, Vue y Svelte. La IA convierte un brief en una página.

Diseñador
14 componentes6 formatos de export7 modos responsiveIA brief→diseño5 plantillas

Un canvas que ayuda

Guías, capas y multi-página en la mano.

  • Snap a rejilla con etiquetas de distancia en vivo
  • Multi-selección, alinear y distribuir
  • Capas con lock, visibilidad y z-index

Responsive de verdad

Preview a anchos reales, no una simulación.

  • @media reales disparando en el preview
  • Auto-stack a móvil
  • Overrides por breakpoint, sin código

Brief a página

Describe una pantalla; revísala antes de aplicar.

  • Flujo de cinco fases: brief, preguntas, generar, revisar, aplicar
  • 20 tipos de página, 10+ estilos, 8 paletas
  • Score de auto-crítica antes de aplicar

Export a código de producción

De prototipo a codebase en un toque.

  • HTML, CSS y SVG, gratis
  • React (JSX), Vue (SFC) y Svelte
  • Media queries y overrides preservados

// spec

La ficha técnica

Componentes integrados14
Formatos de export6 formats
Plantillas5 + market
Modos responsive7 modes
Tipos de página IA20
Estilos / paletas IA10+ · 8
Zoom del canvas0.1–4×
Tokens de color

plan.free

  • ·Canvas y componentes completos
  • ·Preview responsive hasta desktop
  • ·Export HTML, CSS y SVG

plan.premium

  • +Export React, Vue y Svelte
  • +AI Designer, Align y Component
  • +Desktop-L y breakpoints custom
  • +Diseños desde plantilla ilimitados

// faq

Preguntas frecuentes

¿Se pueden diseñar pantallas de app visualmente en Android?

Sí. El diseñador visual es un lienzo de arrastrar y soltar con 14 componentes y zoom de 0,1x a 4x, que te permite maquetar pantallas de interfaz a mano y convertirlas en código real, no en un mockup estático.

¿Puede generar un diseño con IA?

Sí. Describe la pantalla que quieres y el asistente de diseño con IA crea un diseño inicial que puedes refinar, así no tienes que colocar cada elemento a mano: una forma rápida de pasar de la idea a una interfaz editable.

¿Admite diseños responsivos?

Sí. Puedes previsualizar diseños en 7 modos y 20 tipos de página para comprobar cómo se adapta un diseño a distintos tamaños de pantalla, y los design tokens mantienen coherentes el espaciado, el color y la tipografía cuando la pantalla cambia.

¿A qué formatos se pueden exportar los diseños?

Los diseños se exportan en 6 formatos y admiten design tokens, así tu trabajo visual se convierte en código o recursos reales y usables en vez de una imagen plana: puedes pasarlo al editor de código y seguir construyendo desde ahí.

¿El diseñador funciona sin conexión?

Sí. El diseñador se ejecuta por completo en el dispositivo en Android 9 y posteriores, así que puedes construir, previsualizar y exportar interfaces sin ninguna conexión a internet, igual que el resto de herramientas de PocketCode.

Llévatelo en el bolsillo

Android 9+ · ~250 MB · gratis