CSS3 generator

http://css3generator.com/

by nephics • 15 years ago

83 16 15 years ago

css3generator.com

ultrasaurus• 15 years ago

Nice, bookmarked, alongside the also excellent http://css3please.com/

stallker2• 15 years ago

uhm, css3please.com uses flash code; not bookmarked, sorry :)

atacrawl• 15 years ago

Where are you seeing Flash? I have Click2Flash turned on and I'm not seeing any annoying boxes with the word Flash in the middle.

mootothemax• 15 years ago

Great stuff! One small nitpick in Chrome 12: Go to Outline, enter values, see what happens. Select "Outset" or "Double" in the dropdown list, and if you move the cursor back to the dropdown, most times you'll hit one of the browser version graphics, sparking off the version display effect. Tiny issue really :)

Other than that minor issue, I really like this!

roryokane• 15 years ago

There is a bug in the color text fields. When you click on the text field, a color picker opens, but if you tab to the field, no color picker opens, leaving the user confused as to what format the text should be in. The color picker should open on focus and close on blur of a color field. I have seen this with color fields in Box Shadow and Outline, and if there are other color fields in other sections, the problem probably happens with them too.

I also have a suggestion: add a Randomize button to the right of the whole group of text fields (or anywhere else). When clicked, it would populate the fields with random valid values and update the preview. That way, the user can see the effect of the CSS and examples of the correct format to enter values into the text fields. This would be especially helpful for @Font Face, where the labels "Font Family" and "Font Name" don't make it clear what to type, and where putting various values in those fields produce no effect on the preview.

It also seems that some of the CSS you generate will have no effect on the preview at all, no matter what you enter - those sections are just to get the code to copy and paste. For these, I think you should either add movement or external files or whatever to the preview that will show the effect, or just hide the preview in those sections.

huckfinnaafb• 15 years ago

Linked from that site: http://www.colorzilla.com/gradient-editor/

Very useful for people terrible at making their own nice looking gradients.

hatter10_6• 15 years ago

I love this simple site. And it keeps getting better. Used it extensively in my site.

BasDirks• 15 years ago

instead of riding the hype, this guy actually keeps his site up-to-date (and has been for a while). kudos.

amadeus• 15 years ago

Nice little utility.

If interested, you should add these easing formulas:

https://gist.github.com/983364

liampmccabe• 15 years ago

Just joined to say nice work. As a web designer this will come in very handy. I've actually started to build a CSS3 builder with multiple layers so I can build my PSDs a little easier.

I'm thinking of posting it here when I deem it's at a worthy stage to get feedback. :)

chrisjsmith2• 15 years ago

Wholly useless. Doesn't work in IE.

chrisjsmith2• 15 years ago

I don't see why this is downvoted. I think people have forgotten the market share out there.

arrowgunz• 15 years ago

Sleek & Elegant: http://css3.me/

CSS3 generator

Related Stories