Connect With WRD
feed via e-mail
feed via e-mail

Archive for the ‘Buttons’ Category

Web designers have easy access to loads of freebies on the Internet. Both website layouts and mobile applications can benefit from these free resources. Focusing directly on interfaces can help new designers understand the basics of page structure and color schemes.

This gallery includes a number of free buttons released as PSD graphics and HTML/CSS code snippets. Buttons are useful in practically every website or mobile app. Take a look over some of these examples and try using the best ones in your next project.

Clean Popup UI

clean popup ui design button psd

Read the rest of this entry »

Buttons is a CSS library for creating highly customizable, flexible and modern web buttons.

It is built with Sass + Compass and has support for square, rounded or circular buttons that can be flat or not and having custom effects (like glow).

The sizes, colors, effects and fonts used can all be changed with the help of variables and it can be extended easily.

P.S. A Ruby Gem-friendly version exists as well.

CSS Buttons Library

For e-commerce websites, icons and buttons for payment processors are always needed.

Pepsized, a creative website providing design freebies and tutorials, is sharing a huge set of free buttons for payment services.

Payment Buttons

There are 75 items in the set and all have 2 sizes (99×66px and 64×43px) in PNG format.

Also, a blank PSD button exists for creating any new ones.

  • Tags:
  • Filed under: Buttons, Design, Other License
  • When it comes to finding buttons to use in your next project, designing one from scratch might not always be the best (or fastest) way to proceed.

    You might want to use one of the many ready-to-use free PSD button sets available on the web.

    In this post, we have rounded up lots of PSD button sets which you can use freely and edit/improve as wished. Here they are:


    Favbulous Colourful Buttons

    Favbulous Colourful Buttons

    Classic PSD Web Buttons Vol 1

    Classic PSD Web Buttons Vol 1

    Read the rest of this entry »

    Zocial is a semantic set of CSS buttons (no images used) that are beautified with @font-face icons.

    There are buttons for 40+ services including Facebook, Twitter, Google+, PayPal, LinkedIn and much more.

    Each button can be displayed with or without text (only icons) and the HTML element wrapping them can be anything (which is nice for flexibility).

    Zocial CSS Icons

  • Tags:
  • Filed under: Buttons, Design, License Free
  • Bruce Galpin is sharing a framework of good-looking and Google+ styled buttons in his blog.

    The buttons can use text, images or both inside them and comes with the high-quality icon set created by WebDesignShock.

    As the icons have both standard and active state versions, buttons respond well to hovering them.

    There is also a drop-down menu buttons version provided which is handy for presenting multiple options while still being in harmony with the rest of the buttons.

    Google+ Styled Buttons

  • Tags:
  • Filed under: Buttons, CC License, Design
  • Resources on creating CSS3 buttons that looked stylish was shared previously at WRD.

    CSS3 Buttonize Framework is a new addition to this list which comes with styles for creating buttons in various sizes.

    Icons can be used inside the items and there are ready-to-use classes for building disabled, striped or highlighted buttons and a panel/horizontal navigation.

    CSS3 Buttonize Framework

    For years, it was images or JavaScript that usually helped us to create non-standard and attractive buttons.

    With the getting-wider support for CSS3 features and stable resources that can CSS3-enable non-compatible browsers, there are no obstacles left for using CSS3 buttons.

    Using CSS3 properties, there is a huge space of creativity for designing buttons; using border-radius for rounded corners, linear-gradient and box-shadow for creating depth, transitions for the animations and more.

    Here is a list of 10+ nicely-coded and creative CSS3 buttons where you can use or get inspired. Also, you can find all other CSS3-buttons related resources that can help you to create better ones at the end of the article.

    CSS3 Buttons With Simple Markup

    CSS3 Buttons

    A set of 18 buttons that are created with a simple markup as much as possible.

    While 3 of them are WebKit-only, the other are compatible with all modern browsers.

    GitHub-Style CSS3 Buttons

    GitHub Style CSS3 Buttons

    This is a simple CSS framework for creating GitHub-style buttons.

    The buttons can have rounded corners and icons (a CSS sprite with a list of icons exist).

    Read the rest of this entry »

    We Love Buttons is a project by Pico, a tiny design & development studio, where various designers have created good-looking and imageless CSS3 buttons.

    There are ~35 buttons and most of them only works in WebKit browsers which makes the project more an experimental one.

    They use CSS3 properties like box-shadow, border-radius or gradients and have a clean code where anyone who is not that familiar with CSS3 can easily learn from.

    We Love Buttons

    Using the new features and flexibility CSS3 offers, designers keep coming with impressive outputs.

    One of them is BonBon Buttons: attractive buttons that will possibly attract the Web 2.0-type design fans the most.

    CSS3 BonBon Buttons

    A single PNG image is used to give the noise effect and they have a shiny 3D-like look.

    There is also a method provided for inserting Unicode Symbols inside buttons with the help of HTML5 custom data attributes.

  • Tags:
  • Filed under: Buttons, Design, No License
  • Uptime Robot