Embellecedor CSS

Da formato legible a hojas de estilo CSS minificadas: una declaración por línea, llaves ordenadas y sangría correcta, también dentro de @media.

Cómo usar Embellecedor CSS

1. Completa los campos: Código CSS.
2. Si quieres ver cómo funciona, pulsa «Usar ejemplo».
3. Pulsa «Embellecer» y revisa el resultado.
4. Copia o descarga el resultado con los botones de debajo.

Ejemplo

Código CSS: body{margin:0;padding:0;font-family:Arial,sans-serif}.btn:hover,.btn:focus{color:#fff;background:#0b6bcb}@media (max-width:600px){.btn{width:100%}}

body {
  margin: 0;
  padding: 0;
  font-family: Arial,sans-serif;
}

.btn:hover,
.btn:focus {
  color: #fff;
  background: #0b6bcb;
}

@media (max-width:600px) {
  .btn {
    width: 100%;
  }
}

Para qué sirve

• Leer CSS de un sitio copiado o de una librería.
• Revisar estilos antes de editarlos.

Preguntas frecuentes