JSFiddle - React, Tailwind, and code Playground

by Livingston Samuel

HTML

<div class ="ms-logo">Microsoft</div>

CSS

.ms-logo {
    font-family: "Segoe UI";
    color: #747273;
    font-size: 60px;
    font-weight: bold;
    height: 82px;
    line-height:82px;
    padding-left:85px;
    position:relative
}
.ms-logo:before, .ms-logo:after { content:''; display:inline-block; width:3px; height:38px; top:0; left:0; position:absolute; background:#fff }

.ms-logo:before { border-left:38px solid #f8510c; border-right:38px solid #7eba00
}

.ms-logo:after { border-left:38px solid #00a3f4; border-right:38px solid #ffba00; top:41px;
}