CSS

【CSS】ネオンのようなCSSエフェクトNeon Style

May 5, 2017
neon

Neon StyleはネオンのようなCSSエフェクト。

CSS

.neon {
    color: rgba(241, 139, 129, .5);
    font-family: "Work Sans", sans-serif;
    font-weight: 100;
    font-size: 20vw;
    line-height: 1vh;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    transition: all .09s ease-out;
    cursor: pointer;
}
.neon:hover {
    color: rgba(241,101,89,1);
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.3), 0 0 150px #CC9999, 0 0 75px #CC9999, 0 0 10px rgba(241, 139, 129, 1);
}

HTML

<h1 class="neon">NEON.FX</h1>