Today we will discuss about creating an amazing stitched effect using CSS only. This type of effect can be easily created with the help of CSS border and box-shadow property. Complete CSS  and HTML code is given in this post, you just need to copy and paste the code. You can also customize this code according to your own requirements easily. Check the below given screenshot for demo of the code, the output of the code will be exact similar to screenshot.


<div class="stitched"><h1>Stitched</h1></div>


.stitched {
  background-color: rgba(231, 21, 100, 1);
  padding: 20px;
  margin: 20px;
  color: #fff;
  border: 2px dashed #dcdcdc;
  box-shadow: 0 0 0 4px rgba(231, 21, 100, 1), 1px 1px 6px 4px rgba(231, 21, 100, .4);
.stitched h1

Leave a Reply

Your email address will not be published. Required fields are marked *