Ui
طرح بالینی روی کاغذ مات
shadcn/ui کارگاهی برای ایجاد یک سیستم طراحی تک رنگ است: یک بوم سفید تمیز، سطوح خاکستری گرم و نرم و کارتهایی با شعاع بزرگ که روی ظریفترین حاشیهها قرار گرفتهاند. رابط کاربری تقریباً کاملاً بیرنگ است - متن سیاه، سطوح سفید، تُنهای ثانویه خاکستری - با یک رنگ قرمز واحد و مختلکننده که برای حالتهای خطا در نظر گرفته شده است و هیچ چیز دیگری. تایپوگرافی به بیطرفی هندسی Geist با ارتفاع حروف محدود روی صفحه نمایش متکی است و احساسی آرام و شبیه به کد ایجاد میکند که بیشتر شبیه زیرساخت توسعهدهنده است تا یک محصول مصرفی.
تصاویر مینیمال - سیستم تقریباً بهطور کامل از رابط کاربری تشکیل شده است. هیچ عکس، تصویرسازی یا گرافیک تزئینی کلیدی وجود ندارد. دموهای محصول به صورت ماکتهای اجزا (کارتها، فیلدهای ورودی، دکمهها) در یک شبکه ارائه میشوند که هم به عنوان مستندات و هم به عنوان محتوای بصری عمل میکنند. آیکونها خطوط هندسی نازکی (احتمالاً برگرفته از Lucide) با ضخامت ۱.۵ تا ۲ پیکسل و با کد رنگی #0a0a0a یا #737373 هستند که به صورت محدود به عنوان نشانههای عملکردی استفاده میشوند. زبان بصری، خود اجزای رابط کاربری است - صفحه به عنوان یک راهنمای سبک زنده عمل میکند، که در آن هر عنصر قابل مشاهده، یک عنصر طراحی قابل مشاهده است.
پالت
خنثی
- Canvas
#f5f5f5— پسزمینه صفحه، رنگآمیزی بیصدای سطح، دکمههای اضافی. - Paper
#ffffff— سطوح کارت، پسزمینههای پاپآپ، دکمههای اصلی - Surface Alt
#fafafa— پسزمینهی سایدبار، گزینهی کارت نامحسوس، حالت غیرفعال فیلد ورودی. - Ink
#0a0a0a— متن اصلی، سرتیترها، برچسب دکمهها، طرح کلی آیکونها. - Ink Soft
#171717— تصاویر پسزمینه دکمه با متن پر شده، متن اضافی روی سطوح روشن. - Mid Gray
#737373— متن اصلی، متن جایگزین، برچسبهای کمکی و آیکونهای پر شده در حالت سکون، همگی بیصدا هستند.
تایپوگرافی
از ۱۲ تا ۴۸ پیکسل · ۸ مرحله
- Geist — جایگزینی: Inter · طرح کلی 400, 500, 600 · تمام متن رابط کاربری - متن بدنه با وزن خط ۱۴ پیکسل/۴۰۰، عنوانها با وزن خط ۲۴-۴۸ پیکسل/۶۰۰ و دکمهها با وزن خط ۱۳-۱۴ پیکسل/۵۰۰. شکل هندسی حروف Geist و وزن خط یکنواخت آن، حس خنثی را برای ابزارهای توسعهدهنده ایجاد میکند؛ وزن خط ۶۰۰ با فاصله حروف ۴۸ پیکسل و فاصله حروف -۰.۰۵em، عنوانهای واضح و مطمئنی را تضمین میکند که به جای ویرایش، متفکرانه به نظر میرسند.
فواصل و فرم
| هدف | معنی |
|---|---|
| تراکم | متراکم |
| گام اساسی | 8px |
| شعاع دکمه | 18px |
| شعاع کارت | 24px |
| سایهها | بدون حاشیه به جای سایه |
| بین بخشها | 48-80px |
| عرض صفحه | 1280px |
هوش مصنوعی وبسایت شما را به سبک Ui میسازد و آن را پر میکند
- از طریق لینک - Instagram ، TikTok ، Facebook - محصولات و پستها را پر کنید.
- محتوا را از سایت قدیمی خود منتقل کنید—فقط آدرس را مشخص کنید.
- طراحی مدرن روی بهترین موتور: React ( Next.js) با رندر سرور و بهینهسازی سئو از پیش آماده.
- بهینهسازی سئو کاملاً خودکار برای نتایج جستجو و توصیههای شبکه عصبی.
سبکهای مشابه
- Ventriloc — رصدخانهای از دادهها روی کاغذ گرم - یک اخگر نارنجی که دقت تکرنگ را برجسته میکند
- Geniestudio — یک دفترچه یادداشت نرم در نور روز - از آن نوعهایی که حاشیههای پهن و یک ضربه قلم ضخیم دارند
- xAI — آزمایشگاه کرم گرم با قرص سیاه
- Cal — کاربردی بودن تک رنگ، یک رویکرد انسانی. سیستمی که وضوح و عملکرد را از طریق یک پالت سیاه و سفید دقیق در اولویت قرار میدهد، اما آن را با تایپوگرافی دوستانه و اشکال گرد ملایم میکند.
- Scale — یک آزمایشگاه عکس با کیفیت بالا در حد موزه، همراه با یک پروژه فنی
- Contractbook — قراردادهایی از کاغذ کرم رنگ زیر آسمان آبی آسمانی
- AutoSend — یک استودیوی سنگی دنج با یک نور بنفش واحد - جایی که تیترهای سریف و فراخوانهای نیلی روشن برای اقدام در یک فضای آرام و تقریباً سفید همزیستی میکنند.
- Air — مجسمه "آسمان نیمه شب از میان شیشه"
- SpatialChat — نبض بنفش روی کاغذ سفید
- Squarespace — گالری تک رنگ سینمایی
- Giga — افق نیمهشب بر فراز ابسیدین یخزده
- Supabase — یک ویرایشگر کد در نیمهشب با یک نقطه سبز فسفری—یک پالس کروماتیک واحد روی دریایی از غبار زغالسنگ