WebAppers

/ best free open source web resources /

Shopify

A Fresh User Interface Kit Free for Download

Posted · Category: Buttons, License Free

Have a good interface is key to guide them through the content and meet their expectations. A good User Interface is consistent and can make a website easier to understand and use. Also, a beautiful UI can be a critical point for users when deciding between two websites or applications.

Here you will find the simple and Fresh UI Kit by Abhimanyu Rana. You can download it directly here. Also, you can take a look at A Comprehensive Collection of Free UI Kits & Templates we have published some time ago as well.

fresh-ui-kit

Requirements: -
Download: http://d.pr/f/rEyg
License: License Free

43 Free CSS3 Pictogram Buttons with 3 Styles

Posted · Category: Buttons, License Free

CSS3 Pictogram Button is a set of 43 button with three different styles and six different colors and using entypo pictogram for replacing the images.

Three different styles includes : Beveled, Rectangle and Rounded. While there are six colors you can choose : Orange, Magenta, Cyan, Red, Black and Green. Those buttons also have three different states : normal, hover and active. No images, all buttons are using CSS and font.

css-pictogram-buttons

Requirements: CSS3 Support
Demo: http://www.webstuffshare.com/2012/05/css3-pictogram-button/
License: License Free

More Awesome CSS3 Buttons for Your Web Application

Posted · Category: Buttons, License Free

Whether you’re designing a website or a web application, you’ll need buttons for it. Now, with CSS3′s help, it was never easier to create nice looking buttons. In the article: Just some other awesome CSS3 buttons, you’ll learn how to create some cool CSS3 buttons in just a few steps.

The buttons are scalable, depending on font size. And styles as color and background are easy to update via CSS. The buttons do not use any image, automatically there’s no extra HTTP image request. No image to load means faster rendering.

css3-buttons

Requirements: CSS3 supported browsers
Demo: http://www.red-team-design.com/just-another-awesome-css3…
License: License Free

How to Create Google+ Buttons in CSS

Posted · Category: Buttons, CC License

Google rolled out a new design across many of their services as part of the Google+ launch. The new look presents a sleeker, simplified Google that puts the emphasis on your data and not on the interface. Part of the design’s success are the new buttons.

Great UIs tend to have simple, obvious buttons that are standard across the entire application. Pixify has created Google+ Buttons in CSS that you can apply to your app’s UI. You can also check out Use Apple OS X Lion to Improve Your UI.

google-plus-buttons

Requirements: Firefox, Chrome, Safari, IE7+, IE6
Demo: http://pixify.com/blog/use-google-plus-to-improve-your-ui/
License: Creative Commons License

A Really Nice Collection of CSS3 Buttons

Posted · Category: Buttons, License Free

This is a collection of buttons that show what is possible using CSS3. Almost all of these buttons look best in Chrome and Safari on OSX. They look almost as good in Firefox, with all other browsers receiving a less-styled button.

css3-buttons

Requirements: CSS3
Demo: http://ubuwaits.github.com/css3-buttons/
License: License Free

How to Create BonBon Buttons with CSS3

Posted · Category: Buttons, License Free

BonBon Buttons are sweet CSS3 buttons that are sexy looking, really flexible, but with the most minimalistic markup as possible. There are 3 different materials. A “mate”, “glossy” and a “glass” version. The difference of the later two is that the glass version adds a dark blurry text-shadow which makes it look like you can see trough the button to its bottom.

However, BonBon Buttons are not meant to be used on your next project that targets the average internet user. He just wanted to show a couple techniques how to use some of the new CSS3/HTML5 features. So only the current version of Safari, Chrome and Firefox are supported.

css3-buttons

Requirements: CSS3 Support
Demo: http://lab.simurai.com/css/buttons/
License: License Free

How to Create GitHub Style Buttons with CSS & Javascript

Posted · Category: Buttons, License Free

Are you a GitHub fan? We all know that GitHub is the perfect place to store repositories of open source code. GitHub seems to understand that most repo sites are usually boring so they’ve spiced their site up with some catchy CSS and great JavaScript features. One tiny piece of the GitHub design David Walsh loves are the basic buttons.

David Walsh has written a tutorial: Create GitHub-Style Buttons with CSS and jQuery, MooTools, or Dojo JavaScript, in order to teach us how to create our own GitHub-style buttons with a bit of HTML, CSS, and JavaScript.

github-buttons

Requirements: Dojo, Mootools or jQuery Framework
Demo: http://davidwalsh.name/dw-content/github-button.php
License: License Free

How to Create a Realistic Looking Button with CSS3

Posted · Category: Buttons, License Free

How to Create a Realistic Looking Button with CSS3? The whole idea is to use a combination of subtle effects to create a three dimensional object. The idea is that: The button is set into the canvas. The texture of the button is different from the canvas and the surface is slightly raised. And the text of the button is pressed into it.

By going into the detail you can use these techniques in your designs. Think about your designs in 3D. It is less about using the specific border effects and more about using them together to achieve an overall look.

3d-buttons-css3

Requirements: CSS3
Demo: http://blog.anomalyinnovations.com/2010/03/creating-a-realistic…
License: License Free

Google’s Imageless Button with StyledButton jQuery Plugin

Posted · Category: Buttons, GPL License, MIT License

StyledButton jQuery plugin is an attempt to recreate Google’s imageless buttons and prove that it doesn’t take a whole team of engineers and an endless cycle of code revision and quality control (their own words) to pull this off.

The buttons automatically adapt to paddings and other styling you wish to use. They allow for a lot of stylistic customisation via a few lines of css while keeping all the display critical css rules hidden deep inside the plugin.

jquery-google-buttons

Requirements: jQuery Framework
Demo: http://swizec.com/code/styledButton/
License: MIT, GPL License

How to Create Glowing, Radioactive Buttons with CSS

Posted · Category: Buttons

Using CSS animations in Safari, we’re able to turn an otherwise ordinary button into a glowing, Radioactive Buttons. Be sure you’re in Safari / Chrome browser before getting underway. You can set the Animation name, Animation duration and the number of times it repeats.

You can see how these come together on the right. The CSS calls a pre-defined animation you create, assigns it a duration, and tells it how long to repeat. Pretty sweet, right?

glowing-buttons

Requirements: Safari or Chrome Browser
Demo: http://www.zurb.com/playground/radioactive-buttons
License: License Free

Page 2 of 4«1234»
Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons