Really tons of widgets, handy scripts, css snippets, html codes and various tools are out there that you can use on your websites and blogs. These tools — if not used by default — can also inspire you to achieve your designing or usability goals. I came up with this list of 22 of most helpful stuff. Some of these are pretty old, but I you won’t believe how many people never even heard about them, but most of these brilliant ideas are easy to implement to your template, whether it is for Drupal, Wordpress, Joomla or even Zen-Cart and the like…
Highslide JS Gallery — Highslide JS is a piece of JavaScript that streamlines the use of thumbnail images on web pages. Great eye-candy addon.

ColorJack Sphere color-picker — This is an awesome color picker, simple to use and very intuitive, plus it is resizable. Awaiting for the IE compatible version.

Multi-Column Layouts out of the box — A really amazing approach of creating even height multi-column CSS layouts.

HTML drop shadows — The drop shadow may not be a designer’s most important tool, but on occasion the need arises to add some punch to a headline. One example could be for branding text that is positioned on top of an image; Depending on the colors of the image, your text might get lost without a shadow to pop it out.

Spiffy Corners — Spiffy Corners generates the CSS and HTML to create anti-aliased rounded corners. It doesn’t use Javascript or images.

Copy-paste CSS snippets — Some example code of CSS selectors. We tend to forget how flexible CSS can be. They may not work in wannabe-browsers (i.e. Internet Explorer)

IE PNG Fix — Smart solution to create transparent PNG images in IE 5.5+.

Plotr a graphing framework — This is a very lightweight charting framework (12kb!) named Plotr. It’s released under the BSD license. What a default piece of code.

Prettier Accessible Forms — Make web forms both pretty and accessible. Laying out forms where the form label and input are horizontally adjacent can be a hard task. Get rid of the default forms in templates!

Simple CSS rounded corner box — Another rounded corner box. I believe that evaluating more than one resource is a must if you want to cook by your own recipe.

Suckerfish HoverLightbox Redux — This is the improved version of Suckerfish HoverLightbox, a really creative way to embed image galleries into content. The Redux has a number of improvements, mostly visual, but some behavioral changes as well.

SyntaxHighlighter — This is to help a developer/coder to post code snippets online with ease and have it look pretty. It’s 100% Javascript based and it doesn’t care what you have on your server. Smart way to reduce overload and pass cpu work to the browser.

Simple CSS and HTML Link Buttons — Text-zoom proof CSS buttons for your website. Simple but effective styling.

YAV Form Validation library — A very flexible LGPL licensed Javascript-based form validation tool with multiple alert types.

Dragnet Button Collection — Yet another button gallery, over 130 button styles harvested on Dragnet. Great for inspiration.

Accessible and Unobtrusive tabs with JQuery — A very handy plugin for JQuery which enables nice tabbed content with options on effecting.

10 Free CSS Graph Resources — Maybe not so oftern but occasionally you want to display graphs and charts on your website. 10 CSS techniques for all your graphing needs.

ClickHeat | Clicks heatmap — A visual heatmap of clicks on a HTML page, showing hot and cold click zones. Comes very handy when evaluating new designs, testing usability or ad placement zones. It needs PHP of course.

CSS Rollover Generator — This is a very handy tool for creating CSS rollovers.

YAML layout — Yet Another Multicolumn Layout is a (X)HTML/CSS Framework for building your own layouts.

Valid CSS alert messages — Create nice and usable alert messages via CSS.

I like your Colors! — There is a form at the bottom of the page that lets you choose any URL you want to extract colors from. Brilliant color extractor stuff.




Nice list. Thank you for
Nice list. Thank you for your work!
Thanks for this
Thanks for this list. There are some quote old links, but I could get some new stuff as well. This heatmap stuff rocks, man. Can't wait to see the next part.