Thursday, June 3, 2010

100 + free web elements sets

To be successful, every web and app designer has to communicate ideas to clients in a clear and effective manner. You can’t have clients imagine your ideas, the client has to SEE them. Web site mock ups are the perfect way to pass on your ideas so they can be approved or modified easily and efficiently. Here we have listed the best Graphic user Interface elements in the web. (GUI) From icons, to buttons, menus or scrolls, you will find everything you need to build your fancy mockup. In the case of icons, there are some of such high quality, that including these in your final designs is a must. Your blog will look a million bucks with these fantastic freebies.  So carry on and skim through these wonderful resources created by our community’s finest designers.

Icons

separator

1. Bitcons by P.J. Onori

bitcon-iconshock-icons-free
Massive set of 120 icons in 16×16, 32×32 & 64×64 pixels in 10 different colors.


2. Blogging icons by Iconshock

Blogging-Iconshock-best-icons
This set includes 5 icons in two sizes of PNG files (512px and 256px) as well as the source files (Illustrator).

3. Vector arrows by Gosquared club

gosquared-iconshock-icons-free
64 icons in AI, and SVG format.

4. Sanscons by P.J. Onori

sanscons-iconshock-icons-free
Sanscons was design specifically for you to use CSS with them. Due to their transparent background, you can apply any color or background image to them for a more custom fit. Styling the icons takes only a basic understanding of CSS. 120 Icons in 16×16, 32×32 & 64×64 pixels in 13 different colors.

5. Iconic by P.J. Onori

iconic-iconshock-icons-free
To give the greatest flexibility, the icon set packages all icons in PNG, SVG, SWC and Omnigraffle stencil formats. Iconic tries to work with various tools/workflows to make your life a bit easier. 8×8, 12×12, 16×16, 24×24 & 32×32 pixels.

6. Chalkwork HTML by Mezzoblue

Chalkwork-iconshock-icons-free
Featuring 31 graphical representations of common markup elements, available in 3 sizes and 6 file formats: transparent PNG, TIF, GIF, BMP, Windows ICO, and Mac ICNS.

7. Vector icons 5 Color set by Gosquared club

green-iconshock-icons-free
Each set contains 165 icons and they come in 5 colours that makes 825 icons in total. Each Icon zip pack contains Jpg, svg, and ai files.

8. Hand pointer by Khodjaev Stanislav

hands-iconshock-icons-free
36 hand pointer icons of 6 different types with 6 color variants. PNG and PSD format.

9. Mono by Jason Cho

mono-iconshock-icons-free
There are 108 simple icons included in this set. The icons are available in 32×32 px .png (transparent background) format.

10. Diagona by P.Yusukekamiyamane

diagona-iconshock-icons-free
Another massive set of 400 icons in PNG format (10×10 and 16×16 pixels)

11. Onebit by Zhebrakov Andrew

onebit-icons-free
Fantastic set that can fit almost any design. #0 icons at 48×48 in PNG format.

12. Flavour Extended by Oliver Twardowski

Flavour-extended-iconshock-icons-free
275 icons in PNG format 48×4. One of the highest quality icon sets around. This talented designer even includes the source PSD file.

13. Milky by Iconeden

Milky-iconshock-icons-free
The Milky set contains more than 131 icons primarily colored in green, giving an eye-pleasant look and prominent display on either dark or bright backgrounds. They come in 48×48 and 64×64 PNG format.

14. Ultimate icon set by Nishan

ultimate-iconshock-icons-free
The free download contains all 79 icons, sized at 256×256 pixels and available in both PNG and GIF formats. Very good detail at such small size. One of the best icon sets featured here.

15. Exploding boy pixel by Exploding Boy

explodingboy-iconshock-icons-free
31 free icons which can be used for application toolbars, content management systems, web applications, anything you like. They are divided into four different color sets — blue, pale blue, orange, and grey. They are ultra-simple, straightforward pixel icons.

