1. Introduce un valor
Escribe un número en el campo de entrada. Puedes usar punto o coma como separador decimal.
Convertir Tailwind a píxeles
Este convertidor convierte instantáneamente. Ingresa un valor y el resultado aparece al instante.
Loading tool editor...
¿Cuándo necesitas convertir unidades Tailwind a píxeles?
Tailwind CSS usa una escala de espaciado donde cada unidad = 0,25 rem = 4 px (con raíz estándar 16px). Así p-4 = 1 rem = 16 px, p-8 = 2 rem = 32 px, w-64 = 16 rem = 256 px.
Este convertidor ayuda a los desarrolladores a traducir rápidamente valores de espaciado Tailwind a medidas exactas en píxeles para depuración, entrega de diseño y documentación.
Tailwind también tiene valores especiales: 0.5 = 2px, 1.5 = 6px, 2.5 = 10px.
Todos los cálculos se ejecutan localmente en tu navegador.
¿Cómo usar el convertidor?
2. Lee el resultado
El resultado aparece instantáneamente en el campo contiguo.3. Copia o invierte
Haz clic en Copiar o usa el botón Invertir para convertir en dirección opuesta.
¿Cuándo es útil este convertidor?
Depuración CSS
Verifica tamaños: p-6 = 24 px, m-8 = 32 px, gap-4 = 16 px.Entrega de diseño
Traduce clases Tailwind a valores en píxeles para diseñadores.Diseño responsivo
Breakpoints: sm = 640px, md = 768px, lg = 1024px, xl = 1280px.Configuración personalizada
Planifica escalas de espaciado personalizadas conociendo los valores estándar en px.
¿Qué hace diferente a este convertidor?
Privacidad total
Todos los cálculos se ejecutan localmente en tu navegador.Resultados en tiempo real
El resultado se actualiza instantáneamente mientras escribes.Conversión bidireccional
Convierte en ambas direcciones con un solo clic.Tabla de referencia
Una tabla con valores de conversión comunes y descripciones contextuales.
¿Cómo funciona el spacing de Tailwind?
Spacing de Tailwind = valor × 0,25 rem. Con raíz 16px: spacing × 4 = píxeles.
p-1 = 4px, p-2 = 8px, p-4 = 16px, p-8 = 32px, p-16 = 64px, p-64 = 256px.
Tamaños de fuente: text-sm = 14px, text-base = 16px, text-lg = 18px, text-xl = 20px.
¿Cómo funciona el spacing de Tailwind?
Spacing de Tailwind = valor × 0,25 rem. Con raíz 16px: spacing × 4 = píxeles.
p-1 = 4px, p-2 = 8px, p-4 = 16px, p-8 = 32px, p-16 = 64px, p-64 = 256px.
Tamaños de fuente: text-sm = 14px, text-base = 16px, text-lg = 18px, text-xl = 20px.
Escala de spacing de Tailwind
| Tailwind | rem | px (con raíz 16px) |
|---|---|---|
| 1 | 0,25rem | 4px |
| 4 | 1rem | 16px |
| 8 | 2rem | 32px |
| 16 | 4rem | 64px |
| 64 | 16rem | 256px |
rem
- 1
0,25rem - 4
1rem - 8
2rem - 16
4rem - 64
16rem
px (con raíz 16px)
- 1
4px - 4
16px - 8
32px - 16
64px - 64
256px
Convertir otras unidades a px
Explorar otros conversores de unidades
Preguntas frecuentes
Ayúdanos a mejorar nuestras herramientas
¿Tienes una idea, encontraste un error o quieres sugerir una función? Escríbenos – respondemos en 24 horas.