Defining Variable Variables using LESS CSS

Question

Say I have three separate color schemes that are used on various pages in a site. Each color has a a light, medium and dark tint defined, and the color scheme is defined by

Answer 1

To my knowledge, variable variable names are not supported in LESS. You could however restructure your declarations in a more semantic manner:

/* declare palette */
@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; 

/* declare variables based on palette colors */
@lt: @red-lt;
@md: @red-md;
@dk: @red-dk;

/* ...and only use them for main declarations */
body { background-color: @dk;        
  #container { background-color: @md;        
     p { color: @dk; }        
  }        
}  

This should let you switch between palettes quite painlessly by avoiding explicit color references.