16. Blog Icon Pack by SEM Labs

SEM-iconshock-icons-free
More than 200, 48×48 icons.

17. iCON Stage by Deziner Folio

iconstage-iconshock-icons-free
The set contains 49 free vector icons including PSD which can be useful for both corporate and personal setting. You can use the set for free — without any restrictions whatsoever.The icons are available in the .png-format in the resolution 128×128px. 100% pure shape-based layered PSDs are also included in the package.

18. Web Application set by Webappers

web-apps-iconshock-icons-free
There are 20 icons designed specially for web applications (e.g. Charts, Profile, Search, Add, Delete, Email, Print, Warning and etc…). Icons come in 3 sizes; 48×48 px, 32×32 px, and 24×24 px. All of them are in PNG format with transparent background.

19. 2experts icons by 2Experts icon set

2experts-iconshock-icons-free
Free 30 Icons set are created from scratch using Adobe Fireworks. The zipped pack contains (48×48, dimensions) PNG images, which you can use for free, on your Websites, blogs, projects etc. High contrast vibrant set.

20. Markup by Kostenlose

kostenklose-iconshock-icons-free
Mono chromatic tiny set in GIF format. 10×10.

21. Mini icons 2 by Brandspanking new

minicons2-iconshock-icons-free
Here are 113 10×10 grey scale icons in .gif format.

22. Media icons by Subrat Nayak

mediaicons-iconshock-icons-free
Media Icons is a high quality and free Leopard ready multimedia themed icon collection for Mac and Windows users that like to customize their apps’ icons.

23. Picol by Picol

picol-icons-free
PICOL is Melih Bilgils project for providing free and open icons for electronic devices.

24. Brightmix by Erin Brooke

brightmix-iconshock-icons-free
50+ icons all vector so you may resize, edit, and colorize to your heart’s content.

25. Token by brsev

token-iconshock-icons-free
128 unique icon designs each available in dark and light variants in ICO bundling at 256×256, 32×32 and 16×16 icons as PNG at 128×128. The set
also includes one PSD file including the layer styles for each resolution.

26. iphone toolbar icons by The working group

iphonetoolbar-iconshock-icons-free
Feel free to download this 160-piece set, and use it in on your own projects.

27. Twotiny by Paul Jarvis

tiny-iconshock-icons-free
TwoTiny Is a stylee little set of 80+ pixel perfect icons for use in interfaces or other webby application work. 16×16 in GIF format.

28. Oxe by Salvador Lopez

oxe-iconshock-icons-free
18 beautifully made 64×64px icons by this talented and young Mexican designer (under twenty) Comes in PNG format.

29. Graphic Push by Kevin Potts

push-iconshock-icons-free
20 monochromatic GIF icons at 8×8 pixels.

30. Drunkey love by Kevin Wetzels

drunkey-iconshock-icons-free
Huge set of 143 ultra tiny 10×10 PNG icons.

31. Office by Cicondesign

office-iconshock-icons-free
60 icons rendered at 256×256, 128×128, 64×64, 48×48, 32×32, 16×16 pixels in .png, ico and icns formats.

32. WIP by Xlphs

wip-iconshock-icons-free
49 icons in PNG format.

33. Cute blogging by Wicon

cuteblog-iconshock-icons-free
You can use these icons on your blog. Cute Blogging Icon Set includes Design, Download, Freelance, Part-time, Hire Me, Not Available, About Me, Services, My Blog, Contact. Size: 128, 64, 48, 32px)

34. Portfolio icons by Iconshock

Portfolio-iconshock-best-icons
One of the best Portfolio and blogging sets around. Superb detail and semi gloss finish. PNG, ICO and ICNS format.

35. Android Icons by Android icons

android-iconshock-icons-free
The package includes 30 PNG menu icons plus the additional source files for further customization.

36. Web Standard by Templay

webstandard-iconshock-icons-free
28 Icons for Webdesigner und Blogger in PNG format.

