فیروزه
turquoiseسیستم طراحیسطحهای نیمهشفاف و مات روی یک پسزمینهی نورانی فیروزهای. کارتها پشتشون را محو نشون میدن و لبههاشون برق میزنه.
- زبان طراحی
- شیشهای
- حالت
- تیره
- توکنها
- ۴۴
- فونت
- تیتر با نوتو کوفی و متن با ایرانسنس
- فرم
- گوشههای ۱۲ تا ۲۲ پیکسلی
- عمق
- شیشهی مات با blur و سایهی عمیق
- حرکت
- ۲۸۰ میلیثانیه که آرام تموم میشه
- تراکم
- معمولی
کتابفروشی شهر، سفارش امروز
همین کامپوننتها در زبان «شیشهای». فونت، گوشه، خط، سایه و حس کلیک همه از توکنها میآن.
سبد خرید۳ کالا
جمع۲٬۴۸۰٬۰۰۰ تومان
اعلان ایمیلی
هدف ماهانه۷۲٪
نکتهها
- هر سیستم طراحی یک زبان کامله. کامپوننتها علاوه بر رنگ، فرم گوشه (--shape-*)، ضخامت خط (--line)، سایه (--depth-*)، حس کلیک (--press)، سرعت حرکت (--motion) و فونت تیتر (--type-display) را هم از توکنها میخونن.
- هیچ رنگ، گوشه، سایه یا مدت انیمیشن ثابتی داخل کامپوننت نیست. به جاش از کلاسهایی مثل rounded-control، border-line، shadow-surface و duration-(--motion) استفاده میشه.
- برای تم خودتون همین بلوک را کپی کنید، مقدارها را عوض کنید و روی html با data-theme بگذارید. --spacing تراکم کل صفحه را کم و زیاد میکنه.
- اگه تم فونت تیتر جدا داره (مثل لالهزار یا نوتو نسخ)، CLI خودش لینک Google Fonts را اضافه میکنه. دستی هم میتونید با next/font یا یک @import بارش کنید.
- تم روشن باید color-scheme: light داشته باشه تا کنترلهای بومی مرورگر و اسکرولبار هم روشن بمونن.