پیش‌نمایش زنده (iframe sandbox) تمام‌صفحه
در حال بارگذاری پیش‌نمایش زنده...
<button class="radikalwp-btn-neon-pink">ورود به متاورس<//button>
.radikalwp-btn-neon-pink {
  padding: 13px 32px;
  font-family: inherit;
  font-size: 16px;
  font-weight: 600;
  color: #f9a8d4;
  background: #1b0a14;
  border: 2px solid #ec4899;
  border-radius: 12px;
  cursor: pointer;
  animation: radikalwp-neon-glow 2s ease-in-out infinite;
}
@keyframes radikalwp-neon-glow {
  0%, 100% { box-shadow: 0 0 10px rgba(236,72,153,.6), inset 0 0 8px rgba(236,72,153,.15); }
  50% { box-shadow: 0 0 26px rgba(236,72,153,.95), inset 0 0 14px rgba(236,72,153,.3); }
}

درباره این اسنیپت

دکمه تیره با حاشیه نئون صورتی که شدت درخشش آن مدام تغییر می‌کند؛ برای سایت‌های شب‌رو و مدرن. این دکمه برای فراخوان‌های اقدام (CTA)، فرم‌ها و ناوبری طراحی شده است. این المان در ویجت HTML المنتور، فایل قالب استاتیک یا هر پروژه PHP و HTML دیگری بدون تغییر کار می‌کند. برای تغییر حس بصری کافی است متغیرهای رنگ بالای کد را عوض کنید؛ بقیه چیدمان دست‌نخورده می‌ماند.

پرسش‌های متداول

بله، اندازه‌ها با واحدهای نسبی و flex/grid ساخته شده‌اند و در نمایشگرهای کوچک هم درست نمایش داده می‌شوند. اگر عرض ثابت دیدید، می‌توانید آن را با max-width برای موبایل تنظیم کنید.

خیر؛ این کد بدون کتابخانه خارجی و فقط با CSS بهینه نوشته شده و حجم آن چند کیلوبایت است. انیمیشن‌ها روی GPU اجرا می‌شوند و تأثیر محسوسی بر امتیاز PageSpeed ندارد.

بله، این کد به‌صورت کاملاً رایگان برای استفاده شخصی و تجاری ارائه می‌شود. تنها استفاده از آن در محصولاتی که صرفاً بازفروش همین کد باشند مجاز نیست.

امتیاز شما به این محتوا

میانگین امتیاز کاربران: ۴.۳ از ۴ رأی — برای امتیازدهی وارد شوید

دیدگاه‌ها (۰)

هنوز دیدگاهی ثبت نشده؛ اولین نفر باشید!

دیدگاه خود را بنویسید

کپچا

دیدگاه شما پس از تأیید مدیر نمایش داده می‌شود.

شاید بپسندی

پیش‌نمایش زنده اسنیپت

دکمه نئون آبی

نئون دکمه آبی
۵۲
۴.۵ (۸)
پیش‌نمایش زنده اسنیپت

دکمه نئون سبز

نئون دکمه سبز
۳۲
۴.۶ (۵)
پیش‌نمایش زنده اسنیپت

دکمه نئون درخشان

دکمه نئون درخشش
۸۰
۴.۶ (۱۲)