37. Diagram by Double-j

diagram-iconshock-icons-free
This is a set of 32 unique icons in various of colours.
The icons are available in 4 different sizes (32×32 pixels, 48×48 pixels, 64×64 pixel, and 96×96 pixels) and come as 32-bit transparent PNG files. The icons are also available in vector format (Adobe Illustrator CS4 AI format)

38. Ginux by Kyo Tux

ginux-iconshock-icons-free
86 icons at 64×64 in PNG and ICO format.

39. 32px mania by Midtone

32mania-iconshock-icons-free
179 32×32 perfect little works of art.

40. August by Austin Heller

august-iconshock-icons-free
Includes 85 icons at 32×32px in PSD format.

41. Kde Icons by Cd9

kde-iconshock-icons-free
48 Free stock icons can be used in most website and apps. Only png format and size is 24 x 24 px

Sketching and Wireframing

separator

42. Menus and Buttons by Yahoo!

menus-iconshock-icons-free
Menus and buttons stencil from the Design Stencil kit in the Yahoo! Design Pattern Library. Template for use in Omnigraffle.

43. iphone Sketch by Soup industries

iphone-sketch-iconshock-icons-free

44. Developers stencil kit by Yahoo!

yahoo-GUI-iconshock-icons-free
Yahoo! Design Stencil Kit version 1.0 is available for OmniGraffle, Visio (XML), Adobe Illustrator (PDF and SVG), and Adobe Photoshop (PNG), and covers almost everything you need for any kind of app development. This is one of the most massive sets on the list and features Calendars, Carousels, Charts and Tables,Form Elements, grids, Menus and Buttons, Navigation and Pagination, OS Elements, tabs and many more.

45. Maemo 5 by Ansoni

maemo-iconshock-icons-free
A Maemo5 UI Stencil set for designing GUI’s for the N900. Template for use in Omnigraffle.

46. GUI Layout and Widgets by Psheridan

extjs-iconshock-icons-free
This is the updated version of our popular Ext JS Omnigraffle stencil. This update contains many improvements and additions, namely that we were able to recreate most Ext JS elements as graffletopia shapes or groups. This is especially helpful for resizing titles, tables cells, and so on.

47. Controls by Yahoo!

controls-iconshock-icons-free
Controls stencil from the Design Stencil kit in the Yahoo! Design Pattern Library. Template for use in Omnigraffle.

48. ipad and iphone design by Da5id

ipad-iphone-iconshock-icons-free
Design your application for iPhone, iPod touch and iPad devices with this exhaustive set of stencils. All stencils have been originally created by hand with native OmniGraffle shapes and groups and can be scaled, resized and exported to other vector formats in Graffle. The stencils represent the actual controls and views that are available to developers in the iPhone OS SDK and follow recommended application styles as discussed in the iPad and iPhone Human Interface Guidelines.

49. Touch Gesture Reference Guide by Luke W

gestures-iconshock-icons-free
The Touch Gesture Reference Guide is a unique set of resources for software designers and developers working on touch-based user interfaces. The guide contains: 1) an overview of the core gestures used for most touch commands 2) how to utilize these gestures to support major user actions 3) visual representations of each gesture to use in design documentation and deliverables 4) an outline of how popular software platforms support core touch gestures.

50. Gesturicons by Ron George

gesturicons-iconshock-icons-free
The zipped file contains EPS, PNG and Illustrator files for your use. His approach supports such interactions as taps, holds, double taps, flicks and is achieved with circular shapes.

51. Wireframe symbols by Johnny nines

wireframsymbols-iconshock-icons-free
This download contains the symbol library and a full Adobe Illustrator file with scroll bars, lists, buttons, tables, tabs and much more. To install this library just drag and drop the file named “Wireframe Symbols.ai” into your Adobe Illustrator Symbols directory. Once you are in Illustrator go to your Symbols Palette and load the library. This file is compatible on both Mac and PC. If you know others that would benefit from this file by all means send it along to them.

