Glow Border Card
ホバーでボーダーがソフトに光るグローカード。
HTML
<div class="glow-card"> <div style="font-weight:700;font-size:15px;margin-bottom:6px">Pro Plan</div> <div style="color:#666;font-size:12px">Unlimited access to all features.</div> </div>
CSS
.glow-card {
width: 220px;
padding: 28px;
background: #fff;
border: 1px solid #eee;
border-radius: 14px;
cursor: pointer;
transition: border-color .3s, box-shadow .3s;
}
.glow-card:hover {
border-color: #c4b5fd;
box-shadow: 0 0 20px rgba(167,139,250,.15), 0 0 40px rgba(167,139,250,.05);
}