Border Image Generator

Use images or gradients as element borders with slice and repeat control.

Controls

Border Image Source

Slice30

Width15px

Repeat

Border Image

.element {
  border: 15px solid transparent;
  border-image: repeating-linear-gradient(45deg, #3b82f6, #ef4444 10px) 30 / 15px round;
}