نویسنده: Mahyarmi

کدهای آماده ساخت بج‌های وضعیت (Status Badges) درخشان و کوچک

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

ترفندهای CSS برای مدیریت صحیح فاصله حروف (Letter-spacing) در تایپوگرافی فارسی

  ترفندهای CSS برای مدیریت صحیح فاصله حروف (Letter-spacing) در تایپوگرافی فارسی نقشه راه: چطور فاصله حروف فارسی رو حرفه‌ای تنظیم کنیم؟ هدفزیبایی و خوانایی بی‌نظیر متن فارسی با کنترل دقیق `letter-spacing`. مشکلتایپوگرافی ضعیف و درهم‌برهم شدن متن فارسی بدون تنظیم مناسب فاصله حروف. راه حلاستفاده هوشمندانه از `letter-spacing`، `word-spacing` و فونت‌های مناسب فارسی. ترفند […]

طراحی تب‌های محتوایی (Content Tabs) متحرک با استایل‌های پیشرفته و مینیمال

# طراحی تب‌های محتوایی (Content Tabs) متحرک با استایل‌های پیشرفته و مینیمال رفیق برنامه‌نویس، اگه دنبال راهی هستی که محتوای سایتت رو شیک و جذاب‌تر نشون بدی، اونم جوری که هم کاربر لذت ببره و هم عملکرد سایتت حرفه‌ای باشه، پس درست اومدی. طراحی تب‌های محتوایی متحرک با استایل‌های پیشرفته و مینیمال، دقیقا همون چیزیه […]

ساخت جداول داده (Data Tables) کاملاً ریسپانسیو با اسکرول افقی ملایم

ساخت جداول داده (Data Tables) کاملاً ریسپانسیو با اسکرول افقی ملایم رفیق برنامه‌نویس، بیا قبول کنیم! هیچ‌کس از دیدن یه جدول داده بزرگ که تو صفحه موبایل نصفش رو به زور می‌بینی و باید چپ و راست اسکرول کنی، خوشحال نمیشه. انگار داری با یک غول ناخوانده دست و پنجه نرم می‌کنی که سر از […]

آموزش پیاده‌سازی افکت بزرگنمایی (Zoom on Hover) نرم روی کارت‌های وبلاگ

آموزش پیاده‌سازی افکت بزرگنمایی (Zoom on Hover) نرم روی کارت‌های وبلاگ رفیق برنامه‌نویس، سلام! اگه دلت می‌خواد کارت‌های وبلاگت جون بگیرن و بازدیدکننده‌هات یه تجربه کاربری جذاب‌تر داشته باشن، درست اومدی. امروز می‌خوایم با هم یاد بگیریم چطور یه افکت زوم نرم و حرفه‌ای رو روی کارت‌های وبلاگ پیاده‌سازی کنیم که با حرکت ماوس روی […]

کدهای 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) در طراحی سیال رفیق توسعه‌دهنده! اگه تا حالا دنبال یه راه حل بودی که وب‌سایتت مثل آب خوردن، روی هر صفحه‌نمایشی (از موبایل و تبلت بگیر تا لپ‌تاپ و حتی تلویزیون‌های بزرگ) بدون مشکل و با ظاهری بی‌نقص نمایش داده بشه، این مقاله دقیقا برای […]