Less css compiler. Unable to use darken property

Question

I\'m developing a project using LESS as compiler for my CSS. I have already a fully working loop that sets the background color properly.

My question is this: With my cu

Answer 1

As mentioned by @seven-phases-max, ~'#@{color}' will not create a color but a string. To convert a string to a color, you can use color function.

@colors:
  "008B8B",
  "00CDCD",
  "00EEEE";

/* Colors and background loop (based on colors.less arrays) */
.loop-colors(@index) when (@index > 0) { // loop to generate rules for each color
  .loop-colors(@index - 1);// call for the next iteration
  @color: e(extract(@colors, @index));
  @hexColor:  ~'#@{color}';
  @border: 1px solid darken(color(@hexColor), 5%);
  &.col-@{color} {
    background: @hexColor;
    border: @border;
  }
}