LessCSS: Handling mixins that are not required by the markup

By default, all mixins are included by default in the output CSS file, even if they’re not used anywhere in the markup. To avoid that, simply add () at the end of the mixin name:

.mixin { // will show up in output CSS as a separate class
  color:red;
}

.mixin() { // will only show up in output CSS where it's been used
  color:red;
}

In both cases calling .mixin in other class will work and generate mixin where it’s needed, so:

.class {
  .mixin;
}

Outputs:

.class {
  color:red;
}