CSS değişkenleri (custom properties) nedir? Sass değişkenlerinden farkı nedir?

CSS değişkenleri --ad: değer ile tanımlanır, var(--ad) ile kullanılır.

:root { --vurgu: #0e6f63; --bosluk: 16px; }
.btn { background: var(--vurgu); padding: var(--bosluk); }

.koyu-tema { --vurgu: #4fc3b0; }   /* bu alt ağaçta değer değişir */

Sass değişkenleri derleme zamanında sabit değere dönüşür ve tarayıcıda yoktur. CSS değişkenleri ise çalışma zamanında yaşar:

• Cascade ve kalıtıma uyar, bir alt ağaçta yeniden tanımlanabilir
• JavaScript ile değiştirilebilir: el.style.setProperty("--vurgu", renk)
• Media query içinde değiştirilerek tema (açık/koyu) yapılabilir

Tasarım sistemlerinde renk ve boşluk token'ları için standart yöntemdir.