مبدّل السمة

للسمة ثلاث حالات وليست اثنتين: فاتح وداكن وتابع للنظام، وأكثر المبدّلات تنسى الحالة الثالثة، فتفرض على المستخدم اختيارًا لم يطلبه.

والطريقة أن تجعل كل الألوان متغيّرات CSS، وأن تتبع الحالة الافتراضية prefers-color-scheme، فإذا اختار المستخدم سمة بنفسه كتبتها في data-theme على العنصر الجذر فتتقدّم على الحالة الافتراضية.

وأضف color-scheme مع كل سمة، ليلوّن المتصفح الحقول وأشرطة التمرير بحسبها.