52. Mobile by Yahoo!

mobile-iconshock-icons-free
Cellphone stencil from the Design Stencil kit in the Yahoo! Design Pattern Library. Template for use in Omnigraffle.

53. Nintendo DS by Pancake Show

nintendoDs-iconshock-icons-free
This is a stencil on a Nintendo DS Lite. Very helpful if you need to do screen mock ups. Template for use in Omnigraffle.

54. Carousels by Yahoo!

carrousels-iconshock-icons-free
Carousels stencil from the Design Stencil kit in the Yahoo! Design Pattern Library. Template for use in Omnigraffle.

55. Wireframing kit for Google drawings by Morten Just

google-iconshock-icons-free
UX designer Morten Just made this very useful set of stencils for the Google drawings inline app. He states at his homepage five interesting reasons it’s better than Omnigraffle, so you got to check this out. He might be right.

56. Aqua GUI by Velijn

aqua-iconshock-icons-free
A series of elements inspired by the GUI Design Palette 1.2 and the Mac OS X interface stencils, based upon Aqua, and mainly aimed at making simple windows designs. Template for use in Omnigraffle.

57. OS Elements by Yahoo!

os-iconshock-icons-free
OS elements stencil from the Design Stencil kit in the Yahoo! Design Pattern Library. Template for use in Omnigraffle.

58. Twitter Widgets by Psheridan

twitter-iconshock-icons-free
Twitter and Tweetmeme widgets. Template for use in Omnigraffle.

59. Windows GUI Design by Omnigroup

windowsxp-iconshock-icons-free
User interface elements for the Windows operating system, in case you have to design an interface where Aqua widgets are considered a strange and mysterious concept, and liking them is totally out of the question. Template for use in Omnigraffle.

60. X box 360 Controller by Pancake Show

xbox-iconshock-icons-free
This is a stencil for the Xbox 360 controller. It’s very helpful if you need to do game control design. Template for use in Omnigraffle.

61. Form element templates by Web designers Toolkit

form-iconshock-icons-free
Free Photoshop browser templates for your professional screen designs. They come in 1024×768 pixels and 800×600 pixels size, with all kinds of different browser flavors and with a few extras on top.

62. Android Sketch Stencil by Mikec78uk

android-sketch-iconshock-icons-free
Sketch style Android OmniGraffle template. The purpose of the sketch style wireframe is to prevent the intended audience from thinking about visual design and encourages them to focus on the functionality and behavior being proposed.

63. Stencil kit by Quommunication

stencilkit-iconshock-icons-free
This is the starter kit employed by the famous design company quommunication uses for their designs, including their star product “Newa” one of the best high end Wordpress themes around. this PSD file contains common design elements for sketching and wire framing like form elements, RSS feed icons, colors, Advertising units, browser windows and grids

64. Facebook applications stencil Kit by Fjcsar

facebookui-iconshock-icons-free
A pretty sizable collection of Facebook related elements to use in creating wireframes for Facebook applications. Template for use in Omnigraffle.

65. Sketching and wire framing kit by Janko at warp speed

jankowirframe-iconshock-icons-free
This kit is full of form elements, icons, indicators, feedback messages, tooltips, navigation elements, image placeholders, embedded videos, sliders and common ad banners. The Kit comes in two vector formats, one for Adobe Illustrator and the other in SVG vector format that can be easily modified. It can also be downloaded in PDF and EPS formats.

66. Omnigraffle wireframe stencils by Konigi

omnigraffle-iconshock-icons-free
This is a set of shapes for making wireframes (low-fidelity web page schematics) in OmniGraffle  version 5.x (Mac OS X). It consists of most of the basic elements you’ll need to create user interface specifications.

67. Best Practice UX Forms Stencil v1.1 by  Ryan Younger

