Generador de Imágenes de Bordes

Esta herramienta genera declaraciones CSS `border-image` a partir de cinco entradas: origen, slice, ancho, outset y modo de repetición. El origen acepta cualquier valor válido de `border-image-source` como `url(border.png)` o cualquier gradiente CSS. Una vista previa en vivo renderiza el resultado en un borde `20px solid transparent`, y la salida se muestra tanto en forma abreviada como en propiedades individuales.

1. Establece Origen en un gradiente o `url(...)`. Por defecto es `linear-gradient(45deg, #f3ec78, #af4261)`. 2. Establece Slice (por defecto `1`), Ancho (por defecto `20px`) y Outset (por defecto `0`). 3. Elige un modo de repetición: stretch, repeat, round o space. 4. La vista previa se actualiza en vivo. 5. Haz clic en Copiar para copiar el bloque CSS completo, o Descargar para guardar como `border-image.css`.

Abreviatura generada: `border-image: <source> <slice> / <width> / <outset> <repeat>;`. El bloque completo también enumera `border-image-source`, `-slice`, `-width`, `-outset`, `-repeat` individualmente e incluye la base requerida `border: 20px solid transparent;`. Modos de repetición: `stretch` (por defecto, escala los lados), `repeat` (mosaico sin escalar), `round` (mosaico y estira para ajustar mosaicos completos), `space` (mosaico con espacio extra distribuido).