CSS3 is indeed a great improvement to the CSS specification. It allow web developers to add stylish effects to their websites, without any headaches. That said, several tools can definitely be life savers when building websites using CSS3. In this article, I have compiled the 10+ most useful tools for all your CSS3 coding.
Are you surprised that Internet Explorer 6/8 CSS3 support is almost non existent? I guess most of you aren’t. Unfortunately, some clients may want you to create a website that look like in a modern browser in IE. This is when CSS3 Pie is useful: It allows you to use most of the CSS3 cool features on IE.
→ Visit CSS3 Pie
Source: http://www.catswhocode.com/blog/10-useful-tools-to-simplify-css3-development
http://www.catswhocode.com/blog/10-useful-tools-to-simplify-css3-development
With this tool, you can design complex CSS3 boxes using an interface looking exactly like the one used for applying Photoshop effects. Definitely a great tool to save lots of time.
→ Visit CSS3 Builder
This one is quite similar to CSS3 builder, just use the sliders to visually design your drop shadow. Once done, just copy the CSS code which have been automatically created. Paste it to your css file, and you’re ready to go!
→ Visit CSS3 Drop shadow generator
This tool isn’t CSS3 specific, but it is so useful that it would have been a shame not to include it on that list. Cascader lets you input some HTML code and it will detect all inline CSS, remove it from the HTML and add it to a separate stylesheet. A true time saver for those looking for clean HTML.
→ Visit Cascader
→ Visit Border Radius.com
CSS3 allows you to create awesome buttons. This tool, created by Chris Coyier, makes CSS3 button design extremely easy: Just pick colors, adjust radius, and get the code, ready to be pasted into your CSS file.
→ Visit Button Maker
Need help with CSS3 declarations? This very handy generator helps you create declarations for most popular CSS3 properties: @font-face, RGBA, text-shadow, border-radius, and more.
→ Visit CSS3 Generator
Modernizr is a small script that detect support for CSS3 and adds classes to the
→ Visit Modernizr
Need to know if Internet Explorer 8 supports the
→ Visit HTML5 & CSS3 Support
As you can guess, this tool is a gradient generator. Just pick your colors using the picker, preview it in the preview area, and grab your ready-to-be-pasted code. It’s easy as that!
→ Visit CSS3 Gradient Generator
CSS3 Please is another very helpful site which allow you to copy and paste most common CSS3 declarations. It also has a preview area so you can live test your declarations.
→ Visit CSS3 Please
When coding, cheat sheets are very helpful to quickly remember properties and their syntax. Smashing Magazine has created this CSS3 cheat sheet that you can download and print. A preview version in .gif format is also available here.
→ Visit CSS3 Cheat Sheet
Source : http://css.dzone.com/articles/10-useful-tools-simplify-css3
Read More
CSS3 Pie
Are you surprised that Internet Explorer 6/8 CSS3 support is almost non existent? I guess most of you aren’t. Unfortunately, some clients may want you to create a website that look like in a modern browser in IE. This is when CSS3 Pie is useful: It allows you to use most of the CSS3 cool features on IE.
→ Visit CSS3 Pie
Source: http://www.catswhocode.com/blog/10-useful-tools-to-simplify-css3-development
http://www.catswhocode.com/blog/10-useful-tools-to-simplify-css3-development
CSS3 Builder
With this tool, you can design complex CSS3 boxes using an interface looking exactly like the one used for applying Photoshop effects. Definitely a great tool to save lots of time.
→ Visit CSS3 Builder
CSS3 Drop shadow generator
This one is quite similar to CSS3 builder, just use the sliders to visually design your drop shadow. Once done, just copy the CSS code which have been automatically created. Paste it to your css file, and you’re ready to go!
→ Visit CSS3 Drop shadow generator
Cascader
This tool isn’t CSS3 specific, but it is so useful that it would have been a shame not to include it on that list. Cascader lets you input some HTML code and it will detect all inline CSS, remove it from the HTML and add it to a separate stylesheet. A true time saver for those looking for clean HTML.
→ Visit Cascader
Border Radius.com
border-radius is one of the most popular CSS3 properties. Those who remember how boring it was to create boxes with rounded corners using images certainly know why. This tool allow you to quickly create a box and get the appropriate CSS3 code.→ Visit Border Radius.com
Button Maker
CSS3 allows you to create awesome buttons. This tool, created by Chris Coyier, makes CSS3 button design extremely easy: Just pick colors, adjust radius, and get the code, ready to be pasted into your CSS file.
→ Visit Button Maker
CSS3 Generator
Need help with CSS3 declarations? This very handy generator helps you create declarations for most popular CSS3 properties: @font-face, RGBA, text-shadow, border-radius, and more.
→ Visit CSS3 Generator
Modernizr
Modernizr is a small script that detect support for CSS3 and adds classes to the
<html> element which allow you to target specific browser functionality in your stylesheet. For example, if the browser does not support the multiple backgrounds functionality, a no-multiplebgs class will be added to the <html> element. then it will be pretty easy for you to fall back.→ Visit Modernizr
HTML5 & CSS3 Support
Need to know if Internet Explorer 8 supports the
text-shadow property? Just have a look to this very useful chart, which reveals CSS3 support for all major browsers. Definitely a page to have in your bookmarks!→ Visit HTML5 & CSS3 Support
CSS3 Gradient Generator
As you can guess, this tool is a gradient generator. Just pick your colors using the picker, preview it in the preview area, and grab your ready-to-be-pasted code. It’s easy as that!
→ Visit CSS3 Gradient Generator
CSS3 Please
CSS3 Please is another very helpful site which allow you to copy and paste most common CSS3 declarations. It also has a preview area so you can live test your declarations.
→ Visit CSS3 Please
CSS3 Cheat Sheet
When coding, cheat sheets are very helpful to quickly remember properties and their syntax. Smashing Magazine has created this CSS3 cheat sheet that you can download and print. A preview version in .gif format is also available here.
→ Visit CSS3 Cheat Sheet
Source : http://css.dzone.com/articles/10-useful-tools-simplify-css3
>
