رنگ بندی حرفه ای بوتسترپ متریال دیزاین (نسخه MDB v4 Pro )

25 فروردین 1400 برچسب‌ها:,

در این مقاله سعی داریم طبق آنچه در مقاله پیش قول دادیم رنگ بندی حرفه ای بوتسترپ را تشریح میکنیم. نسخه رایگان متریال دیزاین بوتسترپ را در سایت رسمی آن میتوانید پیدا کنید. برای دانلود نسخه پرو روی دکمه زیر کلیک کنید! در نسخه MDB v4 Pro  علاوه بر کمپوننت ها میتوان از template های اماده استفاده کرد.

دانلود نسخه MDB v4 Pro

اگر دکمه بالا را فشار دادید و نسخه حرفه ای متریال دیزاین بوتسترپ را دانلود کردید گام اول را برداشتید! حالا در ویدیو زیر میتوانید باقی راه را در چند دقیقه تماشا کنید. تمام کاری که برای یک رنگ بندی حرفه ای بوتسترپی لازم است داشتن تسلط روی رنگهاست.

همچنین دیگر لازم نیست به خاطر بسپارید که primary به رنگ آبی بود و warning به رنگ زرد بود. بلکه در نسخه پرو شما میتوانید همان رنگ را بنویسید. مثلا blue و yellow کافیست. میزان روشنایی و تیرگی این رنگ آبی یا زرد با نوشتن یک کلاس lighten-4 یا darken-4 به سادگی انجام میشود.

بنظرتان نسخه حرفه ای آن ساده تر از نسخه free نیست؟ پس حرفه ای بودن در پیچیده بودن نیست بلکه حرفه ای بودن یعنی ساده بودن و داشتن کدهای تمیز و خوانا!

رنگ بندی حرفه ای بوتسترپ: کلاس های همنام رنگ ها

همانطور که در ویدیو بالا مشاهده کردید با استفاده از کلاس های بسیار ساده blue green red purple هم میتوان رنگ پس زمینه را تغییر داد. نیازی نیست حتما از کلاس های primary secondary warning danger info استفاده شود.

روشن و تیره کردن رنگ ها

در وسط این تصویر کلاس های blue و darken-4 به ترتیب برای آبی کردن پس زمینه و تیره کردن رنگ آبی تا 4 درجه به کار برده شده اند.

نکته جدید و جالب و کاربردی که در انتهای ویدیو مشاهده کردید مربوط به روشن کردن و تیره کردن رنگ بود که با کلاس های lighten-4 و darken-4 انجام شد. میتوانستیم بجای درجه 4 از درجه های 3 و 2 و 1 هم استفاده کنیم.

در مقاله بعد درباره فاصله گذاری بحث میکنیم. اینکه چگونه با یک کلاس میتوان مارجین و پدینگ داد.