bestpracticeux-iconshock-icons-free
This is the second, more comprehensive release of this stencil which follows best practice UX form design practices, providing three different ways of laying forms out, each with their own benefits. This version also provides different button layouts, a progress indicator, captcha code input field, labels and more. Template for use in Omnigraffle.

68. Flex 3 Stencil by Theresa Neil

flex-iconshock-icons-free
Includes all Flex components from Flex 3 Style Guide: panels, data grid, buttons, fields, links, toggle, menu, scrolls, accordion, tabs, list, data picker, tool tip, errors. Template for use in Omnigraffle.

69. Mac OS X Interface 2 by Omnigroup

mac-iconshock-icons-free
More new major Omni application updates mean a new, cleaner, more Leopardy interface stencil. This one makes extensive use of tables, for maximum flexibility while maintaining pixel precision. Template for use in Omnigraffle.

70. Eclipse Stencil for Omnigraffle by Data Bene

eclipse-iconshock-icons-free
Template for use in Omnigraffle.

High quality GUI elements

separator

71. RIM Blackberry by Digital Phenom

blackberry-iconshock-icons-free
This is an incredibly realistic depiction of a Blackberry, composed by more than 100 photoshop layer that you can use as separate elements for your mockups and mobile apps.

72. GUI elements by Artgen

artgen-iconshock-icons-free
This useful PSD file includes a great selection of GUI elements that you can use for free for both commercial and free app development (with attribution). All elements are on their own layers which should make customization really quick and easy.

73. iphone Safari Browser by Designers Toolbox

iphone-iconshock-icons-free
Excellent resource for your mockups or actual apps. Each element comes in a different PSD layer.

74. iphone style checkboxes by Tdreyno

iphone checks-iconshock-icons-free
Nice iphone style checkboxes.

75. Web UI element Pack by Web stuff share

webui-iconshock-icons-free
User Interface Element Pack in PSD format, containing 19 elements including Loading Bar, Button in normal and clicked state, Button toggle, close, next, previous and paging icon and slider.

76. Android GUI by Pavel Maček

android-II-iconshock-icons-free
Android GUI PSD is inspired by idea of teehan+lax and is not intended to be used for final implementation. The PSD file comes with tons of resizable basic elements in vector paths, basic screens and a cool resizable phone illustration in vectors.

77. Vector Icons Pack by Gosquared club

Vector-iconshock-icons-free
85 shining icons ready for your next design. Downloads available in svg, and ai files.

78. MAC OS window elements by David Mcleod

macwindow-iconshock-icons-free
Nice PSD file with some MAC OS Window elements.

79. iphone 3G Stencil by Theresa Neil

iphone-GUI-iconshock-icons-free
Includes standard interface components for the iPhone 3G: buttons, fields, map elements, keyboards, icons… All components are on a transparent background and should re-size nicely.

80. Checkbox replacement by Web stuff share

checkbox-iconshock-icons-free
This PSD file contains 6 different checkbox styles, including rounded-style checkbox, square-style checkbox, button-style, FireRift-style and iPhone-style.

81. Web designer Mini Kit by Tanya

webdesigner-mini-iconshock-icons-free
This set includes stuff to make registration fields and menus, checkboxes and ratio buttons, cursors and pointer hands.

82. Web UI treasure chest by Tanya

treasure chest-iconshock-icons-free
This PSD layered file, most of whose files are fully editable, contains more than 100 elements for website design.

83. Palm pre by Geoff Teehan

palmpre-iconshock-icons-free
The Palm Pre offers another way to present ideas that connect clients with their customers. Each element is built with vectors for easy editing and scaling.

84. iPhone GUI as Rich Symbols for Fireworks by Jcorrea

iphone-symbols-iconshock-icons-free
This is an incredible vectorized iPhone GUI Fireworks Library. Each element is a vector rich symbol with variables.

85. Firefox browser and form elements by Designers Toolbox

