Globálne premenné vo vnútri selektorov v SASS

Ak zadefinujeme premenné, ktoré sa nachádzajú vo vnútri selektorov, tak ich môžeme použiť len v rámci danej úrovne vnorenia. Avšak, ak potrebujeme, aby bola premenná dostupná globálne, tak k jej hodnote pripíšeme značku !global. Pozrime sa na príklad:

styles.scssdiv {
  $height: 20px !global;
  height: $height;
}
#navbar {
  height: $height;
}

Výsledok kompilácie uvedeného kódu bude nasledovný:

styles.cssdiv {
  height: 20px; 
}
#navbar {
  height: 20px; 
}

styles.scss#main {
  $font-family: Arial !global;
  font-family: $font-family;
}
#navbar {
  font-family: $font-family;
}