Powiedzmy, że mam trzy oddzielne schematy kolorów, które są używane na różnych stronach witryny. Każdy kolor ma zdefiniowany odcień jasny, średni i ciemny, a schemat kolorów jest zdefiniowany przez klasę w ciele. Załóżmy, że domyślny jest „czerwony” schemat kolorów. Lubię to:

Definicje kolorów:

@red-lt:   #121;
@red-md:   #232;
@red-dk:   #343;
@green-lt: #454;
@green-md: #565;
@green-dk: #676;
@blue-lt:  #787;
@blue-md:  #898;
@blue-dk:  #909;

Podstawowy przykład domyślnego stylu

body { background-color: @red-dk;
  #container { background-color: @red-md;
     p { color: @red-dk; }
  }
}

Przykład stylu innego schematu kolorów

body.green { background-color: @green-dk;
  #container { background-color: @green-md;
     p { color: @green-dk; }
  }
}

Chciałbym używać zmiennych, dzięki czemu nie muszę ponownie zapisywać wszystkich odmian kolorów dla każdego schematu, dzięki czemu mogę po prostu napisać coś takiego:

body.[color-var] { background-color: @[color-var]-dk;
  #container { background-color: @[color-var]-md;
     p { color: @[color-var]-dk; }
  }
}

… Ale nie mogę oprzeć głowy, jak to osiągnąć. Wsparcie…?