browserfirefox-iconshock-icons-free
Complete set of browser elements and form objects for Mozilla Firefox browser on Windows Vista.

86. Form elements by Webdesigners Toolkit

photoshop-iconshock-icons-free
You need an active checkbox for your screendesign? A radio button, a select box? And you’re tired of making the same screenshot over and over again? Look no further: These free photoshop form element templates for your professional screen design include all common standard form fields , mouse and link pointer and are optimized for ease-of-use.

87. iphone starter’s kit by Renee Rist

iphonestarters-iconshock-icons-free
This set comes with several button elements as well as six different iPhone interface options. This pack may be useful for mobile developers and front-end designers who need a professional way to show mock-ups to clients or to work out ideas.

88. iphone application GUI by Freshbooks

freshiphone-iconshock-icons-free
One of the best iphone templates out there. Very thorough, includes some controls not available on other packs.

89. Iphone GUI elements by Webdesigners Toolkit

iphoneGUI-iconshock-icons-free
Status bars, bar buttons, icon bar, pull down menus, large buttons, keyboards and many more.

90. Media GUI by Prekesh Chavda

media-iconshock-icons-free
itunes-quicktime style media controls and viewer. Comes in a PSD file.

91. 20 handmade buttons and UI elements by Nerdburn

nerdburn-iconshock-icons-free
Each of the elements is in it’s own Photoshop folder, so you can just drag them in to your existing PSD’s.

92. UI set by Medialoot

medialoot-iconshock-icons-free
Massive set of UI elements both in PNG and PSD versions.

93. Facebook GUI by Ney Ricardo

facebookgui-iconshock-icons-free
GUI kit for Facebook application design.

94. MobileMe full iphone GUI by Shubham Kedia

mobileme-iconshock-icons-free
MobileMe Full GUI Theme (Beta 5).

95. MAC OS Safari Elements by Webdesigners Toolkit

mac-safari-iconshock-icons-free
Incredible list of buttons, form fields, scrolls and everything you need to build your safari mockups.

96. Android 2.0 GUI by Thiago Silva

14android-screens-iconshock-icons-free
14 Screens of the android interface (eclair). Screens are in original resolution (320px x 480px), in .psd format.

97. Google nexus one Template by Ilia Draznin

nexusone-iconshock-icons-free
480×800 file with menus, list items, tabs, arrows of the updates Google Nexus one.

98. Internet Explorer Browser and form elements by Webdesigners Toolkit

ie-vista-GUI-iconshock-icons-free
Extensive list of GUI elements for Internet Explorer on Windows Vista.

99. Windows 7 active window by Carlos Way

windows-vista-iconshock-icons-free
Nice Photoshop layered file with all elements of a Windows 7 active window.

100. Browser Templates by Joel Laumans

Browser-templates-iconshock-icons-free
PSD file with three different browser resolutions; all with easily editable titles, address bars, scrollbars, and favicons. The set contains easily editable browser windows (Firefox OSX, Firefox Windows, and Internet Explorer) in 3 different resolutions (1280×1024, 1024×768, 800×600) all in a neatly organized .PSD file.

101. Windows XP active window by Carlos Way

xp-GUI-iconshock-icons-free
Perfect XP window with separate layers for reach element.

102. Windows 7 Taskbar by Carlos Way

windows7-taskbar-iconshock-icons-free
Perfect Windows 7 Taskbar in PSD layered file.

103. Ipad GUI by Iconshock

ipad-iconshock-icons-free
This set contains almost all ipad UI elemments, including buttons, tabs, menus, keyboard, balloons, etc etc… very useful for designers and developers, it includes scalable and totally editable vector versions (adobe illustrator)

104. Web designer toolkit by Temmplay

templaywireframe-iconshock-icons-free
Standard Web Interface Elements in PSD.

105. Browser form elements by Geoff Teehan

browser-iconshock-icons-free
Included is a set of from elements in PSD for Mac Firefox 3 and Vista IE7.