پیش‌نمایش زنده (iframe sandbox)
تمام‌صفحه
<h2 class="radikalwp-tx-gradient">رادیکال‌دبلیوپی<//h2>.radikalwp-tx-gradient {
font-size: 34px;
font-weight: 800;
background: linear-gradient(90deg, #6366f1, #ec4899, #f59e0b, #6366f1);
background-size: 300% 100%;
-webkit-background-clip: text;
background-clip: text;
color: transparent;
animation: radikalwp-tx-grad 4s linear infinite;
margin: 0;
}
@keyframes radikalwp-tx-grad { to { background-position: 300% 0; } }درباره این اسنیپت
رنگ گرادیانی که آرام داخل حروف جابه‌جا میشود؛ برای تیتر هیروی لندینگ‌ها جذابیت فوری می‌سازد. با background-clip کار می‌کند و روی همه مرورگرهای مدرن پشتیبانی میشود.
پرسش‌های متداول
بله، اندازهها با واحدهای نسبی و flex/grid ساخته شدهاند و در نمایشگرهای کوچک هم درست نمایش داده میشوند. اگر عرض ثابت دیدید، میتوانید آن را با max-width برای موبایل تنظیم کنید.
خیر؛ این کد بدون کتابخانه خارجی و فقط با CSS بهینه نوشته شده و حجم آن چند کیلوبایت است. انیمیشن‌ها روی GPU اجرا میشوند و تأثیر محسوسی بر امتیاز PageSpeed ندارد.
بله، این کد بهصورت کاملاً رایگان برای استفاده شخصی و تجاری ارائه میشود. تنها استفاده از آن در محصولاتی که صرفاً بازفروش همین کد باشند مجاز نیست.
امتیاز شما به این محتوا
میانگین امتیاز کاربران: ۴.۷ از ۷ رأی — برای امتیازدهی وارد شوید
دیدگاه‌ها (۰)
هنوز دیدگاهی ثبت نشده؛ اولین نفر باشید!