JSFiddle - React, Tailwind, and code Playground

by Shashank D

HTML

<div class="zig">

</div>

CSS

.zig {
  margin: 1em auto;
  padding: 1em;
  border: solid 12px transparent;
  border-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='24' height='24' viewBox='0 0 24 24' overflow='visible' enable-background='new 0 0 24 24' xml:space='preserve'%3E%3Cpath fill='rgba(255,0,0,0.5)' d='M12,24 l12,12 l-12,-12 l-12,12z'/%3E%3C/svg%3E")
    6 fill round;
}