

Twitter Bootstrap Generator - bravolima
http://www.martinbean.co.uk/bootstrap-generator/

======
Periodic
After playing around with Bootstrap, I realized what a huge boon it was to my
projects (programmer lacking in design skills). One thing I like about it is I
don't have to pick colors. It does the border, button, text, and nav-bar
colors for me. I don't trust myself to pick my own colors! I would really like
a way to preview or be able to pick some other colors other people have made.
Maybe you could expose a perma-link to a set of config options so they are
easy to share.

I'm also amazed at how often I spot it now. Seems like it's everywhere.

~~~
mgcross
If you need a responsive grid with a similar aesthetic, check out Zurb's
Foundation: <http://foundation.zurb.com>

~~~
masterj
I believe bootstrap will be adding a responsive grid with bootstrap 2.0,
currently being developed in the 2.0-wip branch.

<http://bootstrap.io/Demo/Scaffolding>

~~~
mmahemoff
Yep, responsiveness is the main feature of 2.0. Arguably not as responsive as
other frameworks though as it doesn't use percentage widths to gradually scale
columns. For a given width range, the column widths are fixed.

------
sopooneo
I am really not trying to stir a pot here. I am truly looking to learn. But
the whole idea of bootstrap seems to go against other stuff I used to read
about how to use css. I understood that your markup should be semantic and
detached from you layout and style as much as possible. But when you use the
bootstrap grid to arrange your page, you are absolutely mixing content and
layout.

For me, I always thought actually fully separating markup and layout/styling
was a pipe dream, and unless you're going to absolutely fill your page with
id's and classes (a la zen garden) and spend enormous time tweaking things,
then a major overhaul will require changing markup anyway, so why bother? But
that seemed to fly in the face of advice I was reading. But using a grid seems
to fly in the face of that old advice too. So what's the deal? Do people no
longer think markup and styling/layout should be separated? Or was I just
misinterpreting what I read in the past?

~~~
cstejerean
It's still a good idea to separate markup and styling. In the interest of
getting things that look decent out the door quickly it's often necessary to
postpone ideological purity.

If your idea proves successful then over time you will need to evolve away
from bootstrap anyway, and you can get cleaner markup and style along the way.

If your idea proves unsuccessful, good thing you didn't waste too much time on
a pure semantic markup.

------
rmason
There's an entire ecosystem coalescing around Bootstrap and I love it. It's
the framework for the coders who are design challenged. I know more and more
people like me who are incorporating it in every project they build. In time
it will raise the minimum level design bar for the entire web.

------
andrewhillman
This is great. You should add a color picker to the text field boxes.

~~~
j45
Cool idea, in addition to the color picker you might want to let it change the
current page live via DOM manipulation so you can see what it will look like
before you download it.

------
pault
This is nice, but why not just use the variables in variables.less? That's
what they are there for.

------
nicpottier
What? No top bar customization? That is the biggest giveaway for Bootstrap and
the easiest way to differentiate your site.

Once you add that then you'll have something super useful. I've customized the
top bar color for a few different sites and it is a bit painful. (there was an
open bug about making it easier, haven't checked it lately though)

------
bravolima
just to clarify, I didn't create the generator. I saw it on the bootstrap
google group:

[http://groups.google.com/group/twitter-
bootstrap/browse_thre...](http://groups.google.com/group/twitter-
bootstrap/browse_thread/thread/917d87806e1c96e0)

The author wrote it in one evening which makes it even more impressive.

------
princeverma
Great. If you can add customization of top bar, it would be awesome. Thanks
for creating this tool.

------
cfontes
Very nice, being able to see the CSS applied to some generic HTML before
downloading would be cool too! Thanks for the nice work.

~~~
tstegart
Definitely! And also maybe include the base HTML file.

------
pgroves
I don't get it. What does this tool accomplish that isn't accomplished by
putting the collected color definitions in a second style sheet and
"cascading" it with the standard bootstrap.css? (I'm really asking not being
sarcastic.)

~~~
tlack
A lot of people can't/don't use LESS, which means that a lot of precompiled
rules have to be overriden in a tiresome way. For instance if you change the
grid sizes you have to adjust a couple different CSS attributes. This tool
generates everything in a precomputed easy to digest manner.

------
mdda
"No ending semi-colon is required." seems like a detail that could be handled
behind the scenes.

------
fourspace
This is pretty cool.

That said, a Bootstrap generator that generates LESS, which in turn generates
CSS? Seems overengineered. Almost all of these variables are in variables.less
anyway. I'd hope that anyone setting up Bootstrap has the skills to edit this
one file.

[https://github.com/twitter/bootstrap/blob/master/lib/variabl...](https://github.com/twitter/bootstrap/blob/master/lib/variables.less)

~~~
politician
Isn't that a bit like saying your refactoring IDE which generates some high-
level language which in turn generates machine code is over-engineered?

------
latchkey
If you can afford to be working with a bit of a moving target, don't waste
your time with the current version of BS. The 2.0-wip branch is vastly more
improved.

------
Griever
Excellent stuff! You may want to keep an eye out as Bootstrap 2 is probably
going to come out any day now if the Issues tracker on Github is any
indicator.

------
simonhamp
Great work Martin! Such a simple tool that makes Bootstrap more available to
everyone - not just those of blessed with Less skills ;)

If you do build anything using Bootstrap, please feel free to submit to Built
With Bootstrap:

<http://builtwithbootstrap.com/submit>

------
peterhunt
I would like a pre-set color palette option

------
josscrowcroft
This is awesome! But I want to be able to save my preferences on it, either by
permalinking them (useful-ish) OR in localStorage (better) or both (whoa yeah
party)

So it could have a 'save to localStorage' button, then a list of your previous
saved configurations in a side panel?

Excellent work!

~~~
josscrowcroft
Also - is the bootstrap generator on github?

------
sjp3
Using Rails and Twitter Bootstrap? Check out this extraction I put together
from a personal project that makes it super easy to generate Bootstrap-style
forms: <https://github.com/potenza/form-bootstrap>

------
sdoowpilihp
A huge benefit to this tool would be instant change feedback. Specifically,
given that this site uses bootstrap, it would be nice to see the changes you
put in to the various input fields change the css settings for the editor
itself.

------
clyfe
SASS & LESS formats maybe?

------
vessenes
Source Code would be nice. I wish to hack it a bit.

------
radagaisus
a nice addition would be a disable button. For example, I never use the grids.
Otherwise, great work!

------
keeptrying
Awesome job!

------
jsavimbi
I've found Bootstrap to be best employed as a basic framework for what I would
call working applications where the user is required to perform many
repetitive tasks on the application throughout their work day. It lends itself
very well for dashboards, admin consoles, backoffice and reporting tools, etc.
And Twitter, of course. I would use the most very basic scaffolding
(containers, rows and spans) for a marketing site, but it's also extremely
helpful for producing working wireframes.

To whit, over the past two weeks I completely redid a support application
using Bootstrap and my output CSS totals ~250 lines, whereas before it was
somewhere around ~2600 when it was all said and done. My current .js file has
two functions in it. I think we've found a winner here.

Another benefit is that a developer not well-versed in the front-end is easily
able to build a basic, functioning front-end to an app with small learning
curve, and I'm going to assume that they'll be able to work on an app that
already has it. Or so I hope, because after twelve years, I'm a little sick
and tired of writing said code.

