• Saltar a la navegación principal
  • Saltar al contenido principal

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Vibe coding
  • Product Design
  • Design system
  • Tutoriales de Figma
  • Blog
  • Newsletter
Design system / INPUT de formulario y más cosas

INPUT de formulario y más cosas

Ya está disponible la versión 1.2 del UX fomo Design system, con componente INPUT de formulario y otras novedades y mejoras.

componente input para figma
Variantes y propiedades del componente INPUT de formulario. del UX fomo Design system

Índice del artículo

Toggle
  • Componente INPUT de formulario
    • Chips
    • Tabs
    • Accordion
    • Button y Icon Button

Componente INPUT de formulario

En el directo del martes construimos juntos el componente Text field, hicimos solo la primera iteración.

Viene cargadita de variantes y propiedades.

  • Size: Por ahora está disponible en tamaño MD, mismo tamaño que los componentes Button y Icon button.
  • State: Enabled, Hovered, Typing, Filled, Error, Read only y Disabled.
  • Propiedades: Label, Show required, Show Optional, Optional, Show Left icon, Select Left icon, Placeholder, Show Right icon, Select Right icon, Show Del, Show Helper, message y Helper message.

Ojito, se añadirán más variantes en la actualización de la próxima semana.

Chips

Las variantes y estados del componente Chips son iguales a las de los componentes Button y Icon button.

Tabs

Las pestañas por ahora están disponibles en tamaños SM y MD, con variantes: Enabled, Hovered. Focused, Pressed, Disabled y Selected.

Este componente también recibirá actualizaciones en breve.

Ahora vamos con las mejoras:

Accordion

Aumentamos el contraste del container del componente accordion para mejorar la legibilidad y la accesibilidad.

Button y Icon Button

Hemos corregido algunos detalles menores que identificamos juntos en los últimos directos que hicimos en YouTube.

Ahora funcionan mejor y su integración es más fluida.

Consíguelo en Figma Community

Compartido bajo licencia Creative Commons 4.0

Si tienes alguna duda o quieres hacer una sugerencia, adelante.

Aprende sobre UX/UI + IA, Figma y Product Design

📣 Apúntate a mi newsletter semanal

🔥 Únete a la comunidad UX y UI fácil en Discord

🔴 Suscríbete al canal de YouTube para ver tutoriales

Acerca de Juanpol

Diseñando desde 1993 y todavía aprendiendo. Actualmente como Product Designer en Freepik, aquí comparto mis notas sobre lo que voy probando de UX/UI e IA.

Juanpol

Juanpol

Vibe Coding y diseño UX y UI con IA

  • Acerca de
  • info@juanpol.com
  • LinkedIn
  • GitHub
  • YouTube
  • Discord
  • Telegram
  • X | @juanpol

  • Aviso legal, Privacidad y Cookies

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes informarte más sobre ellas en los

Resumen de privacidad

Utilizamos cookies propias y de terceros para fines analíticos y para mostrarte publicidad personalizada o a partir de tus hábitos de navegación. Puedes cambiar la configuración u obtener más información consultando la política de cookies.

Cookies estrictamente necesarias

Las cookies estrictamente necesarias tiene que activarse siempre para que podamos guardar tus preferencias de ajustes de cookies.

Cookies de terceros

Esta web utiliza herramientas de estadística para recopilar información anónima tal como el número de visitantes del sitio, o las páginas más populares.

Dejar esta cookie activa nos permite mejorar nuestra web.

Política de cookies

Más información sobre nuestra política de cookies.