Customizing Bootstrap CSS with LESS

For a complete list of available and up to date importable files, look here.

You have to require Bootstrap LESS (bootstrap_and_overrides.css.less) in your application.css

/*
 *= require bootstrap_and_overrides
 */

/* Your stylesheets goes here... */

To use individual components from bootstrap, your bootstrap_and_overrides.less could look like this:

// Core variables and mixins should be required before any customization occurs, or a LESS::Parser exception may occur.
@import "bootstrap/less/variables";
@import "bootstrap/less/mixins";

// Reset and dependencies
@import "bootstrap/less/normalize";
@import "bootstrap/less/print";
//@import "bootstrap/less/glyphicons"; // Excludes glyphicons

// Core CSS
@import "bootstrap/less/scaffolding";
@import "bootstrap/less/type";
@import "bootstrap/less/code";
@import "bootstrap/less/grid";
@import "bootstrap/less/tables";
@import "bootstrap/less/forms";
@import "bootstrap/less/buttons";

// Components
@import "bootstrap/less/component-animations";
@import "bootstrap/less/dropdowns";
@import "bootstrap/less/button-groups";
@import "bootstrap/less/input-groups";
@import "bootstrap/less/navs";
@import "bootstrap/less/navbar";
@import "bootstrap/less/breadcrumbs";
@import "bootstrap/less/pagination";
@import "bootstrap/less/pager";
@import "bootstrap/less/labels";
@import "bootstrap/less/badges";
@import "bootstrap/less/jumbotron";
@import "bootstrap/less/thumbnails";
@import "bootstrap/less/alerts";
@import "bootstrap/less/progress-bars";
@import "bootstrap/less/media";
@import "bootstrap/less/list-group";
@import "bootstrap/less/panels";
@import "bootstrap/less/responsive-embed";
@import "bootstrap/less/wells";
@import "bootstrap/less/close";

// Components w/ JavaScript
@import "bootstrap/less/modals";
@import "bootstrap/less/tooltip";
@import "bootstrap/less/popovers";
@import "bootstrap/less/carousel";

// Utility classes
@import "bootstrap/less/utilities";
@import "bootstrap/less/responsive-utilities";

If you'd like to alter Bootstrap's own variables, or define your LESS styles inheriting Bootstrap's mixins, you can do so inside bootstrap_and_overrides.css.less:

@link-color: #ff0000;