Desarrollo
CSS Flexbox Generator
Build flexbox layouts visually — control direction, wrap, alignment, and per-item properties with a live preview and copy-ready CSS
Container Properties
Live Preview
1
2
3
4
Item 1 Properties
Generated CSS
.container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
align-content: stretch;
gap: 8px;
height: 200px;
}
.item-1 {
}
.item-2 {
}
.item-3 {
}
.item-4 {
}Sigue explorando
Otras herramientas de Desarrollo que te pueden gustar…
Formateador JSON
Formatea, valida y minifica JSON con resaltado de sintaxis y detección de errores
Probar
Codificador/Decodificador Base64
Codifica texto o archivos a Base64 y decodifica cadenas Base64 a texto legible
Probar
Codificador/Decodificador de URL
Codifica y decodifica componentes URL y parámetros de query string
Probar
Generador de UUID
Genera UUIDs aleatorios (v1, v4) o genera múltiples UUIDs en lote
Probar
Generador de Hash
Genera hashes MD5, SHA-1, SHA-256, SHA-512 desde texto o archivos
Probar
Tester de Regex
Prueba expresiones regulares con resaltado de coincidencias en tiempo real
Probar
Decodificador JWT
Decodifica e inspecciona JSON Web Tokens — ve header, payload y verifica firmas
Probar
Formateador HTML
Formatea y embellece código HTML con indentación correcta y resaltado de sintaxis
Probar