Visual Position
دقیق، قابل اعتماد، معمارانه
UI طرح تو طرح باید مثل یک دفتر معماری خوب رفتار کند: خلوت، دقیق، با خطوط روشن و تصمیم‌های واضح. قرمز برند نقش امضا را دارد، نه دیوار رنگی صفحه.
Brand System
راهنمای برند طرح تو طرح
این صفحه قراردادهای پایه برند برای UI جدید را نگه می‌دارد: رنگ‌ها، radius، spacing و حس بصری مناسب یک پلتفرم معماری و مسابقات معماری مطرح.
Color
رنگ‌های برند
پالت باید از دور جدی و حرفه‌ای باشد و از نزدیک برای وضعیت‌ها و اکشن‌ها واضح عمل کند.
Primary Red
اکشن اصلی، تاکید برند، لینک مهم
#d32f2f
--color-primary-500
Deep Red
hover، تیترهای تاکیدی، وضعیت جدی
#991b1b
--color-primary-700
TPLUS Primary
اکشن اصلی، هویت و تاکید در بخش فراخوان‌ها
#007979
--color-tplus-500
TPLUS Deep
hover، تیتر تاکیدی و سطح تیره در بخش فراخوان‌ها
#005858
--color-tplus-700
Architecture Green
موفقیت، رشد، تایید، مسیر مثبت
#4d7c0f
--color-secondary-500
Signal Amber
هشدار، نیازمند بررسی، توجه موقت
#f59e0b
--color-accent-400
Ink
متن اصلی و عنوان‌های عملیاتی
#1f2937
--color-body
Muted
توضیح، metadata، متن کم‌اهمیت
#6b7280
--color-muted
Background
پس‌زمینه اصلی صفحه و فضای تنفس اطراف کارت‌ها
#f5f8fd
--color-background
Surface
سطح‌های روشن مکمل برند برای بخش‌های Tailwind
#f5f8fd
--color-surface
Card
پس‌زمینه پنل‌های ثانویه
#ffffff
--color-card
Border
مرزبندی ظریف و جداکننده‌ها
#d9e5f2
--color-border
Radius
Radiusهای مجاز
برای برند معماری، گوشه‌ها باید کنترل‌شده باشند. فرم‌های بیش از حد گرد، حس محصول مالی/سرگرمی می‌دهند.
0
Sharp
خطوط پلان، جدول، divider و previewهای فنی
4px
Small
badge کوچک، thumbnail، chipهای متراکم
8px
Default
کارت، input، دکمه، پنل‌های اصلی
12px
Soft
dropdown، modal کوچک، کنترل‌های برجسته
999px
Circle
avatar، badge عددی، swatch رنگ
Spacing
Spacingهای مجاز
فاصله‌ها روی شبکه ۴px ساخته می‌شوند تا فرم‌ها، کارت‌ها و لیست‌های پروژه ریتم قابل پیش‌بینی داشته باشند.
space-1
4px
فاصله آیکن و متن خیلی نزدیک
space-2
8px
gap داخل button، chip و item کوچک
space-3
12px
فاصله کنترل‌های فرم متراکم
space-4
16px
padding موبایل، gap استاندارد لیست
space-5
20px
padding کارت‌های عملیاتی
space-6
24px
فاصله بین بخش‌های داخل یک کارت
space-8
32px
فاصله بین گروه‌های محتوایی
space-10
40px
padding عمودی sectionهای متوسط
space-12
48px
شروع/پایان sectionهای مهم
space-16
64px
فاصله صفحه‌ای برای hero یا blockهای بزرگ