طرحهای تم Material 3 را به کد فلاتر تبدیل کنید

Parabeac – اکنون با تم های Google Material Design 3 سازگار است
با انتشار جدیدترین سیستم طراحی گوگل، Material Design 3، به روز رسانی در نحوه انتخاب رنگ ها در طرحواره های روشن و تاریک وجود دارد. Parabeac به تازگی پشتیبانی را در Parabeac Cloud و parabeac_core منتشر کرده است: اکنون میتوانید هنگام تبدیل تمها به کد فلاتر، بین Material Design 3 و Material Design 2 را انتخاب کنید.
به فایل به روز شده Figma Kickstart ما در اینجا نگاهی بیندازید.
تبدیل با Parabeac Cloud
برای تبدیل یک تم Material 3 با استفاده از Parabeac Cloud، فرآیند مانند قبل باقی میماند: به سادگی یک Theme Project ایجاد کنید، شاخه GitHub خود را انتخاب کنید، پیوندهایی به فایل Figma ارائه دهید و تبدیل کنید. برای دستورالعمل های دقیق تر، اسناد ما را بررسی کنید.
چه جدید است: پالت رنگ
بر اساس تن های کلیدی، 13 سایه سایه از 0 تا 100 ایجاد می شود. در انتهای طیف 0 سیاه واقعی (#FFFFFF) و 100 سفید سفید واقعی (#00000) است. از میان این زنگهای کلیدی، رنگهای پالت مشتق انتخاب میشوند.
Parabeac فایل Themes Figma Kickstart خود را بهروزرسانی کرده است تا این موضوع را منعکس کند – با آن در اینجا بازی کنید. برای استفاده از فایل Figma: صداهای کلیدی را ویرایش کنید و پالت تولید می شود. سپس، برای انتخاب رنگهای رنگهای روشن و تیره، از قطره چکان استفاده کنید تا رنگ مناسب را از گرادیان پالت انتخاب کنید.
دسترسی و کنتراست
یکی از اهداف اصلی پالت رنگ Google Material 3 بهبود دسترسی است. پالت رنگ جدید برای مطابقت با استاندارد WCAG 2.1 AA برای نسبت کنتراست طراحی شده است. این به این معنی است که متن و سایر عناصر مهم خواناتر هستند و به کاربرانی که دارای اختلالات بینایی هستند، پیمایش و استفاده از رابط را آسان تر می کند.
در حالی که مقادیر پیشفرض وجود دارد، مانند Primary روی Primary40 و On Primary روی Primary100، کاربر میتواند به صورت دستی از پالت تن کلیدی که میخواهد از چه سایهای استفاده کند – هر چند به خاطر داشته باشید که حداقل کنتراست خاصی وجود دارد که توسط مواد 3.
به روز رسانی تایپوگرافی
قراردادهای نامگذاری برای تایپوگرافی نیز اصلاح شده و چندین گزینه فونت جدید اضافه شده است.
نتیجه
چه در حال حاضر از Material Design 2 یا Material Design 3 استفاده می کنید، امیدواریم از Parabeac برای تبدیل طرح خود از Figma به Flutter Code استفاده کنید! برای کسب اطلاعات بیشتر به parabeac.com یا برای امتحان امروز به app.parabeac.com بروید.