Menu Search
Jump to the content X X
Smashing Conf New York

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf Barcelona, dedicated to smart front-end techniques and design patterns.

List of CSS Tools

What can be better than simple, useful and handy tools you can use “on the fly” in the development process? Whether you’d like to test font size, generate online-forms, create rollover-navigation, create a slide-show, format CSS code or optimize your code – you can use dozens of tools to make your life easier.

We’ve collected them. At least most of them, and compiled them in a brief and precise overview. And here what we’ve come out with – most useful CSS-Tools you can use developing tableless web-sites.
Links checked: May/14 2008.

Fonts Link

Forms Link

Layout Link

  • Colly’s CSS rollover generator
    CollyLogic CSS Multi-element Rollover Generator
  • Listamatic16
    not a tool but very useful! – one list, many options – Using CSS and a simple list to create radically different list
  • Listamatic217
    nested list options
  • List-O-Matic18
    Generate CSS-styled navigation menus based on list items
  • List-O-Rama!19
    Dreamweaver MX and UltraDev Zone – List-O-Rama will allow you to generate nice CSS inline menus in seconds

Misc Tools Link

  • CSS Love Child20
    The Man in Blue Experiment – I want the body of Site […] with the face of site […]
  • CSSVista
    CSSVista is a free Windows application for web developers which lets you edit your CSS code live in both Internet Explorer and Firefox simultaneously……
  • HTML and CSS Table Border Style Wizard21
    Use this wizard to experiment with table border styles and generate style source code.
  • Online CSS Scrollbar Color Changer22
    Change the scrollbar colors in an HTML page
  • S5Easy: Create S5 Slideshows Easy Online23
    Create your slideshow in only 3 steps
  • Spanky Corners24
    ‘Spanky Corners’ is an experimental technique for using only CSS to produce ’round-cornered content boxes’ with semantically pure markup. It does not require JavaScript to work

Formatters and Optimizers Link

Footnotes Link

  1. 1 http://www.somacon.com/p334.php
  2. 2 http://www.thenoodleincident.com/tutorials/box_lesson/font/index.html
  3. 3 https://www.typetester.org/
  4. 4 http://www.accessify.com/tools-and-wizards/accessibility-tools/form-builder/
  5. 5 http://www.maketemplate.com/form/
  6. 6 http://www.jotform.com/
  7. 7 http://www.jotform.com/
  8. 8 http://www.csscreator.com/version2/pagelayout.php
  9. 9 http://www.maketemplate.com/
  10. 10 http://www.neuroticweb.com/recursos/css-rounded-box/
  11. 11 http://www.neuroticweb.com/recursos/css-rounded-box/
  12. 12 http://www.wannabegirl.org/firdamatic/
  13. 13 http://www.ibdjohn.com/csstemplate/
  14. 14 http://www.positioniseverything.net/articles/pie-maker/pagemaker_form.php
  15. 15 http://www.scriptomizers.com/css/stylesheet_generator
  16. 16 http://css.maxdesign.com.au/listamatic/
  17. 17 http://css.maxdesign.com.au/listamatic2/index.htm
  18. 18 http://www.accessify.com/tools-and-wizards/developer-tools/list-o-matic/
  19. 19 http://www.dmxzone.com/ShowDetail.asp?NewsId=5618
  20. 20 http://www.themaninblue.com/experiment/CSSLoveChild/
  21. 21 http://www.somacon.com/p141.php
  22. 22 http://www.iconico.com/CSSScrollbar/
  23. 23 http://www.s5easy.com/
  24. 24 http://tools.sitepoint.com/spanky/index.php
  25. 25 http://www.cssdrive.com/index.php/main/csscompressor/
  26. 26 http://csstidy.sourceforge.net/index.php
  27. 27 http://www.cleancss.com/
  28. 28 http://www.lonniebest.com/FormatCSS/
  29. 29 http://iceyboard.no-ip.org/projects/css_compressor
  30. 30 http://www.cssoptimiser.com/
  31. 31 http://flumpcakes.co.uk/css/optimiser/
  32. 32 http://www.prettyprinter.de/
  33. 33 http://www.arantius.com/tools/tabifier.php
SmashingConf New York

Hold on, Tiger! Thank you for reading the article. Did you know that we also publish printed books and run friendly conferences – crafted for pros like you? Like SmashingConf Barcelona, on October 25–26, with smart design patterns and front-end techniques.

↑ Back to top Tweet itShare on Facebook

Sven is the co-founder and former CEO of Smashing Magazine. He's now writing at his Conterest Blog, where he focuses on blogs, content strategy and publishing — all in German.

  1. 1

    This opitimiser collects all your inline styles and creates classes for them then compresses them.
    Peace,
    Sam

    1
  2. 2

    Very nice! These tools are very handy!

    0
  3. 3

    Wow…. brilliant list!

    0
  4. 4

    Nice collection, thx!!!

    0
  5. 5

    oh, sweet. now, if i could just get them to help me fix my site

    0
  6. 6

    Very very helpful for me, thank you very much

    0
  7. 7

    WoW is all I can say. Thanks for these resources!

    0
  8. 8

    This list is god-given. Really sweet and can really help a lot of developers out there.

    0
  9. 9

    Just a kid in a candy store aren’t you Barry

    0
  10. 10

    Thank you for the useful list.
    -Nish

    0
  11. 11

    Thanks for this handy tools……

    very helpful…….

    0
  12. 12

    Thanks for these useful links to the CSS tools! I’ve used several of them now and I have to say that the Layout-o-matic is without a doubt a fave.

    Thanks again.

    0
  13. 13

    this is a great list, thankyou very much for the article

    0
  14. 14

    awesome article, tools are massivley handy thanks very much Smashing Magazine!!!

    0
  15. 15

    CSS Buttons will allow designers to quickly implement consistently looking, cross-browser, buttons regardless of the element used. CSS Buttons is a plug n’ play solution for Multilingual…

    0
  16. 16

    This list is amazing and so useful! Thanks so much! Does anyone know of a similar list of tools/tips for developers (especially PHP)?

    0
  17. 17

    and so is why this site is second to none. best regards

    1
  18. 18

    Oh, I hope I may point out that UITest.com features yet additional tools, not just related to CSS.

    0
  19. 19

    C marrant. Je suis tombé sur le site par hasard et j’ai me rendre compte de se qui m’attends en Inde. J’y vais dans 4 mois. Je suis vraiment impatient. Belles Photos, beaux “reportages”. Cool

    0
  20. 20

    Very useful stuff, I appreciate ur hard work. I am basically looking for navigation with submenus in it. Can you list an example of that sort. thanks

    0

↑ Back to top