html-css-javascript-online-editor-compiler

@import url(https://fonts.googleapis.com/css?family=Open+Sans);
body{
    text-align: center;
    min-height: 270px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Open Sans";
    border: 1px solid #efefef;
}
.btn-expand {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 25px;
  transition: all 0.5s ease;
  border-radius: 100px;
  text-decoration: none;
  color: inherit;
}
.btn-expand:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  border-radius: 100px;
  background: rgb(151, 3, 116, .15);
  width: 56px;
  height: 56px;
  transition: all 0.5s ease;
}
.btn-expand span {
  position: relative;
  font-size: 16px;
  line-height: 18px;
  font-weight: 900;
  letter-spacing: 0.15em;
}
.btn-expand svg {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke: #000;
  stroke-width: 2;
  transform: translateX(0px);
  transition: all 0.3s ease;
}
.btn-expand:hover{
  color: #fff;
}
.btn-expand:hover > svg {
  stroke: #fff;
}
.btn-expand:hover:before {
  width: 100%;
  background: #970374;
}

Press Ctrl+Space Key for Auto complete and Intelli Sense