LESS became interesting to me because it addressed a very ordinary problem. Front-end styles were full of repeated values, and repeated values have a habit of drifting.
A brand colour might be copied into buttons, headings, links and borders. A spacing unit might be used across cards, forms and navigation. At the time it usually felt quicker to copy the value where it was needed. Months later, that same convenience became a maintenance problem.
Variables gave those values a place to live. Instead of trying to remember which shade of blue was the correct one, the stylesheet could use a named value that represented the decision. That made the CSS easier to change and easier to discuss.
The Problem With Repeated Values
Repeated values are not always obvious during the first build. The page looks correct, the client signs off the design and everything seems fine. The problem appears later when a change needs to happen across the site. If the value has been copied manually, the developer has to decide which copies are deliberate and which are accidental.
That is where consistency starts becoming expensive. A small design change can turn into a search through the stylesheet, especially if the project has grown through several rounds of additions. Variables reduce that uncertainty because the repeated value is intentional.
Naming The Decision
The useful part of a variable is not only that it stores a value. It names the decision behind the value. @brand-primary means something different from @blue. One describes a role in the design. The other describes a colour.
@brand-primary: #2b6ca3;
@button-radius: 4px;
a {
color: @brand-primary;
}
.button {
border-radius: @button-radius;
}That might sound like a small distinction, but it matters when the CSS is revisited. A role-based name makes it easier to understand why the value exists and where it should be used.
Where LESS Fitted Into Bootstrap
Bootstrap helped make this kind of thinking more visible because it used LESS to control repeated front-end decisions. That made the framework feel less like a fixed collection of styles and more like a configurable starting point.
The important lesson was that variables could support consistency without forcing every project to look the same. The structure could remain familiar, while the values could be adjusted to suit the project.