Запрет преобразования имени цвета переменной в шестнадцатеричное в меньшем количестве имен классов

Question

Я хочу использовать переменную, которая будет содержать название цвета (красный, синий, зеленый и т. Д.) И определить некоторые правила стиля класса. Например:

.mixins-common-components(@colorName, @backgroundColor, @textColor){
  .btn{
     &.@{colorName}{
         color: @textColor;
         background-color: @backgroundColor;
         border-color: "";
     }
  }
}

.mixins-common-components(blue, #3781f7, #4b8df8);

Это вернет мне что-то вроде этого:

.btn.#0000ff {
  color: #4b8df8;
  background-color: #3781f7;
  border-color: "";
}

Ну, то, как отображается.btn, это не нормально. Я хотел бы отобразить это так:

 .btn.blue{ ... }

Я заметил, что less автоматически преобразует название цвета в значение HEX. Я также пробовал с кавычками, но это, кажется, тоже не очень хорошее решение. Есть ли решение, чтобы исправить это элегантным способом?

Благодарю.