JSFiddle - React, Tailwind, and code Playground

by Sir_Pepe

HTML

<div></div>
<div></div>
<div></div>

CSS

body {
    position: relative;
    background: black;
    margin: 5em;
}
div {
    background-color: white;
}
div:nth-child(1) {
    z-index: 1337;
    position: relative;
    left: 200px;
    height: 500px;
    width: 300px;
}
div:nth-child(2), div:nth-child(3) {
    position: absolute;
    top: 0;
    left: 0;
    height: 280px;
    width: 120px;
}
div:nth-child(3) {
    left: 580px;
}
/* Brust */
div:nth-child(1) {
    background: -webkit-linear-gradient(-45deg,
                                        white, white 24.75%,     /* Erster weißer Streifen */
                                        black 24.75%, black 25%, /* Schwarzer Streifen */
                                        white 25%, white 49.75%, /* Zweiter weißer Streifen */
                                        red 49.75%, red 50%,     /* Roter Streifen */
                                        white 50%, white 74.75%, /* Dritter weißer Streifen */
                                        gold 74.75%, gold 75%,   /* Goldener Streifen */
                                        white 75%, white         /* Vierter weißer Streifen */
                                       );
}

/* Ärmel links */
div:nth-child(2) {
    background: -webkit-linear-gradient(360deg,
                                        white, white 5%,      /* Kurzer weißer Streifen */
                                        black 5%, black 10%,  /* Erster schwarzer Streifen */
                                        white 10%, white 15%, /* Kurzer weißer Streifen */
                                        black 15%, black 20%, /* Zweiter schwarzer Streifen */
                                        white 20%, white      /* Weißer Rest */
                                       );
    -webkit-transform: rotate(25deg) translate(130px, -40px); /* Positionierung */
}

/* Ärmel rechts */
div:nth-child(3) {
    background: -webkit-linear-gradient(
                                        transparent, transparent 60%, /* Vor der Binde */
     ...