<div class="box">
  <span class="text">Border Gradient Effect</span>
</div>

body{
  background: #060c21;
}
.box{
  width: 200px;
  height: 200px;
  color: #fff;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 40px auto;
  padding: 10px;
  background: #060c21;
  box-sizing: border-box;
  border-radius: 5px;
  transition: 0.5s all linear;
}
.box::before{
    z-index: -1;
}
.box::after{
  z-index: -2;
  filter: blur(10px);
}
.box::before,
.box::after{
  content: "";
  position: absolute;
  top: -5px;
  left: -5px;
  right: -5px;
  bottom: -5px;
  background: #fff;
  background: linear-gradient(0deg, #2196f3, #060c21, #F00000);
  border-radius: 5px;
}

.text{
  font-family: sans-serif;
}