פתחו את ה-DevTools של GitHub ותחפשו את --color-accent-fg. תמצאו אותה מוגדרת ב-:root של ה-HTML - ערך אחד ש-GitHub משנה בשביל לעבור בין light mode לdark mode לhigh contrast mode. מאחוריה עומד עקרון שמניע כל Design System מקצועי: אל תכתוב צבע, פונט, או ריווח ישירות. תכתוב שם שמתאר מה זה, ותניח את הערך האמיתי במקום אחד.
לפני CSS Custom Properties, הדרך לעשות את זה הייתה Sass - preprocessor שנכתב ב-Ruby, צריך compilation step, ולא יכול להגיב לשינויים ב-runtime. ב-2017, כל הדפדפנים הודרניים תמכו ב-CSS Custom Properties. ב-2024, כל Framework גדול - Tailwind, MUI, Mantine, shadcn - בנוי מעליהם. אם אתם מפתחים Frontend בישראל ולא מבינים את המנגנון הזה, אתם עובדים בחושך.