نویسنده: Mahyarmi

کدهای CSS برای ایجاد افکت نویز (Noise Texture) ظریف در پس‌زمینه‌های تیره

کدهای CSS برای ایجاد افکت نویز (Noise Texture) ظریف در پس‌زمینه‌های تیره 💡 راهنمای سریع: افکت نویز CSS برای پس‌زمینه‌های تیره رفیق برنامه‌نویس، دنبال یه بافت نویز (Noise Texture) ظریف و چشم‌نواز برای پس‌زمینه‌های تیره سایتت هستی؟ این مقاله نقشه راه توئه! اینجا یاد می‌گیری چطور با چند خط کد CSS، حال و هوای بصری […]

طراحی دکمه‌های شبح (Ghost Buttons) با انیمیشن‌های پر شدن رنگ پس‌زمینه

طراحی دکمه‌های شبح (Ghost Buttons) با انیمیشن‌های پر شدن رنگ پس‌زمینه 🚀 نقشه‌راه سریع: قلب طراحی دکمه شبح متحرک رفیق برنامه‌نویس، اینجوری باحال می‌شی! ✨ شناخت دکمه شبح ظاهری مینیمال با حاشیه‌ای ظریف، بدون پس‌زمینه. جذابیت بصری عالی. 🎨 هدف از انیمیشن پر شدن بازخورد بصری دلنشین به کاربر، مدرن‌سازی تجربه کاربری و افزایش جذابیت. […]

آموزش ساخت اسکلتون اسکرین (Skeleton Screen) برای لودینگ ظریف محتوا

آموزش ساخت اسکلتون اسکرین (Skeleton Screen) برای لودینگ ظریف محتوا سلام رفیق برنامه‌نویس! تا حالا شده منتظر لود شدن یه صفحه باشی و فقط یه صفحه سفید یا یه اسپینر خسته‌کننده رو ببینی؟ تجربه‌ی خوبی نیست، درسته؟ امروزه دیگه زمان اون رسیده که با این شیوه‌های قدیمی خداحافظی کنیم و لودینگ محتوامون رو با یه […]

کدهای آماده برای افکت‌های نوری داینامیک روی لبه‌های باکس (Border Glow)

کدهای آماده برای افکت‌های نوری داینامیک روی لبه‌های باکس (Border Glow) سلام رفیق برنامه‌نویس! اگه دنبال راهی هستی که به المان‌های وب‌سایتت جون بدی و توجه کاربر رو قشنگ بهشون جلب کنی، درست اومدی. امروز می‌خوایم بریم سراغ یه تکنیک خفن و چشم‌نواز: افکت‌های نوری داینامیک روی لبه‌های باکس یا همون Border Glow. این افکت‌ها […]

ترفندهای استفاده از توابع ریاضی CSS (calc, min, max, clamp) در طراحی سیال

ترفندهای استفاده از توابع ریاضی CSS (calc, min, max, clamp) در طراحی سیال رفیق توسعه‌دهنده! اگه تا حالا دنبال یه راه حل بودی که وب‌سایتت مثل آب خوردن، روی هر صفحه‌نمایشی (از موبایل و تبلت بگیر تا لپ‌تاپ و حتی تلویزیون‌های بزرگ) بدون مشکل و با ظاهری بی‌نقص نمایش داده بشه، این مقاله دقیقا برای […]

طراحی پاپ‌آپ‌های (Popup) خروج از صفحه با انیمیشن‌های ورود جذاب و بدون پرش

طراحی پاپ‌آپ‌های (Popup) خروج از صفحه با انیمیشن‌های ورود جذاب و بدون پرش رفیق توسعه‌دهنده! تا حالا شده کلی وقت بذاری روی یه پروژه و کاربر دقیقاً لحظه آخر بخواد از صفحه خارج بشه؟ اون لحظه است که پاپ‌آپ خروج درست و حسابی میاد وسط. اینجا یاد می‌گیریم چطور پاپ‌آپ‌هایی بسازیم که هم چشم‌نواز باشن، […]

آموزش ساخت شمارنده‌های (Counters) خودکار با استفاده از ویژگی counter-reset

آموزش ساخت شمارنده‌های (Counters) خودکار با استفاده از ویژگی counter-reset رفیق برنامه‌نویس، تا حالا شده بخوای توی پروژه‌هات یه لیست یا بخش‌بندی با شماره‌گذاری خاص خودت داشته باشی؟ یا اصلاً بخوای بدون دردسر جاوااسکریپت و کلی کد اضافه، تیترها و زیرتیترها رو خودکار شماره‌گذاری کنی؟ اگه جوابت مثبته، پس درست اومدی! ویژگی counter-reset در CSS […]

کدهای CSS برای استایل‌دهی به لیست‌های بولت‌دار و ساخت Custom Bullets

کدهای CSS برای استایل‌دهی به لیست‌های بولت‌دار و ساخت Custom Bullets اگه تا حالا با لیست‌های HTML سروکله زدی و دوست داشتی بولت‌های پیش‌فرض و تکراری رو بندازی دور و لیست‌های خاص و چشم‌نواز خودت رو بسازی، جای درستی اومدی. قراره اینجا یه سفر حسابی به دنیای جذاب CSS برای استایل‌دهی به لیست‌ها داشته باشیم […]

پیاده‌سازی افکت‌های ترانزیشن پیچیده و ترکیبی روی تصاویر هنگام هاور

پیاده‌سازی افکت‌های ترانزیشن پیچیده و ترکیبی روی تصاویر هنگام هاور سلام رفیق برنامه‌نویس! اگه مثل من دنبال اینی که وبسایت‌ها و اپلیکیشن‌هات جون بگیرن و کاربرا باهاشون ارتباط حسی عمیق‌تری برقرار کنن، حتماً می‌دونی که جزئیات کوچیک چقدر مهمن. یکی از این جزئیات، افکت‌های ترانزیشن جذاب و پویا روی تصاویر موقع هاور (Hover) هست. این […]

ساخت گالری تصاویر ماسونری (Masonry Layout) با ستون‌های متغیر در CSS

ساخت گالری تصاویر ماسونری (Masonry Layout) با ستون‌های متغیر در CSS رفیق برنامه‌نویس، تا حالا شده بخوای یه گالری عکس بسازی که مثل دیوار سنگی‌های قدیمی، همه تصاویرش چفت و بست بخورن و هیچ فضای خالی ناخوشایندی بینشون نمونه؟ همون چیزی که بهش می‌گیم Masonry Layout یا چیدمان ماسونری. این نوع چیدمان، مخصوصاً برای گالری […]