Skip to content

Instantly share code, notes, and snippets.

@ilatif
Created June 4, 2021 17:53
Show Gist options
  • Save ilatif/8b61089dd33d663a465e0c3a7d0191ac to your computer and use it in GitHub Desktop.
Save ilatif/8b61089dd33d663a465e0c3a7d0191ac to your computer and use it in GitHub Desktop.
<div>
<div class="first">
<div class="top first-color"></div>
<div class="right first-color"></div>
</div>
<div class="second">
<div class="top second-color"></div>
<div class="right second-color"></div>
</div>
</div>
<style>
body {
background: #222;
}
.first {
width: 100px;
height: 100px;
transform: rotate(-135deg);
margin-left: 32%;
margin-top: 18%;
}
.second {
width: 100px;
height: 100px;
transform: rotate(45deg);
margin-left: 41.5%;
margin-top: -10%;
}
.top {
width: 80px;
height: 30px;
border-top-right-radius: 10px;
border-bottom-left-radius: 5px;
}
.right {
width: 30px;
height: 70px;
margin-left: 50%;
}
.first-color {
background: #F2994A;
}
.second-color {
background-color: #2D9CDB;
}
</style>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment