Генератор изображений границ

Этот инструмент генерирует объявления CSS `border-image` из пяти входных данных: источник, срез, ширина, outset и режим повторения. Источник принимает любое допустимое значение `border-image-source`, такое как `url(border.png)` или любой CSS-градиент. Живое окно предпросмотра отображает результат на границе `20px solid transparent`, а вывод показывается как в краткой, так и в полной форме свойств.

1. Установите источник в градиент или `url(...)`. По умолчанию `linear-gradient(45deg, #f3ec78, #af4261)`. 2. Установите срез (по умолчанию `1`), ширину (по умолчанию `20px`) и outset (по умолчанию `0`). 3. Выберите режим повторения: stretch, repeat, round или space. 4. Предпросмотр обновляется в реальном времени. 5. Нажмите Копировать, чтобы скопировать полный CSS-блок, или Скачать, чтобы сохранить как `border-image.css`.

Сокращение: `border-image: <source> <slice> / <width> / <outset> <repeat>;`. Полный блок также отдельно перечисляет `border-image-source`, `-slice`, `-width`, `-outset`, `-repeat` и включает требуемую основу `border: 20px solid transparent;`. Режимы повторения: `stretch` (по умолчанию, масштабирует стороны), `repeat` (плитку без масштабирования), `round` (плитку и растягивает для размещения целых плиток), `space` (плитку с распределением дополнительного пространства).