JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
                    <div class="square bcolor">
                        <div class="info">
                            <div class="info-icon"><i class="fa fa-desktop fa-2x"></i></div>
                            <div class="info-title"><a href="#">design</a></div>
                        </div>
                    </div>
                </div>

CSS

.square {min-width: 270px;height: 270px;text-align: center;text-transform: uppercase;
position: relative;
}
.info {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  text-align: center;
}
  /*color settings*/
  .bcolor {background-color: #10c6fc;}