Trình tạo hình ảnh dùng để tạo đường viền (Border Image Generator)

Công cụ này tạo ra các khai báo CSS `border-image` từ năm đầu vào: nguồn, slice, chiều rộng, outset và chế độ lặp lại. Nguồn chấp nhận bất kỳ giá trị `border-image-source` hợp lệ nào như `url(border.png)` hoặc bất kỳ độ dốc CSS nào. Hộp xem trước trực tiếp hiển thị kết quả trên viền `20px solid transparent`, và đầu ra được hiển thị cả dưới dạng viết tắt và dưới dạng các thuộc tính riêng lẻ.

1. Đặt Nguồn thành độ dốc hoặc `url(...)`. Mặc định là `linear-gradient(45deg, #f3ec78, #af4261)`. 2. Đặt Slice (mặc định `1`), Chiều rộng (mặc định `20px`) và Outset (mặc định `0`). 3. Chọn chế độ lặp lại: stretch, repeat, round hoặc space. 4. Xem trước được cập nhật trực tiếp. 5. Nhấp Sao chép để sao chép khối CSS đầy đủ, hoặc Tải xuống để lưu thành `border-image.css`.

Viết tắt được tạo: `border-image: <source> <slice> / <width> / <outset> <repeat>;`. Khối đầy đủ cũng liệt kê `border-image-source`, `-slice`, `-width`, `-outset`, `-repeat` riêng lẻ và bao gồm cơ sở bắt buộc `border: 20px solid transparent;`. Chế độ lặp lại: `stretch` (mặc định, масштабує cạnh), `repeat` (lát gạch không масштаб), `round` (lát gạch và kéo giãn để vừa toàn bộ ô), `space` (lát gạch với không gian bổ sung được phân phối).