Cars & Vehicles

A high quality icon set of 3 transportations icons.

Media & Cartoons

Cool icon set of the famous cartoon Kung Fu Panda.

Sports

Football, tennis, baseball in vector format.

Food & Drink

Alcoholic icon set.

Web icons

For your web site.

Operative System icons

Some drive icons…

Computers

Computer folders Windows Vista ready.

Windows 7!

Fullsize icons of the new Window 7.

Animals

Cool birds!

Fantasy

Block creatures icon set.

Music genre Poster

Special event poster

Concert poster

Music Album

Welcome to this mini Web Design Tools Collection with theme of Music.

Vector Illustrations, Icons, Wordpress themes, Free Template, Premium Template and some web interface prototype for design inspiration.

Vector Ilustration

Da Pino Colada Illustrator Vector Graphics

Download

Fender Stratocast Vector Graphics

Download

Icons

Disc Jokey icons

Download

Acoustic guitar

Download

Some folders, some notes

Download

Textures

Old sheets of music

Download

100×100 icon sized textures

Download

7 unedited stock music textures by GerundResources

Download

Web Interface for design inspiration

MP Music band prototype

Mostafa Music website

Qtar music

Commercial [low cost] Template

4template

Wordpress free themes

City Night Life

Download

Master Plan

Downoad

Your cool buttons

In this tutorial we illustrate how to build a very cool button ideal for your web 2.0 website or blog. The steps are very simple and in less the 10 minutes you can obtain the graphics in the above images.

The tutorial

• Create a new Document. Size: (we suggest) width 200, height 50. Background transparent.
• Create a new Round rectangle with radius 4px.
• Modify the style of the layer created and select a Gradient overlay. Set the start color: for example #4096ee, and the second color to #276db4. The darkest color must be in the lowest section of the rectangle, so adjust the rotation. Add a drop shadow:
  You can have anything like this:
  
• Now create a new layer and draw a (fill pixel) rectangle with 25px of height, and the top side that overlap the top side of the previus layer. With the paint bucket tool change the color to #276db4, set the layer alpha to 80%.
• Modify the style of this layer. Set a pattern overlay loading this png, as the follow image:
• Add a layer mask and draw a gradient from white to black, from botton to the top. All the layers:
  
• Add the text you want with the Text tool.

That’s all. Now you can export to web device selecting your favourite image format. Remember to draw a background layer for Explorer 6.0- compatibility.

DHTML and Javascript solutions

My web design tools preformed a deep analysis on the various color picker javascript implementation showing a gallery of the more cool solutions.

You can see a list with some screenshots, the capabilities and some opinions of the libraries we have tested.

The gallery

• Farbtastic
  
  A JQuery based plugin, the best solution if you are already using this library. The capabilities of this colorpicker true WYSIWYG, uses the intuitive HSL color space rather than the more common HSB, the semplicity of the installation and configuration.




• Color Jack
  
  A DHTML javascript library. Capabilities: the lightness of the js. But if you must pay attention if you are using another javascript library (for example Prototype or JQuery) that defines the $ function.




• Colourmod
  
  It’s not free, but It’s cheap and very cool (10 $ for the unbranded version).




• Dojox
  
  For Dojo users, a color picker widget.




• MooRainbow
  
  Mootools based plugin, as the other best javascript framework you can associate callback function to user events (onChange, onComplete). Flexible installation and customization.




• Photoshop like
  
  A nice DHTML library that includes the S,V,R,G,B colors maps such as the photoshop color picker. It’s not tested in Firefox, and unlike other javascript Framework based libraries you must write some code to integrate in your web applications.

Ther are at least 200 plugins based on the jquery javascript library of various categories: Navigation, DOM, Integration, Browser Tweaks…

Ajax

In this article we analyze and we trace the plugins of Ajax category giving you also some tips and live examples. So, what’s the more helpful/useful for the plugins related to Ajax technology for your blog/website?

Note: stay tuned, because we keep up to date this list.

Facebox

Description: Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages. It’s easy to use and easy to drive programmatically — use it for error messages, confirmations, previews, galleries, etc.
Pro and cons: very useful and also cool plugin. You can use for sliding images but is helpful for form validation message, or previews of any type. The preview can be remote files (thanks to Ajax). The configuration is very simple and flexible, you can also have multiple Facebox in the same page and you can manage programmatically the library.
Live examples: Fam spam
Download

Form Plugin

Description: Full AJAX form support, including file upload capabilities. The primary methods for managing your form are ajaxForm and ajaxSubmit.
Pro and cons: very helpful plugin for POST and GET ajax forms invocations. You can use for example for generator webapp.
Live examples: Form style generator
Download

jquery.suggest, a “Google Suggest”-like autocompleter

Description: jquery.suggest, a “Google Suggest”-like autocompleter
jquery.suggest is my attempt at a jQuery autocompleter that functions much like Google.
Pro and cons: more cool than useful. Helpful in forms with long drop down menu list.
Live examples:
Download

ajaxContent

The plugin refers to an A tag and use the
Href attributes to make the call filling up a #ajaxContent div on the
page with the server resposnse.
The plugin manage:
1) the display of a loading message ( an img if you want )
2) the error message ( cutomizable) display if needed
3) the call of course
4) the loading data in the div
5) the event is click but is customizable as you prefer as of course
the target element.
Pro and cons: useful for loading images and other media or div block with preloading information and invoking callback function before and after the library invokations.
Live examples: Ajax-content
Download

JQchart

Ajax & Draggable Simple Chart on Canvas+jQuery . Beta. Interactive and cross-browser.
Pro and cons: very cool, useful for your for your benchmark article or your statistics without externalobject included in the page (for example excel or flash) or without including other libraries in your website.
Live examples: JQ chart
Download