What is the correct way to "overwrite" bootstrap colors? (and optionally other CSS selectors)

Question

Searching on topic how to customize the original bootstrap CSS I mainly found power tools and generators what are emit a "patched" bootstrap.css to use instead the original.

I am very beginner in bootstrap, so first I would like to see clear the best practices before I invest hundreds of workhours to do something dumb and not recommended thing.

My question: Is this the way? I mean editing (automatically or manually) the bootstrap.css. Sounds not good for me, I am hoping I missed something.

Is there any alternative way, say creating a tiny mycustom.css and only define the differences there. Could anyone point out how to redefine just the standard colors?

Answer 1

Best option if you`re are beginner is to generate a new bootstrap.css with the oficial generator http://getbootstrap.com/customize/ and so you also could test changes in other Bootstrap variables. I think that overwrite css properties with your own CSS file can be painful sometimes...

Best option (need time to learn) is import Bootstrap as LESS (not CSS) and then create your own variables.less file, where you will define values for all Bootstrap variables that you want to overwrite.