Neon Glow Button

<!-- Neon Glow Button · Bron: Uiverse · licentie MIT. Laat deze vermelding staan bij hergebruik. -->
<div class="jouw-container">
<div class="ngb-wrap"><button class="ngb"><span class="ngb__txt">Activeer</span></button></div>
</div>

/* Neon Glow Button · Bron: Uiverse · licentie MIT. Laat deze vermelding staan bij hergebruik. */
.ngb-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0a0a0a}
.ngb{position:relative;width:200px;height:62px;border:0;border-radius:14px;cursor:pointer;background:#141414;color:#fff;font:700 18px/1 'Switzer',sans-serif;letter-spacing:.04em;overflow:hidden;transition:box-shadow .35s,transform .2s}
.ngb::before{content:"";position:absolute;inset:0;border-radius:14px;padding:2px;background:linear-gradient(120deg,#F5480F,#ff8a3d,#F5480F);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity .35s}
.ngb::after{content:"";position:absolute;top:0;left:-60%;width:40%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent);transform:skewX(-20deg);transition:left .6s}
.ngb:hover{transform:translateY(-2px);box-shadow:0 0 22px rgba(245,72,15,.65),0 0 46px rgba(245,72,15,.35)}
.ngb:hover::before{opacity:1}.ngb:hover::after{left:120%}.ngb:active{transform:translateY(0) scale(.97)}.ngb__txt{position:relative;z-index:1}