متغیرهای سی اس اس ورودی هایی هستند که توسط توسعه دهنده تعریف شده و مقادیری را درون خود ذخیره می کنند تا بتوان از آن مقادیر بارها و بارها درون یک سند استفاده کرد.
سایت های بزرگ و پیچیده حجم CSS بالایی دارند که معمولا در این موارد مقادیر ویژگی ها دائما تکرار می شوند. به عنوان مثال یک رنگ خاص می تواند در صد مکان مختلف فایل سی اس اس مورد استفاده قرار بگیرد. حال فرض کنید بخواهیم آن رنگ را که تغییر دهیم باید در تمامی فایل ها و خطوط استایل به دنبال آن مقدار (رنگ) بگردیم و آن را با رنگ جدیدی جایگزین کنیم.
متغیرها جلوی این اتفاق را می گیرند، با استفاده از آنها می توان آن رنگ را در یک مکان ذخیره کرد و از آن به بعد در هرکجا که آن مقدار را لازم داشتیم به آن مکان اشاره کنیم. این یعنی برای تغییر فقط کافی است یک مکان را تغییر دهیم.
فایده دیگر متغیرها معناگرا بودن آنها است. به عنوان نمونه درک main-text-color به مراتب ساده از #03A9F4 می باشد.
https://www.aparat.com/v/TLKmz
