كيفية تعريف mixin واستخدامه في sass

يمكننا تعريف mixin كالتالي

@mixin main-color($color) {
  color: $color;
}

هذا ال mixin يقبل متغير وهة اللون الذي تريده, يمكن كل مرة استخدام mixin تمرير اللون الذي تريده, فمثلا يمكنك في عناصر الصفحة الرئيسية ليكن اللون الأبيض هو الذي سوف نمرره فيكون شكل الكود لعنصر موجود في الصفحة الرئيسية كالتالي

.main_page button{
	  @include main-color(#000);
}

كما تلاحظ لقد مررت اللون الأبيض , الآن سوف تطبق التنسيقات على العنصر المحدد وسوف يكون اللون الخاص به أبيض , وهكذا تستطيع تحديد لكل عنصر اللون الذي تريده