I spent about 60 seconds trying to figure out how to clear the modal that comes up after clicking on "Button Builder". The "X" to close the dialog is so thin that I literally couldn't see it. That isn't good design.<p>Once I figured it out, neat tool.
By default the form builder gives you HTML like this:<p><pre><code> <form class="form-container">
<div class="form-title"><h2>Sign up</h2></div>
<div class="form-title">Name</div>
<input class="form-field" type="text" name="firstname" /><br />
<div class="form-title">Email</div>
<input class="form-field" type="text" name="email" /><br />
<div class="submit-container">
<input class="submit-button" type="submit" value="Submit" />
</div>
</form>
</code></pre>
Why wrap the h2 in div? Why labels are divs? Why the button is wrapped in div? Br elements?
Would be fantastic, if instead of having to provide individual colour shades for the button border, shadow, etc, I could just provide one overall colour and all other ones are derived from that.<p>Apart from that - a very useful tool indeed!
This is a great tool ; however my advice to any programmer who found this useful is to learn a CSS pre-processor like LESS or SASS+Compass (my preference).<p>I am programmer and I used to love WYSIWYG tools for building /styling buttons and forms; my favourite tool was Stylizer. However, once I began to get some level of understanding of SASS/Compass, I rarely use those tools. If and when I do use WYSIWYG tool, I copy a over the generated CSS as a SASS mixin.
Yikes. These generated forms are a semantic markup and accessibility nightmare. No legend or labels to be found. If you find yourself writing forms like this, please please seek out some resources[0] on how to approach them properly.<p>[0]<a href="http://www.gethifi.com/blog/html-forms-the-right-ways" rel="nofollow">http://www.gethifi.com/blog/html-forms-the-right-ways</a>
Nice tool. It would be good if you also allowed for manually entering certain values. For example, I might want to set the font-size to 16px because that is the font-size used by the rest of my stylesheet. With just the slider I don't really know how the text on my button will look next to the rest of my page.
Is it really dynamic if you have to enter a bunch of stuff to create the elements?<p>I was expecting from the title some kind of tool that would create the form on the fly. I guess I should have read more gooder.
I don't see the need for this tool, instead I like jsfiddle much better where you can edit the source directly instead using these controls. Generated CSS is not the best either.
I like it. Useful tool. Btw, I noticed that if I change the Text color to white, the text color button itself changes completely to white and i cannot see it anymore (IE8)
Selecting the colors one by one is really annoying; I would recommend something like the CSS gradient generation tool[0] where you can easily change the HUE, saturation and lightness of all the colors at once. Presets like theirs would be nice too.<p>[0]<a href="http://www.colorzilla.com/gradient-editor/" rel="nofollow">http://www.colorzilla.com/gradient-editor/</a>